feat: URLアニメーション

Author: SatooRu65536

Diff for: src/pages/index.astro

@@ -81,7 +81,7 @@ const recentPosts = await getFormatedCollection('posts', 3);
 
   .recent-section {
     max-width: 1200px;
-    text-align: center;
+    action-align: center;
 
     & > div {
       display: grid;
@@ -92,7 +92,7 @@ const recentPosts = await getFormatedCollection('posts', 3);
     }
 
     .more {
-      text-decoration: none;
+      action-decoration: none;
       color: $primary-200;
       font-size: 1.2rem;
       transition: all 0.3s;
@@ -108,3 +108,100 @@ const recentPosts = await getFormatedCollection('posts', 3);
     height: 100%;
   }
 </style>
+
+<script>
+  const emojis = [
+    '🐧',
+    '-🐧',
+    '--🐧',
+    '---🐧',
+    '----🐧',
+    '-----🐧',
+    '------🐧🐻',
+    '-----🐧..🐻',
+    '----🐧!!...🐻',
+    '----🐧!!....🐻',
+    '----🐧!!.....🐻',
+    '----🐧!!.....🐻',
+    '----🐧.......🐻',
+    '----🐧💣......🐻',
+    '----🐧💣.......🐻',
+    '----🐧💣.......🐻',
+    '----🐧💣.......🐻',
+    '----🐧...💣....🐻',
+    '----🐧....💣...🐻',
+    '----🐧.....💣..🐻',
+    '----🐧......💣.🐻',
+    '----🐧........✨🔥',
+    '----🐧........🔥✨',
+    '----🐧........✨🔥',
+    '----🐧........🔥✨',
+    '----🐧........✨🔥',
+    '----🐧........🔥✨',
+    '----🐧........✨🔥',
+    '----🐧........🔥✨',
+    '----🐧.........🐻',
+    '----🐧.........🐻',
+    '----🐧.........🐻',
+    '----🐧.........🐻',
+    '----🐧.........🐻',
+    '----🐧.........🐻',
+    '----🐧.........🐻',
+    '----🐧........🍎🐻',
+    '----🐧........🍎🐻',
+    '----🐧........🍎🐻',
+    '----🐧........🍎🐻',
+    '----🐧.....🍎...🐻',
+    '----🐧....🍎....🐻',
+    '----🐧...🍎.....🐻',
+    '----🐧..🍎......🐻',
+    '----🐧.🍎.......🐻',
+    '----🐧🍎........🐻',
+    '----🍏💫........🐻',
+    '--💫🐧.........🐻',
+    '----🍏💫........🐻',
+    '--💫🐧.........🐻',
+    '----🍏💫........🐻',
+    '--💫🐧.........🐻',
+    '----🐧..........🐻',
+    '----🐧..........🐻',
+    '----🐧..........🐻',
+    '----🐧..........🐻',
+    '----🐧..........🐻',
+    '----🐧..........🐻',
+    '---🚀🐧..........🐻',
+    '---🚀🐧..........🐻',
+    '---🚀🐧..........🐻',
+    '---🚀🐧...........🐻',
+    '---🚀🐧............🐻',
+    '---🚀🐧.............🐻',
+    '-----🚀..............🐻',
+    '-------🚀.............🐻',
+    '----------🚀...........🐻',
+    '-------------🚀.........🐻',
+    '-----------------🚀......🐻',
+    '--------------------🚀....🐻',
+    '-----------------------🚀..🐻',
+    '----------------------------🚀',
+    '--------------------------------🚀',
+    '-------------------------------------🚀',
+    '-------------------------------------------🚀',
+    '----------------------------------------------------🚀',
+    '--------------------------------------------------------------🚀',
+    '-----------------------------------------------------------------------✨🪐',
+    '-----------------------------------------------------------------------✨🪐',
+    '-----------------------------------------------------------------------✨🪐',
+    '-----------------------------------------------------------------------✨🪐',
+    '-----------------------------------------------------------------------✨🪐',
+    '',
+  ];
+
+  const loop = (arr: string[], count = 0, time = 200) => {
+    if (count >= arr.length) return;
+
+    location.hash = arr[count % arr.length];
+    setTimeout(loop.bind(this, arr, count + 1, time), time);
+  };
+
+  setTimeout(() => loop(emojis), 60_000);
+</script>