Nightly - Dialogs and Popups

Basic Popup

This is a completely basic popup, no options set.

<a href="#popupBasic" data-rel="popup"><button data-role="none" class="nightly-button">Basic pop-up<button></a>
<div data-role="popup" id="popupBasic">
    <p>This is a completely basic popup, no options set.</p>
</div>

Menu Popup

<a href="#popupMenu" data-rel="popup"><button data-role="none" class="nightly-button" data-theme="b"><i class="fa fa-navicon"></i>Open menu</button></a>
<div data-role="popup" id="popupMenu" data-shadow="false">
        <ul data-role="listview" data-inset="true" style="min-width:210px;" data-corners="false">
            <li data-role="list-divider">What next?</li>
            <li><a href="#">Share</a></li>
            <li><a href="#">Edit</a></li>
            <li><a href="#">Delete</a></li>
        </ul>
</div>

Form Popup

<a href="#popupLogin" data-rel="popup" data-position-to="window" data-transition="pop"><button data-role="none" class="nightly-button"><i class="fa fa-user"></i>Log in</button></a>    
<div data-role="popup" id="popupLogin" data-theme="a" data-shadow="false" data-corners="false" data-border="true">
    <form>
        <div style="padding:10px 20px;">
            <h3>Log in</h3>
            <label for="un" class="ui-hidden-accessible">Username:</label>
            <input data-role="none" type="text" id="un" value="" placeholder="Username" class="nightly-input" />
            <label for="pw" class="ui-hidden-accessible">Password:</label>
            <input data-role="none" type="password" id="pw" value="" placeholder="Password" class="nightly-input" />
            <button data-role="none" class="nightly-button" data-theme="b"><i class="fa fa-sign-in"></i>Sign in</button>
            <button data-role="none" class="nightly-button" data-theme="a"><i class="fa fa-user"></i>Log in</button>
        </div>
    </form>
</div>/pre>

Full Dialog

Delete document

Do you want to delete the document?

This action cannot be undone.

<a href="#popupDialog" data-rel="popup" data-position-to="window" data-transition="pop"><button data-role="none" class="nightly-button"><i class="fa fa-trash-o"></i>Delete document</button></a> 
<div data-role="popup" id="popupDialog" data-overlay-theme="b" data-theme="b" data-dismissible="false" data-corners="false" data-shadow="false" data-border="true" style="max-width:400px;">
    <div data-role="header" data-theme="b">
        <h2 class="header-title">Delete document</h2>
    </div>
    <div role="main" class="ui-content">
        <h3 class="ui-title">Do you want to delete the document?</h3>
    <p>This action cannot be undone.</p>
        <a href="#" data-rel="back"><button data-role="none" class="nightly-button" data-theme="b">Cancel</button></a>
        <a href="#" data-rel="back" data-transition="flow"><button data-role="none" class="nightly-button" data-theme="b"><i class="fa fa-trash-o"></i>Delete</button></a>
    </div>
</div>/pre>