1
0
mirror of https://github.com/xuthus83/pigallery2.git synced 2025-01-14 14:43:17 +08:00

moving menu link to collapsed menu on small screen #587

This commit is contained in:
Patrik J. Braun 2023-02-28 23:41:54 +01:00
parent 471d770814
commit 15433b7c57
3 changed files with 21 additions and 8 deletions

View File

@ -6,6 +6,17 @@
<img src="assets/icon_inv.png" width="30" height="30" class="d-inline-block align-top" alt="">
<strong class="d-none d-lg-inline-block">{{title}}</strong>
</a>
<div class="d-md-none flex-nowrap ">
<ul class="navbar-nav flex-row ">
<li class="nav-item w-100" *ngIf="showSearch">
<app-gallery-search></app-gallery-search>
</li>
<li class="nav-item" *ngIf="showShare">
<app-gallery-share></app-gallery-share>
</li>
</ul>
</div>
<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">
@ -37,6 +48,12 @@
<div class="text-lg-end w-100">
<ul class="navbar-nav">
<ng-content select="[navbar]"></ng-content>
<li class="nav-item w-100 d-none d-md-block" *ngIf="showSearch">
<app-gallery-search></app-gallery-search>
</li>
<li class="nav-item d-none d-md-block" *ngIf="showShare">
<app-gallery-share></app-gallery-share>
</li>
<li class="nav-item divider-vertical">
</li>
<ng-container *ngIf="authenticationRequired && user.value">

View File

@ -1,4 +1,4 @@
import {Component, ViewEncapsulation} from '@angular/core';
import {Component, Input, ViewEncapsulation} from '@angular/core';
import {Router, RouterLink} from '@angular/router';
import {AuthenticationService} from '../../model/network/authentication.service';
import {UserDTO, UserRoles} from '../../../../common/entities/UserDTO';
@ -18,6 +18,8 @@ import {Utils} from '../../../../common/Utils';
encapsulation: ViewEncapsulation.Emulated,
})
export class FrameComponent {
@Input() showSearch = false;
@Input() showShare = false;
public readonly user: BehaviorSubject<UserDTO>;
public readonly authenticationRequired = Config.Users.authenticationRequired;
public readonly title = Config.Server.applicationTitle;

View File

@ -1,5 +1,5 @@
<app-gallery-lightbox #lightbox></app-gallery-lightbox>
<app-frame>
<app-frame [showSearch]="showSearchBar" [showShare]="showShare">
<ng-container navbar>
<li class="nav-item navbar-text" *ngIf="countDown">
@ -12,12 +12,6 @@
:{{("0" + countDown.second).slice(-2)}}
</span>
</li>
<li class="nav-item w-100" *ngIf="showSearchBar">
<app-gallery-search></app-gallery-search>
</li>
<li class="nav-item" *ngIf="showShare">
<app-gallery-share></app-gallery-share>
</li>
</ng-container>
<ng-container navbar-menu>