Made skills chart yay

2 files changed, 26 insertions, 3 deletions

diff --git a/src/pages/blogs/[...slug].astro b/src/pages/blogs/[...slug].astro
index 3e42575..37e6f53 100644
--- a/src/pages/blogs/[...slug].astro
+++ b/src/pages/blogs/[...slug].astro
@@ -1,6 +1,5 @@
 ---
 import Blog from "../../layouts/Blog.astro";
-import RadarChart from "../../components/RadarChart.astro"
 import { getCollection } from "astro:content";
 
 export async function getStaticPaths() {
@@ -16,7 +15,5 @@ const { Content } = await entry.render();
 ---
 
 <Blog title=`/home/kyren/blogs/${entry.slug}`>
-    <h1>Test</h1>
-    <RadarChart></RadarChart>
     <Content />
 </Blog>
diff --git a/src/pages/skills.astro b/src/pages/skills.astro
index 550ac1d..a555f5c 100644
--- a/src/pages/skills.astro
+++ b/src/pages/skills.astro
@@ -1,6 +1,32 @@
 ---
 import Terminal from "../layouts/Terminal.astro";
+import RadarChart from "../components/RadarChart.astro";
+
+const data1 = [
+    { name: "Backend", weight: 40 },
+    { name: "Gamedev", weight: 70 },
+    { name: "Frontend", weight: 5 },
+    { name: "Low-Level", weight: 63 },
+    { name: "Tooling", weight: 100 },
+];
+
+const data = [
+    { name: "Gamedev", weight: 70 },
+    { name: "Backend", weight: 40 },
+    { name: "Low-Level", weight: 63 },
+    { name: "Tooling", weight: 100 },
+    { name: "Frontend", weight: 15 },
+];
+
+
+const max = data.reduce(
+    (max, current) => (current.weight > max ? current.weight : max),
+    0,
+);
 ---
 
 <Terminal path="skills">
+    <div class="w-[40%]">
+        <RadarChart max={100} data={data} />
+    </div>
 </Terminal>