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

Fine lightbox controls #587

This commit is contained in:
Patrik J. Braun 2023-09-04 21:52:15 +02:00
parent a5c90c7dad
commit e3eda4676e
4 changed files with 24 additions and 18 deletions

View File

@ -356,7 +356,7 @@ export class GalleryGridComponent
// (on lightbox navigation)
while (
(this.mediaToRender.length - 1 < groupIndex &&
this.mediaToRender[this.mediaToRender.length - 1].media.length < mediaIndex) &&
this.mediaToRender[this.mediaToRender.length - 1]?.media?.length < mediaIndex) &&
this.renderARow() !== null
// eslint-disable-next-line no-empty
) {

View File

@ -5,7 +5,7 @@
<div [class.dim-controls]="controllersDimmed"
class="controls controls-top">
<div class="controls-background rounded-start-bottom pe-1 pt-1">
<div class="controls-background rounded-start-bottom">
<div class="highlight control-button" (click)="toggleInfoPanel.emit()"
title="info key: i" i18n-title>
<ng-icon name="ionInformationOutline"></ng-icon>

View File

@ -17,6 +17,11 @@
-moz-transition: all 0.3s ease-in-out;
}
.controls-background {
display: inline-block;
background-color: rgba(0, 0, 0, 0.2);
}
.sebm-google-map-container {
width: 100%;
height: 100%;
@ -49,7 +54,6 @@
height: initial;
text-align: right;
width: 100%;
padding: 5px;
font-size: large;
}

View File

@ -20,23 +20,25 @@
<div id="controllers-container" *ngIf="controllersVisible">
<div id="controls">
<div class="highlight control-button"
*ngIf="fullScreenService.isFullScreenEnabled()"
(click)="fullScreenService.exitFullScreen()" title="toggle fullscreen, key: f" i18n-title>
<ng-icon style="margin-right: 0.2em; margin-top: -0.05em" class="align-top" size="0.9em"
name="ionContractOutline"></ng-icon>
<div class="controls-background rounded-start-bottom">
<div class="highlight control-button"
*ngIf="fullScreenService.isFullScreenEnabled()"
(click)="fullScreenService.exitFullScreen()" title="toggle fullscreen, key: f" i18n-title>
<ng-icon style="margin-right: 0.2em; margin-top: -0.05em" class="align-top" size="0.9em"
name="ionContractOutline"></ng-icon>
</div>
<div class="highlight control-button"
*ngIf="!fullScreenService.isFullScreenEnabled()"
(click)="fullScreenService.showFullScreen(root)" title="toggle fullscreen, key: f" i18n-title>
<ng-icon style="margin-right: 0.2em; margin-top: -0.05em" class="align-top" size="0.9em"
name="ionExpandOutline"></ng-icon>
</div>
<div class="highlight control-button" (click)="hide()" title="close, key: Escape" i18n-title>
<ng-icon size="1.2em" name="ionCloseOutline"></ng-icon>
</div>
</div>
<div class="highlight control-button"
*ngIf="!fullScreenService.isFullScreenEnabled()"
(click)="fullScreenService.showFullScreen(root)" title="toggle fullscreen, key: f" i18n-title>
<ng-icon style="margin-right: 0.2em; margin-top: -0.05em" class="align-top" size="0.9em"
name="ionExpandOutline"></ng-icon>
</div>
<div class="highlight control-button" (click)="hide()" title="close, key: Escape" i18n-title>
<ng-icon size="1.2em" name="ionCloseOutline"></ng-icon>
</div>
</div>
</div>
</div>