From 1a989a10435784cca7f7e6993b63a82030fe062e Mon Sep 17 00:00:00 2001
From: Ardis Lu <ardisglu@gmail.com>
Date: Sun, 21 Jan 2024 22:44:51 -0800
Subject: [PATCH] Add arrow-movement-2

---
 index.html | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/index.html b/index.html
index 511281a..20905ed 100644
--- a/index.html
+++ b/index.html
@@ -321,6 +321,19 @@
       transition: translate 200ms;
     }
 
+    .arrow-movement-2::after {
+      content: "→";
+      display: inline-block;
+      margin-inline-start: 4px;
+      rotate: -45deg;
+      transition: rotate 400ms;
+    }
+
+    :is(.arrow-movement-2:hover, .arrow-movement-2:focus)::after {
+      rotate: 0deg;
+      transition: rotate 200ms;
+    }
+
     .gradient-shadow {
       position: relative;
     }
@@ -585,6 +598,8 @@
 
       <button class="arrow-movement">Arrow movement</button>
 
+      <button class="arrow-movement-2">Arrow movement 2</button>
+
       <button class="gradient-shadow">Gradient drop shadow</button>
 
       <button class="radiating-shadow">Radiating drop shadow</button>
-- 
2.47.3