From 5841b80cac6fb25ff03692c7302bd227b1eda863 Mon Sep 17 00:00:00 2001
From: Dermot Duffy <dermot.duffy@gmail.com>
Date: Sun, 26 Jun 2022 14:11:26 -0700
Subject: [PATCH] Change effect to scale whole thumbnail

---
 src/scss/gallery.scss                     | 2 +-
 src/scss/thumbnail-feature-event.scss     | 6 ------
 src/scss/thumbnail-feature-recording.scss | 6 ------
 src/scss/thumbnail.scss                   | 6 ++++++
 4 files changed, 7 insertions(+), 13 deletions(-)

diff --git a/src/scss/gallery.scss b/src/scss/gallery.scss
index f96b5183..662c0a78 100644
--- a/src/scss/gallery.scss
+++ b/src/scss/gallery.scss
@@ -30,7 +30,7 @@
   box-sizing: border-box;
   text-align: center;
   color: var(--primary-text-color, white);
-  border: 2px ridge var(--primary-text-color, black);
+  border: 1px solid var(--primary-color);
   border-radius: var(--ha-card-border-radius, 4px);
 
   // Folder background color should match the thumbnail element background
diff --git a/src/scss/thumbnail-feature-event.scss b/src/scss/thumbnail-feature-event.scss
index 87e0a836..6587c6f9 100644
--- a/src/scss/thumbnail-feature-event.scss
+++ b/src/scss/thumbnail-feature-event.scss
@@ -18,8 +18,6 @@ img, ha-icon {
   // should be clipped to fill the thumbnail div whilst maintaining
   // aspect-ratio.
   object-fit: cover;
-
-  transition: transform 0.2s linear;
 }
 
 ha-icon {
@@ -31,7 +29,3 @@ ha-icon {
   border: 1px solid rgba(255,255,255,0.3);
   box-sizing: border-box;
 }
-
-img:hover {
-  transform: scale(1.04);
-}
\ No newline at end of file
diff --git a/src/scss/thumbnail-feature-recording.scss b/src/scss/thumbnail-feature-recording.scss
index 8c74db45..62907313 100644
--- a/src/scss/thumbnail-feature-recording.scss
+++ b/src/scss/thumbnail-feature-recording.scss
@@ -16,12 +16,6 @@
   box-sizing: border-box;
 
   color: var(--primary-text-color);
-
-  transition: transform 0.2s linear;
-}
-
-:host(:hover) {
-  transform: scale(1.04);
 }
 
 div {
diff --git a/src/scss/thumbnail.scss b/src/scss/thumbnail.scss
index 9e57ee21..250282a9 100644
--- a/src/scss/thumbnail.scss
+++ b/src/scss/thumbnail.scss
@@ -6,6 +6,8 @@
   // Ensure control icons are relative to the thumbnail.
   position: relative;
   overflow: hidden;
+
+  transition: transform 0.2s linear;
 }
 
 :host(:not([details])) {
@@ -22,6 +24,10 @@
   background-color: var(--primary-background-color, black);
 }
 
+:host(:hover) {
+  transform: scale(1.04);
+}
+
 ha-icon {
   position: absolute;
   border-radius: 50%;