diff options
| author | Kyren223 <Kyren223@proton.me> | 2024-11-12 22:33:11 +0200 |
|---|---|---|
| committer | Kyren223 <Kyren223@proton.me> | 2024-11-12 22:33:11 +0200 |
| commit | 6d3da9537200e4029d3c9e1b6140f601642f26da (patch) | |
| tree | 4454964a5910cacf6bef160ec7d679b6aa08eaa2 /src/pages/index.astro | |
| parent | 506d97a7d16fa186beee3eda314492d9297e90c5 (diff) | |
Backup
Diffstat (limited to 'src/pages/index.astro')
| -rw-r--r-- | src/pages/index.astro | 165 |
1 files changed, 80 insertions, 85 deletions
diff --git a/src/pages/index.astro b/src/pages/index.astro index 2a47693..d6cff92 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -1,8 +1,7 @@ --- -import Layout from "../layouts/Layout.astro"; +import Terminal from "../layouts/Layout.astro"; import TerminalBorder from "../components/TerminalBorder.astro"; import Link from "../components/Link.astro"; -import Nav from "../components/Nav.astro"; const sshKey = `ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIAsrdN6e4XbkJfV/FbH3GY8ujWgxSCSbYiwzQ4rKyren`; const fingerprint = ` @@ -26,97 +25,93 @@ And when I am not coding I am most likely playing video games, watching Anime or solving Rubik's cubes fast.`.trimStart(); --- -<Layout title="/home/kyren/"> - <main> - <Nav path="" /> - <div id="content"> - <div id="left" class="column"> - <TerminalBorder header="Profile"> - <div class="flex items-center space-x-3"> - <img - src="logo.svg" - alt="picture" - class="h-[100%] object-cover" - /> - <pre - id="sshKeyCopy" - class="text-[75%] flex-1">{fingerprint}</pre> - </div> - </TerminalBorder> - <TerminalBorder header="Name"> - <span>Kyren</span> - </TerminalBorder> - <TerminalBorder header="Email"> - <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 - id="sshKey" - class="hover:text-[var(--alt)] cursor-pointer truncate flex-1" - >{sshKey}</span - > - <button - id="sshKeyCopy" - class="flex items-center justify-center ml-auto hover:text-[var(--alt)]" - > - <svg - width="100%" - height="100%" - viewBox="0 -3 24 24" - xmlns="http://www.w3.org/2000/svg" - fill="none" - > - <path - fill="currentColor" - fill-rule="evenodd" - d="M4 2a2 2 0 00-2 2v9a2 2 0 002 2h2v2a2 2 0 002 2h9a2 2 0 002-2V8a2 2 0 00-2-2h-2V4a2 2 0 00-2-2H4zm9 4V4H4v9h2V8a2 2 0 012-2h5zM8 8h9v9H8V8z" - ></path> - </svg> - </button> - </div> - </TerminalBorder> +<Terminal dir=""> + <div id="content"> + <div id="left" class="column"> + <TerminalBorder header="Profile"> + <div class="flex items-center space-x-3"> + <img + src="logo.svg" + alt="picture" + class="h-[100%] object-cover" + /> + <pre + id="sshKeyCopy" + class="text-[75%] flex-1">{fingerprint}</pre> </div> - </div> - <div id="right" class="column"> - <TerminalBorder header="Status"> - <p> - Working on - <Link href="https://github.com/KapiMC/Kapi">Kapi </Link> - | Learning Web Development | Available for hire - </p> - </TerminalBorder> - <TerminalBorder header="About Me" margin="20px 0"> - <p>{aboutMe}</p> - </TerminalBorder> - <TerminalBorder header="Links"> - <p> - <Link href="https://github.com/Kyren223" - >github.com/Kyren223</Link + </TerminalBorder> + <TerminalBorder header="Name"> + <span>Kyren</span> + </TerminalBorder> + <TerminalBorder header="Email"> + <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 + id="sshKey" + class="hover:text-[var(--alt)] cursor-pointer truncate flex-1" + >{sshKey}</span > - <br /> - <Link - href="https://discord.com/users/481884415090229258" - >discord.com/Kyren223</Link + <button + id="sshKeyCopy" + class="flex items-center justify-center ml-auto hover:text-[var(--alt)]" > - </p> + <svg + width="100%" + height="100%" + viewBox="0 -3 24 24" + xmlns="http://www.w3.org/2000/svg" + fill="none" + > + <path + fill="currentColor" + fill-rule="evenodd" + d="M4 2a2 2 0 00-2 2v9a2 2 0 002 2h2v2a2 2 0 002 2h9a2 2 0 002-2V8a2 2 0 00-2-2h-2V4a2 2 0 00-2-2H4zm9 4V4H4v9h2V8a2 2 0 012-2h5zM8 8h9v9H8V8z" + ></path> + </svg> + </button> + </div> </TerminalBorder> </div> </div> - </main> -</Layout> + <div id="right" class="column"> + <TerminalBorder header="Status"> + <p> + Working on + <Link href="https://github.com/KapiMC/Kapi">Kapi </Link> + | Learning Web Development | Available for hire + </p> + </TerminalBorder> + <TerminalBorder header="About Me" margin="20px 0"> + <p>{aboutMe}</p> + </TerminalBorder> + <TerminalBorder header="Links"> + <p> + <Link href="https://github.com/Kyren223" + >github.com/Kyren223</Link + > + <br /> + <Link href="https://discord.com/users/481884415090229258" + >discord.com/Kyren223</Link + > + </p> + </TerminalBorder> + </div> + </div> +</Terminal> <script> - const sshKey = document.getElementById("sshKey").innerHTML; + const sshKey = document.getElementById("sshKey")?.innerHTML; function copySshKeyToClipboard() { navigator.clipboard - .writeText(sshKey) + .writeText(sshKey ? sshKey : "") .then(() => { // TODO: show some feedback for copying }) @@ -127,10 +122,10 @@ watching Anime or solving Rubik's cubes fast.`.trimStart(); document .getElementById("sshKey") - .addEventListener("click", copySshKeyToClipboard); + ?.addEventListener("click", copySshKeyToClipboard); document .getElementById("sshKeyCopy") - .addEventListener("click", copySshKeyToClipboard); + ?.addEventListener("click", copySshKeyToClipboard); </script> <style> |
