flan/advanced-camera-card
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add thumbnail to live view.

Browse Source
This commit is contained in:
Dermot Duffy
2021-11-25 15:22:41 -08:00
parent cbd2505b98
commit 3c7634d9d5
12 changed files with 273 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/scss/thumbnail-carousel.scss
+9 -3
View File
@@ -1,10 +1,11 @@
:host {
--frigate-card-viewer-thumbnail-size: 100px;
--frigate-card-carousel-thumbnail-size: 100px;
--frigate-card-carousel-thumbnail-opacity: 0.6;
}
.embla__slide {
flex: 0 0 var(--frigate-card-viewer-thumbnail-size);
opacity: 0.4;
flex: 0 0 var(--frigate-card-carousel-thumbnail-size);
opacity: var(--frigate-card-carousel-thumbnail-opacity);
transition: opacity 0.6s ease, transform 0.3s ease;
}
.embla__slide.slide-selected {
@@ -15,4 +16,9 @@
}
.embla__slide img {
border-radius: 5px;
// Not 'contain' as some thumbnails may vary in aspect-ratio slightly and
// should be clipped to fill the thumbnail div whilst maintaining
// aspect-ratio.
object-fit: cover;
}