From df503c4164619143d1473fd8366c050603ce8261 Mon Sep 17 00:00:00 2001
From: Ardis Lu <ardisglu@gmail.com>
Date: Sat, 31 Aug 2024 14:50:59 -0700
Subject: [PATCH] Fix SVG drop-shadow transition out

Need to duplicate transition: filter to pre:hover selector since it has higher specificity than svg
---
 index.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index a5ead3c..dee623d 100644
--- a/index.html
+++ b/index.html
@@ -110,17 +110,17 @@
       display: block;
       pointer-events: none;
       opacity: 0.5;
-      transition: opacity 400ms;
+      transition: opacity 400ms, filter 400ms;
     }
 
     :is(pre:hover, pre:focus-within) svg {
-      transition: opacity 200ms;
+      transition: opacity 200ms, filter 400ms;
       opacity: 0.9;
     }
 
     :is(button:hover, button:focus-within) svg {
       filter: drop-shadow(0 0 16px hsl(216deg 50% 65%));
-      transition: filter 200ms;
+      transition: opacity 200ms, filter 200ms;
     }
 
     pre,
-- 
2.47.3