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

@ -168,10 +168,8 @@
</div>
</div>
</div>
{#if debug}
<div class="hide-on-print py-4"><div>===== Next page =====</div></div>
<Page2 />
{/if}
<div class="hide-on-print py-4"><div>===== Next page =====</div></div>
<Page2 />
</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,13 +15,31 @@
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 class="overflow-show">
<div
class="relative"
style="padding-left: 13.5px; width: {cols * horizontalSpacing + offset}px"
@ -34,16 +52,48 @@
padding-left: {r % 2 !== 0 ? offset : 0}px;
"
>
{#each Array(cols + !(r % 2)) as _, c}
<div
class="bg-slate-800 flex items-center justify-center shrink-0"
style="
{#each Array(cols + (r % 2 == 0)) as _, c}
{@const x = getIndex(r, c)}
{#if x < skills.length}
<div class="hidden"></div>
<div
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