Footer tweak

src/app.tsx

@@ -186,9 +186,11 @@ export function App() {
         ref={(tag) => (tag ? tag.spellcheck = false : null)}
       />
       <SymbolBurst />
-      <p>
+      <div class="footer">
-        Click to edit · <a href="https://www.teepublic.com/t-shirt/1810231-ive-gay">Shirt</a> · <a href="https://diverse.direct/c-h-s/chsep-0003/">E.P.</a> · <a href="https://meow.garden/">Made by Ash</a>
+        <p>
-      </p>
+          Click &amp; type to edit · <a href="https://www.teepublic.com/t-shirt/1810231-ive-gay">Shirt by puddi</a> · <a href="http://c-h-s.me/chsep-0003/">E.P. by C.H.S</a> · <a href="https://meow.garden/">Website by Ash</a>
+        </p>
+      </div>
     </div>
   )
 }

src/index.css

@@ -65,15 +65,6 @@
   --ig-color-20: #e94661;
 }
 
-a {
-  text-decoration: none;
-  color: var(--ig-color-3);
-}
-
-a:hover {
-  color: var(--ig-color-4);
-}
-
 body,
 #app {
   margin: 0;
@@ -109,14 +100,6 @@ textarea {
   background-color: transparent;
 }
 
-p {
-  position: absolute;
-  bottom: 2em;
-  width: 100%;
-  text-align: center;
-  z-index: 10;
-}
-
 textarea:focus {
   outline: 4px dashed var(--ig-color-4);
 }
@@ -173,4 +156,20 @@ textarea:focus {
   100% {
     transform: rotate(0deg);
   }
+}
+
+.footer {
+  position: absolute;
+  bottom: 2em;
+  width: 100%;
+  text-align: center;
+  z-index: 10;
+}
+
+a {
+  color: inherit;
+}
+
+a:hover {
+  color: var(--ig-color-3);
 }