Fix carousel auto content sizing.

This commit is contained in:
Dermot Duffy
2022-03-20 21:23:11 -07:00
parent 69ee18871f
commit 6430663362
5 changed files with 18 additions and 18 deletions
+5
View File
@@ -0,0 +1,5 @@
ha-icon.favorite {
position: absolute;
color: var(--primary-color);
padding: 2px;
}
+3 -3
View File
@@ -1,6 +1,6 @@
@use '@material/image-list/mdc-image-list';
@use '@material/image-list';
@use 'thumbnail';
@use './favorite.scss';
:host {
display: block;
@@ -50,6 +50,6 @@ ha-card.frigate-card-gallery-folder {
line-height: 1;
}
@include thumbnail.thumbnail-favorite() {
ha-icon.favorite {
opacity: 0.8;
} ;
}
+1 -1
View File
@@ -3,7 +3,7 @@
}
.embla__slide {
flex: 0 0 fit-content;
flex: 0 0 auto;
opacity: var(--frigate-card-carousel-thumbnail-opacity);
transition: opacity 0.6s ease;
}
+7 -11
View File
@@ -1,8 +1,15 @@
@use './favorite.scss';
:host {
display: flex;
flex-direction: row;
--frigate-card-thumbnail-size: 100px;
// Do not let the contain expand to fill more height than the height of the
// thumbnail. Without this the thumbnail carousel will allow the thumbnail to
// expand to the full height of the viewport on a vertical carousel.
max-height: var(--frigate-card-thumbnail-size);
}
:host([details]) {
@@ -53,14 +60,3 @@ div.larger {
span.heading {
font-weight: bold;
}
@mixin thumbnail-favorite() {
ha-icon.favorite {
position: absolute;
color: var(--primary-color);
padding: 2px;
@content;
}
}
@include thumbnail-favorite()