summaryrefslogtreecommitdiff
path: root/src/pages/index.astro
diff options
context:
space:
mode:
Diffstat (limited to 'src/pages/index.astro')
-rw-r--r--src/pages/index.astro275
1 files changed, 0 insertions, 275 deletions
diff --git a/src/pages/index.astro b/src/pages/index.astro
deleted file mode 100644
index e286117..0000000
--- a/src/pages/index.astro
+++ /dev/null
@@ -1,275 +0,0 @@
----
-import { getCollection } from "astro:content";
-import Terminal from "@layouts/Terminal.astro";
-import TerminalBorder from "@components/TerminalBorder.astro";
-import Link from "@components/Link.astro";
-import BlogItem from "@components/BlogItem.astro";
-
-const latestBlog = (await getCollection("blogs")).reduce((latest, blog) => {
- const blogDate = new Date(blog.data.date);
- return blogDate > new Date(latest.data.date) ? blog : latest;
-});
-
-const sshKey = `ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIO7P9K9D5RkBk+JCRRS6AtHuTAc6cRpXfRfRMg/Kyren`;
-const fingerprint = `
-+--[ED25519 256]--+
-| +. .. +.B|
-| + o..o . BB|
-| ..o oo.o =+E|
-| ... oo. + o.|
-| . S . = |
-| . . + o |
-| o o o . |
-| oo .o+ + |
-| ++ooo+= |
-+----[SHA256]-----+`.trimStart();
-
-const aboutMe = `
-Hi! I'm Kyren, a software engineer and Game developer freelancer.
-I love working with low level languages and learning things deeply.
-I am also a terminal nerd and Linux enthusiast who uses NVIM btw.
-And when I am not coding I am most likely playing video games,
-watching Anime or solving Rubik's cubes fast.`.trimStart();
-
-const utcOffset = 3;
-
-const email = "contact at kyren.codes";
-
----
-
-<Terminal path="/home/kyren/">
- <!-- ================= -->
- <!-- ==== Desktop ==== -->
- <!-- ================= -->
- <div id="content" class="w-0 h-0 invisible sm:w-full sm:h-full sm:visible">
- <div class="w-[30%]">
- <TerminalBorder header="Profile">
- <div class="flex items-center space-x-[1.25vw] h-[9.5vw]">
- <img
- src="favicon.svg"
- alt="picture"
- class="h-[100%] object-cover"
- />
- <pre
- class="sshKeyCopy text-[60%] hover:text-[var(--secondary)]">{fingerprint}</pre>
- </div>
- </TerminalBorder>
- <TerminalBorder header="Email">
- <span id="email" class="flex-1">{email}</span>
- <button class="emailCopy hover:text-gray-700">
- <svg
- width="100%"
- height="100%"
- viewBox="0 0 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>
- </TerminalBorder>
- <TerminalBorder header="Git Repos (main)">
- <Link href="https://git.kyren.codes/Kyren223">
- git.kyren.codes/Kyren223
- </Link>
- </TerminalBorder>
- <TerminalBorder header="GitHub (secondary)">
- <Link href="https://github.com/Kyren223">
- github.com/Kyren223
- </Link>
- </TerminalBorder>
- <TerminalBorder header="Discord">
- <Link href="https://discord.com/users/481884415090229258">
- Kyren223
- </Link>
- </TerminalBorder>
- <!-- <TerminalBorder header="Timezone"> -->
- <!-- <div class="flex justify-between w-full"> -->
- <!-- <span class="text-left">UTC+{utcOffset}</span> -->
- <!-- <span id="time" class="text-right">Loading...</span> -->
- <!-- </div> -->
- <!-- </TerminalBorder> -->
- <div class="w-[334%]">
- <TerminalBorder header="SSH Key">
- <div class="sshKeyCopy w-[100%] flex items-center group">
- <span
- id="sshKey"
- class="hover:text-[var(--alt)] cursor-pointer truncate flex-1 group-hover:text-[var(--alt)]"
- >{sshKey}</span
- >
- <button class="group-hover:text-gray-700">
- <svg
- width="100%"
- height="100%"
- viewBox="0 0 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>
- <div class="w-[67%]">
- <TerminalBorder header="Status">
- <p class="text-[0.96vw]">
- Working on <Link href="https://git.kyren.codes/kyren223/Krypton"
- >Krypton
- </Link> | Learning Langdev & Compiler Design | Available for hire
- </p>
- </TerminalBorder>
- <TerminalBorder header="About Me" extra="my-[2.5vw]">
- <p>{aboutMe}</p>
- </TerminalBorder>
- <BlogItem
- header="Latest Blog Post"
- title={latestBlog.data.title}
- description={latestBlog.data.description ?? ""}
- date={latestBlog.data.date}
- href={"/blogs/" + latestBlog.slug}
- />
- </div>
- </div>
-
- <!-- ================ -->
- <!-- ==== Mobile ==== -->
- <!-- ================ -->
- <div
- class="w-full h-[80svh] visible sm:w-0 sm:h-0 sm:invisible overflow-y-auto overflow-x-hidden sm:overflow-visible"
- >
- <div class="mx-[1vw] mt-[1vw]">
- <TerminalBorder header="Status">
- <p>
- Working on <Link href="https://github.com/kyren223/eko"
- >EKO
- </Link> | Learning Langdev & Compiler Design | Available for hire
- </p>
- </TerminalBorder>
- <TerminalBorder header="About Me" extra="my-[5vw] sm:my-[2.5vw]">
- <p>{aboutMe}</p>
- </TerminalBorder>
- <BlogItem
- header="Latest Blog Post"
- title={latestBlog.data.title}
- description={latestBlog.data.description ?? ""}
- date={latestBlog.data.date}
- href={"/blogs/" + latestBlog.slug}
- />
- <div class="mt-[8vw]">
- <TerminalBorder header="Email">
- <span id="email" class="flex-1">{email}</span>
- <button class="emailCopy hover:text-gray-700">
- <svg
- class="ml-[-4vw]"
- 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>
- </TerminalBorder>
- </div>
- <TerminalBorder header="GitHub">
- <Link href="https://github.com/Kyren223">
- github.com/Kyren223
- </Link>
- </TerminalBorder>
- <TerminalBorder header="Discord">
- <Link href="https://discord.com/users/481884415090229258">
- Kyren223
- </Link>
- </TerminalBorder>
- <TerminalBorder header="Timezone">
- <div class="flex justify-between w-full">
- <span class="text-left">UTC+{utcOffset}</span>
- <span id="time" class="text-right">Loading...</span>
- </div>
- </TerminalBorder>
- <TerminalBorder header="SSH Key">
- <div class="sshKeyCopy w-[100%] flex items-center group">
- <span
- id="sshKey"
- class="hover:text-[var(--alt)] cursor-pointer truncate flex-1 group-hover:text-[var(--alt)]"
- >{sshKey}</span
- >
- </div>
- </TerminalBorder>
- </div>
- </div>
-</Terminal>
-
-<script define:vars={{ utcOffset }}>
- function copyToClipboard(text) {
- return function () {
- console.log("Clicked");
- navigator.clipboard
- .writeText(text)
- .then(() => {
- console.log("Copied");
- // TODO: show some feedback for copying
- })
- .catch((_err) => {
- console.log("Error copying!");
- // TODO: show same feedback but with err
- });
- };
- }
-
- const sshKey = document.getElementById("sshKey");
- document.querySelectorAll(".sshKeyCopy").forEach((elem) => {
- elem.addEventListener("click", copyToClipboard(sshKey.innerHTML));
- });
-
- const email = document.getElementById("email");
- document.querySelectorAll(".emailCopy").forEach((elem) => {
- elem.addEventListener("click", copyToClipboard(email.innerHTML));
- });
-
- const time = document.getElementById("time");
- setInterval(
- () => {
- const now = new Date();
- const myTime = new Date(now.getTime() + utcOffset * 3600 * 1000);
- const hours = String(myTime.getUTCHours()).padStart(2, "0");
- const minutes = String(myTime.getUTCMinutes()).padStart(2, "0");
- const formattedTime = `${hours}:${minutes}`;
- time.innerHTML = formattedTime;
- },
- 0,
- 60 * 1000,
- );
-</script>
-
-<style>
- #content {
- margin-top: 1.5vw;
- display: flex;
- justify-content: space-between;
- }
-
- button {
- background-color: var(--background);
- color: var(--text);
- border: 0;
- font-size: 1.25vw;
- cursor: pointer;
- width: 1.5vw;
- height: 1.5vw;
- padding: 0;
- line-height: 2.3vw;
- }
-</style>
generated by cgit v1.3.1 (git 2.54.0) at 2026-10-10 04:50:39 +0000