Backup

1 files changed, 15 insertions, 21 deletions

diff --git a/src/pages/index.astro b/src/pages/index.astro
index d6cff92..243838f 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,9 +1,9 @@
 ---
-import Terminal from "../layouts/Layout.astro";
+import Terminal from "../layouts/Terminal.astro";
 import TerminalBorder from "../components/TerminalBorder.astro";
 import Link from "../components/Link.astro";
 
-const sshKey = `ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIAsrdN6e4XbkJfV/FbH3GY8ujWgxSCSbYiwzQ4rKyren`;
+const sshKey = `ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIO7P9K9D5RkBk+JCRRS6AtHuTAc6cRpXfRfRMg/Kyren`;
 const fingerprint = `
 +--[ED25519 256]--+
 |+o.+oE*B%* o     |
@@ -25,7 +25,7 @@ And when I am not coding I am most likely playing video games,
 watching Anime or solving Rubik's cubes fast.`.trimStart();
 ---
 
-<Terminal dir="">
+<Terminal path="">
     <div id="content">
         <div id="left" class="column">
             <TerminalBorder header="Profile">
@@ -36,8 +36,7 @@ watching Anime or solving Rubik's cubes fast.`.trimStart();
                         class="h-[100%] object-cover"
                     />
                     <pre
-                        id="sshKeyCopy"
-                        class="text-[75%] flex-1">{fingerprint}</pre>
+                        class="copySshKey text-[75%] flex-1 hover:text-[var(--secondary)]">{fingerprint}</pre>
                 </div>
             </TerminalBorder>
             <TerminalBorder header="Name">
@@ -47,26 +46,22 @@ watching Anime or solving Rubik's cubes fast.`.trimStart();
                 <span>Kyren223@proton.me</span>
             </TerminalBorder>
             <TerminalBorder header="Timezone">
-                <span>UTC+2</span>
-            </TerminalBorder>
-            <div class="w-[334%]">
-                <TerminalBorder header="SSH Key">
-                    <div
-                        class="w-[100%] flex items-center space-x-2 hover:text-[var(--alt)]"
-                    >
+                <span>UTC+2</span> </TerminalBorder> <div class="w-[334%]"> <TerminalBorder header="SSH Key">
+                    <div class="w-[100%] flex items-center space-x-2 group">
                         <span
                             id="sshKey"
-                            class="hover:text-[var(--alt)] cursor-pointer truncate flex-1"
+                            class="hover:text-[var(--alt)] cursor-pointer truncate flex-1 group-hover:text-[var(--alt)]"
                             >{sshKey}</span
                         >
                         <button
                             id="sshKeyCopy"
-                            class="flex items-center justify-center ml-auto hover:text-[var(--alt)]"
+                            type="button"
+                            class="group-hover:text-[var(--alt)]"
                         >
                             <svg
                                 width="100%"
                                 height="100%"
-                                viewBox="0 -3 24 24"
+                                viewBox="0 0 24 24"
                                 xmlns="http://www.w3.org/2000/svg"
                                 fill="none"
                             >
@@ -113,19 +108,18 @@ watching Anime or solving Rubik's cubes fast.`.trimStart();
         navigator.clipboard
             .writeText(sshKey ? sshKey : "")
             .then(() => {
+                console.log("Clicked");
                 // TODO: show some feedback for copying
             })
             .catch((_err) => {
+                console.log("Error copying!");
                 // TODO: show same feedback but with err
             });
     }
 
-    document
-        .getElementById("sshKey")
-        ?.addEventListener("click", copySshKeyToClipboard);
-    document
-        .getElementById("sshKeyCopy")
-        ?.addEventListener("click", copySshKeyToClipboard);
+    document.querySelectorAll("copySshKey").forEach((elem) => {
+        elem.addEventListener("click", copySshKeyToClipboard);
+    });
 </script>
 
 <style>