xuthus/pigallery2
1
0
Fork 0
mirror of https://github.com/xuthus83/pigallery2.git synced 2025-01-14 14:43:17 +08:00
Code Actions Projects Activity

Improving infobar dark theme #587 #68 #140

Browse Source
This commit is contained in:
Patrik J. Braun 2023-03-13 23:46:45 +01:00
parent 56de7edb4d
commit d2a24b4b56
2 changed files with 8 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/frontend/app/ui/gallery/lightbox/infopanel/info-panel.lightbox.gallery.component.css
View File

@ -1,5 +1,4 @@
.content { .content {
background-color: #F7F7F7;
height: 100%; height: 100%;
overflow-y: auto; overflow-y: auto;
} }
@ -20,7 +19,6 @@
} }
.details-sub { .details-sub {
color: var(--bs-gray-700);
padding: 0; padding: 0;
font-size: 0.875rem; font-size: 0.875rem;
} }
@ -51,7 +49,8 @@
.keywords a, a.dir-link { .keywords a, a.dir-link {
color: var(--bs-gray-900); --bs-text-opacity: 1;
color: rgba(var(--bs-body-color-rgb), var(--bs-text-opacity)) !important;
} }
.keywords a:hover, a.dir-link:hover { .keywords a:hover, a.dir-link:hover {

12
src/frontend/app/ui/gallery/lightbox/infopanel/info-panel.lightbox.gallery.component.html
View File

@ -1,4 +1,4 @@
<div class="content d-flex flex-column"> <div class="content d-flex flex-column bg-body">
<div class="modal-header"> <div class="modal-header">
<h2 class="modal-title" i18n>Info</h2> <h2 class="modal-title" i18n>Info</h2>
<button type="button" class="btn-close" (click)="close()" aria-label="Close"> <button type="button" class="btn-close" (click)="close()" aria-label="Close">
@ -25,7 +25,7 @@
<div class="details-main" > <div class="details-main" >
{{media.name}} {{media.name}}
</div> </div>
<div class="details-sub row"> <div class="details-sub text-secondary row">
<div class="col-4">{{media.metadata.size.width}} x {{media.metadata.size.height}}</div> <div class="col-4">{{media.metadata.size.width}} x {{media.metadata.size.height}}</div>
<div class="col-4" *ngIf="isPhoto()">{{calcMpx()}}MP</div> <div class="col-4" *ngIf="isPhoto()">{{calcMpx()}}MP</div>
<div class="col-4" *ngIf="media.metadata.fileSize">{{media.metadata.fileSize | fileSize}}</div> <div class="col-4" *ngIf="media.metadata.fileSize">{{media.metadata.fileSize | fileSize}}</div>
@ -41,7 +41,7 @@
<div class="details-main"> <div class="details-main">
{{ media.metadata.creationDate | date: (isThisYear() ? 'MMMM d' : 'longDate') : 'UTC' }} {{ media.metadata.creationDate | date: (isThisYear() ? 'MMMM d' : 'longDate') : 'UTC' }}
</div> </div>
<div class="details-sub row"> <div class="details-sub text-secondary row">
<div class="col-12">{{ media.metadata.creationDate | date : 'EEEE, HH:mm:ss' : 'UTC' }}</div> <div class="col-12">{{ media.metadata.creationDate | date : 'EEEE, HH:mm:ss' : 'UTC' }}</div>
</div> </div>
</div> </div>
@ -56,7 +56,7 @@
<div class="details-main"> <div class="details-main">
{{"Video"}} {{"Video"}}
</div> </div>
<div class="details-sub row"> <div class="details-sub text-secondary row">
<div class="col-6" *ngIf="VideoData.duration"> <div class="col-6" *ngIf="VideoData.duration">
<ng-container i18n>duration</ng-container> <ng-container i18n>duration</ng-container>
: {{VideoData.duration | duration}}</div> : {{VideoData.duration | duration}}</div>
@ -80,7 +80,7 @@
<div class="details-main"> <div class="details-main">
{{CameraData.model || CameraData.make || "Camera"}} {{CameraData.model || CameraData.make || "Camera"}}
</div> </div>
<div class="details-sub row"> <div class="details-sub text-secondary row">
<div class="col-3" *ngIf="CameraData.ISO">ISO{{CameraData.ISO}}</div> <div class="col-3" *ngIf="CameraData.ISO">ISO{{CameraData.ISO}}</div>
<div class="col-3" *ngIf="CameraData.fStop">f/{{CameraData.fStop}}</div> <div class="col-3" *ngIf="CameraData.fStop">f/{{CameraData.fStop}}</div>
<div class="col-3" *ngIf="CameraData.exposure"> <div class="col-3" *ngIf="CameraData.exposure">
@ -136,7 +136,7 @@
<div class="details-main"> <div class="details-main">
{{getPositionText() || "Position"}} {{getPositionText() || "Position"}}
</div> </div>
<div class="details-sub row" *ngIf="hasGPS()"> <div class="details-sub text-secondary row" *ngIf="hasGPS()">
<div class="col-12"> <div class="col-12">
{{PositionData.GPSData.latitude.toFixed(6)}}, {{PositionData.GPSData.latitude.toFixed(6)}},
{{PositionData.GPSData.longitude.toFixed(6)}} {{PositionData.GPSData.longitude.toFixed(6)}}