Add hover and active effects to icon buttons (#116)

kangasta · Feb 13, 2024 · e8d75fa · e8d75fa
1 parent aa281c8
commit e8d75fa
Showing 1 changed file with 8 additions and 0 deletions.
diff --git a/src/components/Menu/IconButton.svelte b/src/components/Menu/IconButton.svelte
@@ -56,6 +56,14 @@
     flex-direction: column
     align-items: center
 
+    transition: transform 125ms
+
+    &:hover
+      transform: scale(1.125) translateY(-0.25rem)
+
+    &:active svg
+      transform: translateY(0.25rem)
+
   .clickable
     cursor: pointer