1
0
mirror of https://github.com/bpatrik/pigallery2.git synced 2024-12-23 01:27:14 +02:00

Creating menu item to fix navbar on top (do not show on scroll) #587

This commit is contained in:
Patrik J. Braun 2023-03-27 22:35:36 +02:00
parent 0a54f99b9b
commit b8cf00c076
2 changed files with 31 additions and 7 deletions

View File

@ -1,6 +1,6 @@
<ngx-loading-bar [includeSpinner]="false" color="#337ab7" height="3px"></ngx-loading-bar>
<div #navContainer class="navbar-container auto-hide-navbar"
[class.navbar-keep-top]="navbarKeepTop"
[class.navbar-keep-top]="navbarKeepTop || fixNavbarOnTop"
[class.hide-navbar]="!navbarKeepTop && shouldHideNavbar"
[class.animate-navbar]="animateNavbar">
<nav class="navbar navbar-expand bg-body">
@ -64,7 +64,7 @@
</li>
<li class="nav-item dropdown">
<div class="btn-group" dropdown #dropdown="bs-dropdown" placement="bottom"
[insideClick]="true">
[autoClose]="false" container="body">
<button id="button-alignment" dropdownToggle
type="button" class="btn btn-dark dropdown-toggle"
aria-controls="dropdown-alignment">
@ -148,12 +148,35 @@
</ng-container>
<hr class="d-md-none"/>
<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>
<li role="menuitem" dropdown [autoClose]="false"
placement="bottom left" container="body">
<a dropdownToggle class="dropdown-item">
<span class="oi oi-command"></span>
<ng-container i18n>Tools</ng-container>
</a>
<ul class="dropdown-menu dropdown-menu-start" *dropdownMenu role="menu">
<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">
<div class="dropdown-item d-flex justify-content-between">
<span title="key: c" i18n-title i18n>Fix nabvar</span>
<div class="form-check form-switch">
<input class="form-check-input"
type="checkbox"
role="switch"
name="fix-navbar"
id="fix-switch"
[(ngModel)]="fixNavbarOnTop">
</div>
</div>
</li>
</ul>
</li>
<li role="menuitem" *ngIf="isAdmin()">
<a class="dropdown-item" [routerLink]="['/admin']">

View File

@ -42,6 +42,7 @@ export class FrameComponent {
public shouldHideNavbar = false;
public navbarKeepTop = true;
public animateNavbar = false;
public fixNavbarOnTop = false;
@ViewChild('navContainer', {static: true}) navContainer: ElementRef;
@ViewChild('dropdown', {static: true}) dropdown: BsDropdownDirective;
@ViewChild('languageSelector', {static: true}) languageSelector: LanguageComponent;