From ba1be9573ef20d6424ae987257a1c727c47d4b53 Mon Sep 17 00:00:00 2001
From: Kyren223 <contact@kyren.codes>
Date: Tue, 6 Oct 2026 20:46:31 +0300
Subject: Initial setup for website rewrite

---
 src/components/BlogItem.astro       |  40 -----------
 src/components/Head.astro           |  29 --------
 src/components/Link.astro           |  12 ----
 src/components/Markdown.astro       |  12 ----
 src/components/Nav.astro            |  47 -------------
 src/components/Project.astro        |  27 --------
 src/components/RadarChart.astro     | 132 ------------------------------------
 src/components/TerminalBorder.astro |  43 ------------
 8 files changed, 342 deletions(-)
 delete mode 100644 src/components/BlogItem.astro
 delete mode 100644 src/components/Head.astro
 delete mode 100644 src/components/Link.astro
 delete mode 100644 src/components/Markdown.astro
 delete mode 100644 src/components/Nav.astro
 delete mode 100644 src/components/Project.astro
 delete mode 100644 src/components/RadarChart.astro
 delete mode 100644 src/components/TerminalBorder.astro

(limited to 'src/components')

diff --git a/src/components/BlogItem.astro b/src/components/BlogItem.astro
deleted file mode 100644
index 8440d85..0000000
--- a/src/components/BlogItem.astro
+++ /dev/null
@@ -1,40 +0,0 @@
----
-import TerminalBorder from "@components/TerminalBorder.astro";
-
-function formatDate(date: Date) {
-    const day = date.getDate();
-    const month = date.toLocaleString("default", { month: "long" });
-    const year = date.getFullYear();
-    return `${month} ${day}, ${year}`;
-}
-
-interface Props {
-    title: string;
-    description: string;
-    date: Date;
-    href?: string;
-    header?: string;
-}
-
-const { title, description, date, href, header } = Astro.props;
----
-
-<TerminalBorder header={header} footer={formatDate(date)} extra="mr-[0.1vw] sm:mr-0 mb-[5vw] sm:mb-[2vw]">
-    <span class="cursor-pointer group block w-full">
-        {
-            href ? (
-                <a href={href} style="all: unset;">
-                    <h1 class="text-[130%] text-[var(--accent)] group-hover:underline">
-                        {title}
-                    </h1>
-                    <p class="text-[var(--secondary)]">{description}</p>
-                </a>
-            ) : (
-                <>
-                    <h1 class="text-[130%] text-[var(--accent)]">{title}</h1>
-                    <p class="text-[var(--secondary)]">{description}</p>
-                </>
-            )
-        }
-    </span>
-</TerminalBorder>
diff --git a/src/components/Head.astro b/src/components/Head.astro
deleted file mode 100644
index a1a6e35..0000000
--- a/src/components/Head.astro
+++ /dev/null
@@ -1,29 +0,0 @@
----
-interface Props {
-    title: string;
-    description: string;
-}
-
-const { title, description } = Astro.props;
----
-
-<head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="color-scheme" content="dark">
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-    <meta name="generator" content={Astro.generator} />
-    <meta name="robots" content="index, follow, noarchive">
-    <meta name="keywords" content="Kyren223, Kapi, Minecraft, Developer">
-    <meta name="author" content="Kyren223">
-    <meta name="description" content={description} />
-    <title>{title}</title>
-
-    <meta property="og:title" content={title} />
-    <meta property="og:description" content={description} />
-    <meta property="og:type" content="website" />
-    <meta property="og:url" content="https://kyren.codes/" />
-    <meta property="og:image" content="/image.png">
-    <meta property="og:image:alt" content="a cyan sphere with a dark background">
-    <meta property="og:site_name" content="Kyren's Website">
-</head>
diff --git a/src/components/Link.astro b/src/components/Link.astro
deleted file mode 100644
index e8396ec..0000000
--- a/src/components/Link.astro
+++ /dev/null
@@ -1,12 +0,0 @@
----
-interface Props {
-    href: string;
-    newTab?: boolean;
-}
-
-const { href, newTab = true } = Astro.props;
----
-
-<a href={href} {...newTab && { target: "_blank", rel: "noopener noreferrer" }}>
-    <slot />
-</a>
diff --git a/src/components/Markdown.astro b/src/components/Markdown.astro
deleted file mode 100644
index 104b57e..0000000
--- a/src/components/Markdown.astro
+++ /dev/null
@@ -1,12 +0,0 @@
----
-import "@styles/markdown/asides.css";
-import "@styles/markdown/markdown.css";
-import "@styles/markdown/props.css";
-import "@styles/markdown/reset.css";
-import "@styles/markdown/shiki.css";
-import "@styles/markdown/util.css";
----
-
-<div class="sl-markdown-content">
-    <slot />
-</div>
diff --git a/src/components/Nav.astro b/src/components/Nav.astro
deleted file mode 100644
index da08b32..0000000
--- a/src/components/Nav.astro
+++ /dev/null
@@ -1,47 +0,0 @@
----
-interface Props {
-    path: string;
-}
-
-const { path } = Astro.props;
-
-const directories = ["skills", "projects", "blogs"];
----
-
-<nav
-    class="grid sm:flex
-    justify-between
-    border-[0.25vh] sm:border-[0.125vw]
-    border-[var(--alt)]
-    border-solid
-    mb-[7vw] sm:mb-[1.5625vw]
-    p-[3vw] sm:p-[1vw]"
->
-    <span class="mr-[2.5vh] text-[5vw] sm:mr-[2.5vw] sm:text-[1.375vw]"
-        >{path}</span
-    >
-    <span
-        id="nav-links"
-        class="mb-0 mx-[0.2vw] text-[5vw]
-        mx-[0.2vw] sm:text-[1.375vw]"
-    >
-        <a href="/">home</a>
-        {
-            directories.map((dir) => (
-                <>
-                    <a href={`/${dir}`}>{dir}</a>
-                </>
-            ))
-        }
-        <a class="hidden sm:contents" href="/shell">shell</a>
-    </span>
-</nav>
-
-<style>
-    #nav-links a {
-        color: var(--primary);
-    }
-    #nav-links a:hover {
-        color: var(--accent);
-    }
-</style>
diff --git a/src/components/Project.astro b/src/components/Project.astro
deleted file mode 100644
index 0b15a68..0000000
--- a/src/components/Project.astro
+++ /dev/null
@@ -1,27 +0,0 @@
----
-import TerminalBorder from "@components/TerminalBorder.astro";
-import Link from "@components/Link.astro";
-
-interface Props {
-    title: string;
-    description: string;
-    href: string;
-    cd?: string;
-    dir?: string;
-}
-
-const { title, description, href, cd = title, dir = "cd ~/projects/" } = Astro.props;
----
-
-<div class="flex-column mt-[1vw] mx-[1vw] mb-[5vw] sm:m-0">
-    <TerminalBorder>
-        <span>
-            <h1 class="inline-block text-[130%] text-[var(--accent)]">{title}</h1>
-            <p class="inline-block text-[var(--secondary)]">{description}</p>
-            <span class="block my-[3vw] sm:my-[0.625vw]"><slot /></span>
-        </span>
-    </TerminalBorder>
-    <TerminalBorder header="Shell">
-        <Link href={href}>{dir}{cd}</Link>
-    </TerminalBorder>
-</div>
diff --git a/src/components/RadarChart.astro b/src/components/RadarChart.astro
deleted file mode 100644
index 0a3d434..0000000
--- a/src/components/RadarChart.astro
+++ /dev/null
@@ -1,132 +0,0 @@
----
-import "@styles/terminal.css"
-
-interface Entry {
-    name: string;
-    weight: number;
-}
-
-interface Props {
-    max: number
-    data: Entry[];
-}
-
-const { max, data } = Astro.props
-
-const chartPadding = 100;
-const chartSize = 400;
-const chartCenter = chartSize / 2;
-
-const chartData = data ;// .sort((a, b) => b.weight - a.weight).slice(0, data.length);
-const pointPadding = 0;
-const rings = [...Array(6).keys()];
-
-const getX = (angle: number, value: number) =>
-    Math.cos(angle - Math.PI / 2) * value;
-const getY = (angle: number, value: number) =>
-    Math.sin(angle - Math.PI / 2) * value;
-
-const axes = chartData.map((_, index) => {
-    const angle = (Math.PI * 2 * index) / chartData.length;
-    const x = getX(angle, chartSize / 2);
-    const y = getY(angle, chartSize / 2);
-    const points = [
-        [0, 0],
-        [x, y],
-    ]
-        .map((point) => point[0] + "," + point[1])
-        .join(" ");
-    return {
-        points: points,
-    };
-});
-
-const properties = chartData.map((item, index) => {
-    const { name, weight: total } = item;
-    const clamp = Number(total / (max + pointPadding));
-    const angle = (Math.PI * 2 * index) / chartData.length;
-    const x = getX(angle, (clamp * chartSize) / 2);
-    const y = getY(angle, (clamp * chartSize) / 2);
-    return { name: name, total: total, x: x, y: y };
-});
-
-const shape =
-    properties.reduce((items, item, index) => {
-        const { x, y } = item;
-        const string = `${index === 0 ? "M" : "L"}${x},${y}`;
-        return items + string;
-    }, "") + "z";
-
-const strokeColor = "stroke-[var(--alt)]";
-const shapeClass = "stroke-[var(--primary)] fill-[#7ed4fb]/50";
-
----
-    <div class="w-full grid md:grid-cols-1 items-center gap-16 p-0">
-        <svg
-            xmlns="http://www.w3.org/2000/svg"
-            viewBox={`-${chartPadding / 2} -${chartPadding / 2} ${chartSize + chartPadding} ${chartSize + chartPadding}`}
-            role="presentation"
-        >
-            <g transform={`translate(${chartCenter},${chartCenter})`}>
-                {
-                    rings.map((_, index) => {
-                        return (
-                            <circle
-                                cx={0}
-                                cy={0}
-                                r={
-                                    ((index / rings.length) * chartSize) /
-                                    Number((Math.PI / 2 + 0.1).toFixed(2))
-                                }
-                                class={strokeColor}
-                                fill="none"
-                                stroke-width={1}
-                            />
-                        );
-                    })
-                }
-                {
-                    axes.map((axis) => {
-                        const { points } = axis;
-                        return (
-                            <polyline
-                                points={points}
-                                class={strokeColor}
-                                fill="none"
-                                stroke-width={1}
-                            />
-                        );
-                    })
-                }
-                <path d={shape} class=`${shapeClass}` stroke-width={1.5}></path>
-                {
-                    properties.map((property, index) => {
-                        const length = 1.1;
-                        const angle = (Math.PI * 2) * index / chartData.length;
-                        const maxX = getX(angle, (length * chartSize) / 2);
-                        const maxY = getY(angle, (length * chartSize) / 2);
-                        let textAngle = (angle * (180 / Math.PI))
-                        if (90 < textAngle && textAngle < 270) {
-                            textAngle += 180
-                        }
-                        return (
-                            <g transform={`translate(${maxX},${maxY})`}>
-                                <text
-                                    x={0}
-                                    y={0}
-                                    fill="var(--secondary)"
-                                    font-size="2rem"
-                                    font-weight="bold"
-                                    text-anchor="middle"
-                                    transform=`rotate(${textAngle})`
-                                    dominant-baseline="middle"
-                                >
-                                    {property.name}
-                                </text>
-                            </g>
-                        );
-                    })
-                }
-            </g>
-        </svg>
-    </div>
diff --git a/src/components/TerminalBorder.astro b/src/components/TerminalBorder.astro
deleted file mode 100644
index 4e8bfb3..0000000
--- a/src/components/TerminalBorder.astro
+++ /dev/null
@@ -1,43 +0,0 @@
----
-interface Props {
-    header?: string;
-    footer?: string;
-    extra?: string;
-}
-
-const { header = "", footer = "", extra = "m-[-0.1vw]" } = Astro.props;
----
-
-<div
-    class=`section
-    p-[0.8em] pt-[1.0625em] border-[0.1vw] text-[3.5vw]
-    sm:p-[1vw] sm:pt-[1.0625vw] sm:border-[0.1vw] sm:text-[100%]
-    ${extra}`
->
-    <span
-        class="tag px-[0.5em] text-[2.5vw] left-[0.5em] top-[-0.7em]
-        sm:px-[0.625vw] sm:text-[1vw] sm:left-[0.625vw] sm:top-[-0.75vw]"
-        >{header}</span
-    >
-    <span
-        class="tag px-[0.5em] text-[2.5vw] left-[0.5em] bottom-[-0.7em]
-        sm:px-[0.625vw] sm:text-[1vw] sm:left-[0.625vw] sm:bottom-[-0.75vw]"
-        >{footer}</span
-    >
-    <slot />
-</div>
-
-<style>
-    .section {
-        position: relative;
-        display: flex;
-        border-style: solid;
-        border-color: var(--alt);
-    }
-
-    .tag {
-        position: absolute;
-        background-color: var(--background);
-        color: var(--alt);
-    }
-</style>
-- 
cgit v1.3.1