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

Add background color to loading photos #587

This commit is contained in:
Patrik J. Braun 2023-09-09 23:17:57 +02:00
parent b5a0b353e1
commit 009246707f
9 changed files with 16 additions and 6 deletions

View File

@ -31,7 +31,7 @@ a {
border: 1px solid #333;
width: 180px;
height: 180px;
background-color: #bbbbbb;
background-color: var(--item-background);
}
.no-image {

View File

@ -40,7 +40,7 @@ a {
border: 1px solid #333;
width: 180px;
height: 180px;
background-color: #bbbbbb;
background-color: var(--item-background);
}
.no-image {

View File

@ -14,7 +14,7 @@ a {
border: 1px solid #333;
width: 180px;
height: 180px;
background-color: #bbbbbb;
background-color: var(--item-background);
}

View File

@ -1,7 +1,7 @@
.static {
width: 100%;
height: 100%;
background-color: #bbbbbb;
background-color: var(--item-background);
color: #7f7f7f;
font-size: 50px;
}
@ -23,7 +23,7 @@
.sk-cube-grid .sk-cube {
width: calc(100% / 3);
height: calc(100% / 3);
background-color: #bbbbbb;
background-color: var(--item-background);
float: left;
}

View File

@ -19,6 +19,10 @@ img {
vertical-align: unset;
}
img.loading{
background: var(--item-background) ;
}
@keyframes fadein {
from {
opacity: 0;

View File

@ -2,6 +2,8 @@
<img alt="{{gridMedia.media.name}}" #img [src]="thumbnail.Src"
(load)="loaded=true"
[class.loading]="!loaded"
*ngIf="thumbnail.Available">
<app-gallery-grid-photo-loading

View File

@ -29,6 +29,7 @@ export class GalleryPhotoComponent implements IRenderable, OnInit, OnDestroy {
searchEnabled = true;
wasInView: boolean = null;
loaded = false;
constructor(
private thumbnailService: ThumbnailManagerService,

View File

@ -138,7 +138,7 @@
}
::ng-deep .lightbox-map-gallery-component-preview-loading {
background-color: #bbbbbb;
background-color: var(--item-background);
color: var(--bs-secondary-color-rgb);
}

View File

@ -1,3 +1,6 @@
:root{
--item-background: #bbbbbb
}
a {
text-decoration: none;