sync
All checks were successful
Rebuild signaller for deprived.dev to rebuild site / Rebuild Signaller (push) Successful in 32s

This commit is contained in:
BOTAlex 2026-03-31 01:13:24 +02:00
parent c86b5524eb
commit 7ca7eb8bf4
7 changed files with 271 additions and 23 deletions

View file

@ -22,6 +22,14 @@
"open": "Bidrager ofte til open-source",
"pcb": "Har designet flere printed circuit boards (PCB'er)",
"kube": "Multi node HA kube cluster med venner"
},
"page2": {
"title": "Projektfremvisning",
"mini-projects": {
"title": "Værktøjserfaring",
"ask": "Spørg mig",
"linked": "Projekter med links"
}
}
}
}

View file

@ -21,6 +21,14 @@
"open": "Often contribute to Open-source",
"pcb": "I have designed multiple Printed Circuit Boards (PCBs)",
"kube": "Multi node HA Kubernetes cluster with my friends"
},
"page2": {
"title": "Project showcase",
"mini-projects": {
"title": "Tool experience",
"ask": "Ask me",
"linked": "Projects with link"
}
}
}
}

View file

@ -168,10 +168,8 @@
</div>
</div>
</div>
{#if debug}
<div class="hide-on-print py-4"><div>===== Next page =====</div></div>
<Page2 />
{/if}
</div>
</div>
</div>

View file

@ -23,7 +23,7 @@
<p style="font-size: 0.5rem;">AI and data</p>
</IconAndText2>
<IconAndText2 logo={$re?.education[1].imageId ?? ""}>
<b>{$re?.education[0].name ?? "High School 🤮"}</b><br />
<b>{$re?.education[1].name ?? "High School 🤮"}</b><br />
<p style="font-size: 0.5rem;">Computer science</p>
</IconAndText2>
<IconAndText2 logo={SasLogo}>

View file

@ -1,9 +1,9 @@
<script>
const cols = 10;
<script lang="ts">
const cols = 9;
const rows = 7;
// Geometry Constants
const width = 66; // px
const width = 73; // px
const height = width * 1.1547; // Perfect hexagonal ratio
const gap = 4; // Space between hexagons
@ -15,11 +15,29 @@
const hexPath =
"polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%)";
import { getSkills } from "@src/ts/misc/ZhenSkills";
import * as m from "$paraglide/messages";
const skills = getSkills();
function getIndex(r: int, c: int): int {
return Math.floor(r / 2) * (2 * cols + 1) + (r % 2) * (cols + 1) + c;
}
</script>
<div class="bg-[#eeeeee] flex flex-col h-full">
<div class=" px-8 py-4 text-slate-800 font-semibold text-2xl">
Experienced in
<div class="bg-[#eeeeee] text-[#121212] flex flex-col h-full">
<div class="flex justify-between items-center px-8 py-4">
<div class="font-semibold text-2xl">
{m["zhen.cv.page2.mini-projects.title"]()}
</div>
<div class="flex gap-4">
<div class="border-b-6 border-[#121212]/32">
{m["zhen.cv.page2.mini-projects.ask"]()}
</div>
<div class="border-b-6 border-[#7bd45d]">
{m["zhen.cv.page2.mini-projects.linked"]()}
</div>
</div>
</div>
<div class="overflow-show">
<div
@ -34,16 +52,48 @@
padding-left: {r % 2 !== 0 ? offset : 0}px;
"
>
{#each Array(cols + !(r % 2)) as _, c}
{#each Array(cols + (r % 2 == 0)) as _, c}
{@const x = getIndex(r, c)}
{#if x < skills.length}
<div class="hidden"></div>
<div
class="bg-slate-800 flex items-center justify-center shrink-0"
class=" {skills[x].link != undefined
? 'bg-[#7bd45d]'
: 'bg-[#121212]/32'} flex items-center justify-center shrink-0"
style="
width: {width}px;
height: {height}px;
clip-path: {hexPath};
margin-right: {gap}px;
"
></div>
>
{#if skills[x].link != undefined}
<a
href={skills[x].link}
class="bg-[#eeeeee] w-full grid items-center shrink-0"
style="
width: {width * 0.9}px;
height: {height * 0.9}px;
clip-path: {hexPath};
"
>
<img class="p-3.5" src={skills[x].image} alt="" />
</a>
{:else}
<div
class="bg-[#eeeeee] w-full grid items-center shrink-0"
style="
width: {width * 0.9}px;
height: {height * 0.9}px;
clip-path: {hexPath};
"
>
<img class="p-3.5" src={skills[x].image} alt="" />
</div>
{/if}
</div>
{/if}
{/each}
</div>
{/each}

View file

@ -1,15 +1,17 @@
<script>
const baseClass =
"h-56 w-full bg-slate-400 flex text-white font-bold text-2xl";
const titleClass = "px-4";
import * as m from "$paraglide/messages";
</script>
<div class="relative w-full flex justify-between">
<div class="col-l w-full relative h-full flex flex-col gap-2 p-8">
<div class="text-2xl p-4">Small projects showcase</div>
<div class="text-2xl p-4">{m["zhen.cv.page2.title"]()}</div>
<div class={baseClass}>
<div class="w-full flex flex-col pr-[7cm]">
<div class="w-full text-black bg-white">Kubernetes Cluster</div>
<div class="w-full text-[#121212] bg-[#f1f1f1] px-2">
Kubernetes Cluster
</div>
<div class="relative flex-1 w-full flex min-h-0">
<div class="w-full relative max-h-full flex flex-col">
<div class="w-full h-full flex flex-col">
@ -64,7 +66,7 @@
</div>
<div class={baseClass}>
<div class="w-full flex flex-col pr-[9cm]">
<div class="w-full text-slate-900 bg-white">PCB Design</div>
<div class="w-full text-[#121212] bg-[#f1f1f1] px-2">PCB Design</div>
<div class="relative flex-1 w-full flex min-h-0">
<div
class="w-full relative h-full flex flex-col justify-evenly pr-[45%]"
@ -102,7 +104,7 @@
<div class="text-2xl p-4"><br /></div>
<div class="{baseClass} ">
<div class="w-full flex flex-col pl-[9.5cm]">
<div class="w-full text-slate-900 bg-white text-end">Frontend</div>
<div class="w-full text-[#121212] bg-[#f1f1f1] text-end">Frontend</div>
<img
class="w-full h-full object-cover object-top-left"
src="https://deprived.dev/assets/website/zhen/cv/cv-inception.png"
@ -112,7 +114,7 @@
</div>
<div class="{baseClass} ">
<div class="w-full flex flex-col pl-[7.5cm]">
<div class="w-full text-slate-900 bg-white text-end">Embedded</div>
<div class="w-full text-[#121212] bg-[#f1f1f1] text-end">Embedded</div>
<div class="relative flex-1 w-full flex min-h-0">
<div class="w-full relative h-full flex flex-col">
<img

182
src/ts/misc/ZhenSkills.ts Normal file
View file

@ -0,0 +1,182 @@
export class Skill {
image: string | undefined;
alt: string | undefined;
link: string | undefined;
public constructor(
alt: string,
image: string,
link: string | undefined = undefined,
) {
this.image = "https://deprived.dev/assets/website/icons/" + image;
this.alt = alt;
this.link = link;
}
}
export function getSkills(): Skill[] {
let arr = []; // ineffecient implimentation, but who cares lol
arr.push(new Skill("C", "c.svg", "https://github.com/MagicBOTAlex/ZSwitch"));
arr.push(
new Skill("C++", "cpp.svg", "https://github.com/MagicBOTAlex/DesktopPlus"),
);
arr.push(new Skill("C#", "csharp.svg"));
arr.push(
new Skill(
"Python",
"python.svg",
"https://github.com/MagicBOTAlex/MLEyeTrack",
),
);
arr.push(new Skill("Espressif", "espressif.svg"));
arr.push(
new Skill("ETVR", "etvr.png", "https://github.com/MagicBOTAlex/MLEyeTrack"),
);
// Embedded
arr.push(
new Skill(
"Arduino",
"arduino.svg",
"https://github.com/MagicBOTAlex/ZSwitch",
),
);
// frontend
arr.push(new Skill("Svelte", "svelte.svg", "https://deprived.dev/"));
arr.push(new Skill("Tailwind", "tailwind.svg", "https://deprived.dev/"));
arr.push(
new Skill(
"JavaScript",
"javascript.svg",
"https://github.com/MagicBOTAlex/MomHelper",
),
);
arr.push(new Skill("TypeScript", "typescript.svg", "https://deprived.dev/"));
arr.push(
new Skill("Tauri", "tauri.svg", "https://github.com/MagicBOTAlex/ComboFT"),
);
arr.push(new Skill("CSS", "css.svg", "https://deprived.dev/"));
arr.push(new Skill("DaisyUI", "daisyui.svg", "https://deprived.dev/"));
arr.push(new Skill("Cloudflare", "cloudflare.svg", "https://deprived.dev/"));
// homelab
arr.push(new Skill("Home Assistant", "homeassistant.svg"));
arr.push(new Skill("ESPHome", "esphome.svg"));
arr.push(new Skill("WireGuard", "wireguard.svg"));
arr.push(
new Skill(
"Docker",
"docker.svg",
"https://github.com/MagicBOTAlex/DockeredMLEyeTrack",
),
);
arr.push(new Skill("Argo", "argo.svg"));
arr.push(new Skill("Kubernetes", "kubernetes.svg"));
arr.push(
new Skill(
"Linux",
"linux.svg",
"https://github.com/MagicBOTAlex/nixos-server",
),
);
arr.push(
new Skill(
"NixOS",
"nixos.svg",
"https://github.com/MagicBOTAlex/nixos-server",
),
);
arr.push(new Skill("Debian", "debian.svg"));
arr.push(new Skill("Ubuntu", "ubuntu.svg"));
arr.push(
new Skill(
"Neovim",
"neovim.svg",
"https://github.com/MagicBOTAlex/NVimConfigs",
),
);
arr.push(new Skill("nRF", "nrf.svg"));
arr.push(new Skill("OpenCV", "opencv.svg"));
arr.push(new Skill("OpenPnP", "openpnp.svg"));
arr.push(
new Skill(
"PlatformIO",
"platformio.svg",
"https://github.com/MagicBOTAlex/ZSwitch",
),
);
arr.push(new Skill("PocketBase", "pocketbase.svg"));
arr.push(
new Skill(
"QEMU",
"qemu.svg",
"https://github.com/MagicBOTAlex/nixos-server/tree/master/vms/kube-daddy",
),
);
arr.push(new Skill("Raspberry Pi", "raspberrypi.svg"));
arr.push(new Skill("Rust", "rust.svg"));
arr.push(new Skill("Sass", "sass.svg"));
arr.push(new Skill("Shopify", "shopify.svg"));
// VR
arr.push(new Skill("SlimeVR", "slimevr.svg"));
arr.push(
new Skill(
"SteamVR",
"steamvr.webp",
"https://github.com/elvissteinjr/DesktopPlus",
),
);
arr.push(
new Skill(
"Babble",
"babble.svg",
"https://github.com/Project-Babble/Baballonia/pull/215",
),
);
// AI
arr.push(new Skill("Jupyter", "jupiter.svg"));
arr.push(new Skill("PyTorch", "pytorch.svg"));
arr.push(new Skill("Keras", "keras.svg"));
arr.push(new Skill("TensorFlow", "tensorflow.svg"));
// Game dev
arr.push(new Skill("Unity", "unity.svg"));
arr.push(new Skill("Blender", "blender.svg"));
arr.push(
new Skill(
"CADSketcher",
"CADSketcher.png",
"https://github.com/hlorus/CAD_Sketcher/pull/481",
),
);
arr.push(new Skill("FreeCAD", "freecad.svg"));
arr.push(
new Skill(
"Fusion360",
"fusion360.svg",
"https://github.com/MagicBOTAlex/ZSwitch",
),
);
// Misc
arr.push(
new Skill(
"MudBlazor",
"mudblazor.svg",
"https://github.com/MudBlazor/MudBlazor/pull/7327",
),
);
arr.push(new Skill("Ollama", "ollama.svg"));
arr.push(new Skill("Gitea", "gitea.svg"));
// arr.push(new Skill("Astro", "astro.png"));
arr.push(new Skill("KiCad", "kicad.svg"));
// arr.push(new Skill("Lua", "lua.svg"));
return arr;
}