quatuorbellefeuille.com

commit 6ac99280d7c8e59220377c7ba7d33edfd1764537
parent 7dd251dbdf3cc77a4befec02199750e6ce976019
Author: Kévin Le Gouguec <kevin.legouguec@gmail.com>
Date:   Tue, 29 Dec 2020 20:10:25 +0100

Zoom portraits on hover

😍✨𝒶𝓃𝒾𝓂𝒶𝓉𝒾ℴ𝓃𝓈✨😍

Diffstat:
M
quatuor.css
 | 
14
++++++++------

1 file changed, 8 insertions(+), 6 deletions(-)
diff --git a/quatuor.css b/quatuor.css
@@ -26,6 +26,12 @@ main #photos {
     position: relative;
     width: 6em;
     height: 100%;
+    border-color: #ddd;
+    border-width: 0.3em;
+    border-style: solid;
+    border-radius: 0.3em;
+    box-sizing: border-box;
+    overflow: hidden;
 }
 
 #photos a img {
@@ -34,17 +40,13 @@ main #photos {
     height: 100%;
     object-fit: cover;
     object-position: center;
-    border-color: #ddd;
-    border-width: 0.3em;
-    border-style: solid;
-    border-radius: 0.3em;
-    box-sizing: border-box;
     filter: grayscale(1);
-    transition: filter 1s;
+    transition: filter 1s, transform 1s;
 }
 
 #photos a img:hover {
     filter: none;
+    transform: scale(1.05);
 }
 
 #photos a:nth-of-type(1) {