browser/src/popup/app/vault/views/vault.html

<div class="header header-search">
    <div class="left">
        <a href="" ng-click="expandVault()"><i class="fa fa-external-link fa-rotate-270 fa-lg"></i></a>
    </div>
    <div class="search">
        <input type="search" placeholder="{{i18n.searchVault}}" ng-model="searchText" id="search" ng-disabled="disableSearch" />
        <i class="fa fa-search"></i>
    </div>
    <div class="right">
        <a href="" ng-click="addLogin()"><i class="fa fa-plus fa-lg"></i></a>
    </div>
</div>
<div class="content content-tabs">
    <div ng-if="vaultLogins.length && vaultLogins.length >= 100 && vaultFolders.length && (!searchText || searchText.length < 2)">
        <div class="list">
            <div class="list-section" style="padding-bottom: 0;">
                <div class="list-section-header">
                    {{i18n.folders}}
                    <span>{{vaultFolders.length}}</span>
                </div>
                <a href="#" stop-click ng-click="viewFolder(folder)" class="list-section-item"
                   ng-repeat="folder in vaultFolders | orderBy: folderSort track by $index">
                    {{folder.name}}
                    <i class="fa fa-chevron-right fa-lg"></i>
                    <span class="item-sub-label" ng-if="showFolderCounts">{{folder.itemCount}}</span>
                </a>
            </div>
        </div>
    </div>
    <div ng-if="vaultLogins.length && (vaultLogins.length < 100 || (searchText && searchText.length >= 2))">
        <div class="list">
            <div class="list-grouped" ng-repeat="folder in vaultFolders | orderBy: folderSort track by $index"
                 ng-show="vaultFolderLogins.length">
                <div class="list-grouped-header">
                    <small>{{vaultFolderLogins.length}}</small>
                    <i class="fa fa-folder-open"></i> {{folder.name}}
                </div>
                <a href="#" stop-click ng-click="viewLogin(login)"
                   class="list-grouped-item condensed" title="{{i18n.edit}} {{login.name}}"
                   ng-repeat="login in vaultFolderLogins = (vaultLogins | filter: { folderId: folder.id }
                            | filter: searchLogins() | orderBy: ['name', 'username']) track by $index">
                    <span class="btn-list" stop-prop stop-click title="{{i18n.copyPassword}}" ngclipboard
                          ngclipboard-error="clipboardError(e)" ngclipboard-success="clipboardSuccess(e, i18n.password)"
                          data-clipboard-text="{{login.password}}" ng-class="{'disabled': !login.password}">
                        <i class="fa fa-lg fa-key"></i>
                    </span>
                    <span class="btn-list" stop-prop stop-click title="{{i18n.copyUsername}}" ngclipboard
                          ngclipboard-error="clipboardError(e)" ngclipboard-success="clipboardSuccess(e, i18n.username)"
                          data-clipboard-text="{{login.username}}" ng-class="{'disabled': !login.username}">
                        <i class="fa fa-lg fa-user"></i>
                    </span>
                    <span class="text">
                        {{login.name}}
                        <i class="fa fa-share-alt text-muted" ng-if="login.organizationId" title="{{i18n.shared}}"></i>
                        <i class="fa fa-paperclip text-muted" ng-if="login.attachments" title="{{i18n.attachments}}"></i>
                    </span>
                    <span class="detail">{{login.username}}</span>
                </a>
            </div>
        </div>
    </div>
    <div class="centered-message" ng-if="loaded && !vaultLogins.length">
        <p>
            {{i18n.noLoginsInList}}
            <button ng-click="addLogin()" style="margin-top: 20px;" class="btn btn-link btn-block">{{i18n.addLogin}}</button>
        </p>
    </div>
    <div class="page-loading" ng-if="!loaded">
        <i class="fa fa-lg fa-spinner fa-spin"></i>
    </div>
</div>