<div *ngIf="isEnabled"
     class="peek-title-bar"
     [class.bg-danger]="!vortexIsOnline">
    <div class="btn-group"
         role="group">
        <button class="title-bar-btn"
                [routerLink]="['/']">
            <fa name="home" tooltip="Navigate to the home screen"></fa>
        </button>
        <button class="title-bar-btn"
                [routerLink]="['/peek_core_user']">
            <fa name="user" tooltip="Login / Logout"></fa>
        </button>
        <button class="title-bar-btn"
               (click)="showSearchClicked()">
        <fa name="search" tooltip="Search"></fa>
        </button>

        <plugin-search [(showSearch)]="showSearch"></plugin-search>

        <button class="title-bar-btn"
                *ngFor="let link of leftLinks"
                [routerLink]="[link.resourcePath]">
            {{linkTitle(link)}}

        </button>
    </div>

    <div class="title-bar-title">
        {{title}}
    </div>

    <div *ngIf="!vortexIsOnline" class="pull-right">
        <fa name="unlink"
            tooltip="Connection to server is offline"></fa>
    </div>

    <div class="pull-right">
        <div class="btn-group"
             role="group">
            <button class="title-bar-btn"
                    *ngFor="let link of rightLinks"
                    [routerLink]="[link.resourcePath]">
                {{linkTitle(link)}}
            </button>
        </div>
    </div>
</div>
