feat: mark more urls as u-url so they appear in h-card

this makes it so that the user cant trigger a reset of the animation by just placing the cursor at the bottom and the button going out of the cursors area

src/components/navButton.svelte

@@ -10,7 +10,7 @@
 	max-w-36 p-0.5 pr-1.5 border-ralsei-white border-4
 	{highlight
 		? 'min-w-36 bg-gradient-to-l to-ralsei-pink-neon/30 from-ralsei-pink-regular/20 from-30% border-ridge motion-safe:animate-pulse hover:animate-none'
-		: 'w-fit border-double hover:border-solid motion-safe:hover:animate-bounce hover:underline'}
+		: 'w-fit border-double hover:border-solid animate-bounce-reverse hover:underline'}
 	flex gap-1 items-center justify-center align-middle text-center
 	{highlight ? 'text-ralsei-pink-regular app-selected-route' : 'text-ralsei-green-light'}
 	"

src/routes/+layout.svelte

@@ -128,7 +128,7 @@
 	</defs>
 </svg>
 
-<div class="md:h-[96vh] pb-[8vh] lg:px-[4vw] 2xl:px-[8vw] lg:py-[5.5vh] overflow-x-hidden [scrollbar-gutter:stable]">
+<div class="md:h-[96vh] pb-[8vh] lg:px-[4vw] 2xl:px-[8vw] lg:pb-[5vh] lg:pt-[3.5vh] overflow-x-hidden [scrollbar-gutter:stable]">
 	<slot />
 </div>
 

src/routes/+page.svelte

@@ -62,7 +62,7 @@
 				</li>
 				<li>
 					gitlab:
-					<a href="https://gitlab.com/yusdacra">@yusdacra</a>
+					<a class="u-url" href="https://gitlab.com/yusdacra" rel="me">@yusdacra</a>
 				</li>
 				<li>
 					my gitea:
@@ -77,14 +77,14 @@
 				</li>
 				<li>
 					misskey.art:
-					<a href="https://misskey.art/@yusdacra">@yusdacra</a>
+					<a class="u-url" href="https://misskey.art/@yusdacra" rel="me">@yusdacra</a>
 				</li>
 			</ul>
 		</div>
 	</Window>
 </div>
 
-<div class="hidden motion-reduce:md:block absolute max-w-[40ch] bottom-[10vh] right-[8vw]">
+<div class="hidden motion-reduce:block absolute max-w-[40ch] bottom-0 right-0 md:bottom-[10vh] md:right-[8vw]">
 	<Window title=":(" iconUri="/icons/warning.png">
 		<div class="prose prose-ralsei leading-6">
 			<p>

src/styles/app.css

@@ -175,6 +175,24 @@
             background-position: 0px 0px;
         }
     }
+
+    @media (prefers-reduced-motion: no-preference) {
+        @keyframes bounce-reverse {
+            0%, 100% {
+                transform: none;
+                animation-timing-function: cubic-bezier(0,0,0.2,1);
+            }
+            50% {
+                transform: translateY(-25%);
+                animation-timing-function: cubic-bezier(0.8,0,1,1);
+            }
+        }
+    }
+    @media (prefers-reduced-motion: no-preference) {
+        .animate-bounce-reverse:hover {
+            animation: bounce-reverse 1s infinite;
+        }
+    }
 }
 
 a.app-selected-route {