From ba1be9573ef20d6424ae987257a1c727c47d4b53 Mon Sep 17 00:00:00 2001 From: Kyren223 Date: Tue, 6 Oct 2026 20:46:31 +0300 Subject: Initial setup for website rewrite --- old_stuff/src/components/BlogItem.astro | 40 ++++++++ old_stuff/src/components/Head.astro | 29 ++++++ old_stuff/src/components/Link.astro | 12 +++ old_stuff/src/components/Markdown.astro | 12 +++ old_stuff/src/components/Nav.astro | 47 +++++++++ old_stuff/src/components/Project.astro | 27 ++++++ old_stuff/src/components/RadarChart.astro | 132 ++++++++++++++++++++++++++ old_stuff/src/components/TerminalBorder.astro | 43 +++++++++ 8 files changed, 342 insertions(+) create mode 100644 old_stuff/src/components/BlogItem.astro create mode 100644 old_stuff/src/components/Head.astro create mode 100644 old_stuff/src/components/Link.astro create mode 100644 old_stuff/src/components/Markdown.astro create mode 100644 old_stuff/src/components/Nav.astro create mode 100644 old_stuff/src/components/Project.astro create mode 100644 old_stuff/src/components/RadarChart.astro create mode 100644 old_stuff/src/components/TerminalBorder.astro (limited to 'old_stuff/src/components') diff --git a/old_stuff/src/components/BlogItem.astro b/old_stuff/src/components/BlogItem.astro new file mode 100644 index 0000000..8440d85 --- /dev/null +++ b/old_stuff/src/components/BlogItem.astro @@ -0,0 +1,40 @@ +--- +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; +--- + + + + { + href ? ( + +

+ {title} +

+

{description}

+ + ) : ( + <> +

{title}

+

{description}

+ + ) + } + + diff --git a/old_stuff/src/components/Head.astro b/old_stuff/src/components/Head.astro new file mode 100644 index 0000000..a1a6e35 --- /dev/null +++ b/old_stuff/src/components/Head.astro @@ -0,0 +1,29 @@ +--- +interface Props { + title: string; + description: string; +} + +const { title, description } = Astro.props; +--- + + + + + + + + + + + + {title} + + + + + + + + + diff --git a/old_stuff/src/components/Link.astro b/old_stuff/src/components/Link.astro new file mode 100644 index 0000000..e8396ec --- /dev/null +++ b/old_stuff/src/components/Link.astro @@ -0,0 +1,12 @@ +--- +interface Props { + href: string; + newTab?: boolean; +} + +const { href, newTab = true } = Astro.props; +--- + + + + diff --git a/old_stuff/src/components/Markdown.astro b/old_stuff/src/components/Markdown.astro new file mode 100644 index 0000000..104b57e --- /dev/null +++ b/old_stuff/src/components/Markdown.astro @@ -0,0 +1,12 @@ +--- +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"; +--- + +
+ +
diff --git a/old_stuff/src/components/Nav.astro b/old_stuff/src/components/Nav.astro new file mode 100644 index 0000000..da08b32 --- /dev/null +++ b/old_stuff/src/components/Nav.astro @@ -0,0 +1,47 @@ +--- +interface Props { + path: string; +} + +const { path } = Astro.props; + +const directories = ["skills", "projects", "blogs"]; +--- + + + + diff --git a/old_stuff/src/components/Project.astro b/old_stuff/src/components/Project.astro new file mode 100644 index 0000000..0b15a68 --- /dev/null +++ b/old_stuff/src/components/Project.astro @@ -0,0 +1,27 @@ +--- +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; +--- + +
+ + +

{title}

+

{description}

+ + + + + {dir}{cd} + +
diff --git a/old_stuff/src/components/RadarChart.astro b/old_stuff/src/components/RadarChart.astro new file mode 100644 index 0000000..0a3d434 --- /dev/null +++ b/old_stuff/src/components/RadarChart.astro @@ -0,0 +1,132 @@ +--- +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"; + +--- +
+ + + { + rings.map((_, index) => { + return ( + + ); + }) + } + { + axes.map((axis) => { + const { points } = axis; + return ( + + ); + }) + } + + { + 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 ( + + + {property.name} + + + ); + }) + } + + +
diff --git a/old_stuff/src/components/TerminalBorder.astro b/old_stuff/src/components/TerminalBorder.astro new file mode 100644 index 0000000..4e8bfb3 --- /dev/null +++ b/old_stuff/src/components/TerminalBorder.astro @@ -0,0 +1,43 @@ +--- +interface Props { + header?: string; + footer?: string; + extra?: string; +} + +const { header = "", footer = "", extra = "m-[-0.1vw]" } = Astro.props; +--- + +
+ {header} + {footer} + +
+ + -- cgit v1.3.1