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

improve map controls #587

This commit is contained in:
Patrik J. Braun 2023-09-08 00:34:08 +02:00
parent cd27ca609f
commit f72ef60cf0
3 changed files with 14 additions and 9 deletions

View File

@ -88,6 +88,7 @@
position: absolute; position: absolute;
z-index: 4; z-index: 4;
top: 0; top: 0;
line-height: 0;
} }
.controls-top ng-icon { .controls-top ng-icon {
vertical-align: middle; vertical-align: middle;

View File

@ -19,7 +19,7 @@
.controls-background { .controls-background {
display: inline-block; display: inline-block;
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(var(--bs-body-bg-rgb),0.2);
} }
.sebm-google-map-container { .sebm-google-map-container {
@ -55,15 +55,19 @@
text-align: right; text-align: right;
width: 100%; width: 100%;
font-size: large; font-size: large;
line-height: 0;
} }
#controls span { #controls ng-icon {
margin-left: 6px; vertical-align: middle;
margin-right: 6px;
color: black;
cursor: pointer;
} }
#controls ng-icon ::ng-deep svg {
vertical-align: top;
}
#controls .control-button { #controls .control-button {
margin-left: 0.1em; margin-left: 0.1em;
margin-right: 0.1em; margin-right: 0.1em;

View File

@ -19,19 +19,19 @@
<div id="controllers-container" *ngIf="controllersVisible"> <div id="controllers-container" *ngIf="controllersVisible">
<div id="controls"> <div id="controls" class="controls-top">
<div class="controls-background rounded-start-bottom"> <div class="controls-background rounded-start-bottom">
<div class="highlight control-button" <div class="highlight control-button"
*ngIf="fullScreenService.isFullScreenEnabled()" *ngIf="fullScreenService.isFullScreenEnabled()"
(click)="fullScreenService.exitFullScreen()" title="toggle fullscreen, key: f" i18n-title> (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" <ng-icon size="0.9em"
name="ionContractOutline"></ng-icon> name="ionContractOutline"></ng-icon>
</div> </div>
<div class="highlight control-button" <div class="highlight control-button"
*ngIf="!fullScreenService.isFullScreenEnabled()" *ngIf="!fullScreenService.isFullScreenEnabled()"
(click)="fullScreenService.showFullScreen(root)" title="toggle fullscreen, key: f" i18n-title> (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" <ng-icon size="0.9em"
name="ionExpandOutline"></ng-icon> name="ionExpandOutline"></ng-icon>
</div> </div>
<div class="highlight control-button" (click)="hide()" title="close, key: Escape" i18n-title> <div class="highlight control-button" (click)="hide()" title="close, key: Escape" i18n-title>