1
0
mirror of https://github.com/bpatrik/pigallery2.git synced 2025-03-29 21:56:58 +02:00
pigallery2/src/frontend/app/ui/frame/frame.component.html
2022-12-09 23:06:01 +01:00

94 lines
4.3 KiB
HTML

<ngx-loading-bar [includeSpinner]="false" color="#337ab7" height="3px"></ngx-loading-bar>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" [routerLink]="['/gallery']"
[queryParams]="queryService.getParams()">
<img src="assets/icon_inv.png" width="30" height="30" class="d-inline-block align-top" alt="">
<strong>{{title}}</strong>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false" aria-label="Toggle navigation" (click)="collapsed = !collapsed">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse text-center" id="navbarCollapse" [collapse]="collapsed">
<ul class="navbar-nav me-auto mb-2 mb-md-0 text-lg-start">
<li class="nav-item">
<a class="nav-link"
[routerLink]="['/gallery']"
[queryParams]="queryService.getParams()" [class.active]="isLinkActive('/gallery')" i18n>Gallery</a>
</li>
<li class="nav-item" *ngIf="isAlbumsAvailable()">
<a class="nav-link" [routerLink]="['/albums']" [class.active]="isLinkActive('/albums')" i18n>Albums</a>
</li>
<li class="nav-item" *ngIf="isFacesAvailable()">
<a class="nav-link" [routerLink]="['/faces']" [class.active]="isLinkActive('/faces')" i18n>Faces</a>
</li>
</ul>
<div class="text-lg-end">
<ul class="navbar-nav">
<ng-content select="[navbar]"></ng-content>
<li class="nav-item divider-vertical">
</li>
<ng-container *ngIf="authenticationRequired && user.value">
<li class="nav-item me-2 ms-2 navbar-text">
<span style="white-space: nowrap;">
<span class="oi oi-person"></span> {{user.value.name}}
</span>
</li>
<li class="nav-item divider-vertical">
</li>
</ng-container>
<li class="nav-item">
<span>
<app-language class="navbar-btn" [isDark]="true"></app-language>
</span>
</li>
<li class="nav-item divider-vertical">
</li>
<li class="nav-item dropdown ">
<div class="btn-group" dropdown placement="bottom"
*ngIf="isAdmin() || authenticationRequired">
<button id="button-alignment" dropdownToggle
type="button" class="btn btn-dark dropdown-toggle"
aria-controls="dropdown-alignment">
<span class="oi oi-menu"></span>
<span *ngIf="isAdmin() && notificationService.numberOfNotifications>0"
class="navbar-badge badge badge-warning">{{notificationService.numberOfNotifications}}</span>
</button>
<ul id="dropdown-alignment" *dropdownMenu
class="dropdown-menu dropdown-menu-right"
role="menu" aria-labelledby="button-alignment">
<ng-content select="[navbar-menu]"></ng-content>
<li role="menuitem" *ngIf="isAdmin()">
<a class="dropdown-item" [routerLink]="['/duplicates']">
<span class="oi oi-layers"></span>
<ng-container i18n>Duplicates</ng-container>
</a>
</li>
<li role="menuitem" *ngIf="isAdmin()">
<a class="dropdown-item" [routerLink]="['/admin']">
<span class="oi oi-wrench"></span>
<span *ngIf="notificationService.numberOfNotifications>0"
class="badge">{{notificationService.numberOfNotifications}}</span>
<ng-container i18n>Settings</ng-container>
</a>
</li>
<li role="menuitem" *ngIf="authenticationRequired">
<button class="dropdown-item btn btn-link" (click)="logout()">
<span class="oi oi-account-logout"></span>
<ng-container i18n>Logout</ng-container>
</button>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>
</div>
</nav>
<ng-content select="[body]"></ng-content>