
    <div data-role="header">
        <a href="#/keys"
            data-icon="arrow-l"
            data-direction="reverse"
            class="ui-btn-left">Keys</a>

        <h1>{{name}}</h1>

        {{view Mist.UserMenuView}}

    </div>

    <div class="single-view-header">
        <h3 class="single-view-name">{{name}}</h3>
    </div>

    <div data-role="content">

         <div data-role="collapsible" data-collapsed="false">
            <h3>Public Key</h3>
            <div class="public-key">
                <input type="text" readonly="readonly" {{bindAttr value="pub"}} />
            </div>
        </div>

        <div data-role="collapsible" data-collapsed="false">
            <h3>Private key</h3>
            <div class="private-key">
                <a href="#key-private-dialog"
                    class="action-links"
                    id="key-private-button"
                    data-role="button"
                    data-rel="popup"
                    data-transition="slideup"
                    {{action displayPrivate target="view"}}>Display</a>

                <div data-role="popup" id="key-private-dialog" class="mist-dialog" data-overlay-theme="a">
                    <div data-role="header">
                        <h1>Private Key</h1>
                    </div>
                    {{view Mist.KeyPrivDialog data-role="content"}}
                </div>
            </div>
        </div>

         <div data-role="collapsible" data-collapsed="false" id="single-machines-keys">
            <h3>Machines</h3>
            <ul id="machines-list"
            data-role="listview"
            data-inset="true"
            data-theme="c">
                {{#each view.keyMachines}}
                    {{view Mist.MachineListItemView machineBinding="this"}}
                {{/each}}
            </ul>
        </div>

    </div>


<div data-role="popup" id="dialog-confirm" data-transition="pop" class="mist-dialog">
    <div data-role="header">
        <h1 id="dialog-confirm-title">{{Mist.confirmationController.title}}</h1>
    </div>
    {{view Mist.ConfirmationDialog data-role="content"}}
</div>

<div id="key-associate-dialog" class="mist-dialog" data-role="popup" data-overlay-theme="a">
    <div data-role="header">
        <h1>Associate key</h1>
    </div>
    {{view Mist.KeyAssociateDialog data-role="content"}}
</div>

    <div class="keys-footer" data-role="footer" data-theme="a" style="display: block">
        <div class="actions" data-role="controlgroup" data-type="horizontal">
            <a href="#"
                id="keys-button-delete"
                class="action-links"
                data-role="button"
                data-icon="delete"
                data-rel="popup"
                data-transition="slideup"
                {{action deleteKey target="view"}}>Delete</a>

            <a href="#"
                id="keys-button-associate"
                {{bindAttr class=":action-links view.disabledAssociateClass"}}
                data-role="button"
                data-icon="gear"
                data-rel="popup"
                data-transition="slideup"
                {{action associateKey target="view"}}>Associate</a>
        </div>
    </div>
