bitwarden-estensione-browser/src/popup/vault/current-tab.component.html

<header>
    <div class="left">
        <app-pop-out [show]="!inSidebar"></app-pop-out>
        <button type="button" appBlurClick (click)="refresh()" title="{{'refresh' | i18n}}" *ngIf="inSidebar">
            <i class="fa fa-refresh fa-lg fa-fw"></i>
        </button>
    </div>
    <div class="search">
        <input type="search" placeholder="{{'searchVault' | i18n}}" id="search"
               [(ngModel)]="searchText" (input)="searchVault()" appAutofocus>
        <i class="fa fa-search"></i>
    </div>
    <div class="right">
        <button type="button" appBlurClick (click)="addCipher()" title="{{'addItem' | i18n}}">
            <i class="fa fa-plus fa-lg fa-fw"></i>
        </button>
    </div>
</header>
<content>
    <div class="no-items" *ngIf="!loaded">
        <i class="fa fa-spinner fa-spin fa-3x"></i>
    </div>
    <ng-container *ngIf="loaded">
        <div class="box list" *ngIf="loginCiphers">
            <div class="box-header">
                {{'typeLogins' | i18n}}
                <span class="flex-right">{{loginCiphers.length}}</span>
            </div>
            <div class="box-content">
                <app-ciphers-list [ciphers]="loginCiphers" title="{{'autoFill' | i18n}}" [showView]="true"
                                  (onSelected)="fillCipher($event)" (onView)="viewCipher($event)"
                                  *ngIf="loginCiphers.length"></app-ciphers-list>
                <div class="box-content-row text-center padded no-hover" *ngIf="!loginCiphers.length">
                    <p>{{'autoFillInfo' | i18n}}</p>
                    <button type="button" class="btn primary link block" (click)="addCipher()">
                        {{'addLogin' | i18n}}
                    </button>
                </div>
            </div>
        </div>
        <div class="box list" *ngIf="cardCiphers && cardCiphers.length">
            <div class="box-header">
                {{'cards' | i18n}}
                <span class="flex-right">{{cardCiphers.length}}</span>
            </div>
            <div class="box-content">
                <app-ciphers-list [ciphers]="cardCiphers" title="{{'autoFill' | i18n}}" [showView]="true"
                                  (onSelected)="fillCipher($event)" (onView)="viewCipher($event)"></app-ciphers-list>
            </div>
        </div>
        <div class="box list" *ngIf="identityCiphers && identityCiphers.length">
            <div class="box-header">
                {{'identities' | i18n}}
                <span class="flex-right">{{identityCiphers.length}}</span>
            </div>
            <div class="box-content">
                <app-ciphers-list [ciphers]="identityCiphers" title="{{'autoFill' | i18n}}" [showView]="true"
                                  (onSelected)="fillCipher($event)" (onView)="viewCipher($event)"></app-ciphers-list>
            </div>
        </div>
    </ng-container>
</content>