From dae2b68a6d95a5be51b1a8577dea98b792e1c5e4 Mon Sep 17 00:00:00 2001
From: Sebin Nyshkim <rawr@sebin-nyshkim.net>
Date: Mon, 7 Jul 2025 16:40:10 +0200
Subject: [PATCH] refactor: :recycle: make job component independent, move page
 content out of data files

By making the job component independent it allows content to live in content page files instead of data files
---
 src/components/{timeline.webc => job.webc} | 26 +++++++--------
 src/viktor/career.md                       | 25 ++++++++++++--
 src/viktor/viktor.11tydata.json            | 39 +---------------------
 3 files changed, 35 insertions(+), 55 deletions(-)
 rename src/components/{timeline.webc => job.webc} (79%)

diff --git a/src/components/timeline.webc b/src/components/job.webc
similarity index 79%
rename from src/components/timeline.webc
rename to src/components/job.webc
index 9f00e04..0bbeebc 100644
--- a/src/components/timeline.webc
+++ b/src/components/job.webc
@@ -1,19 +1,17 @@
-<ul webc:root="override">
-  <li class="job" webc:for="job of jobs">
-    <div class="icon"><icon :@icon="job.icon"></icon></div>
-    <p class="title" @text="job.title"></p>
-    <p class="text" @text="job.desc"></p>
-  </li>
-</ul>
+<section webc:root="override">
+  <div class="icon"><icon :@icon="icon"></icon></div>
+  <p class="title" @text="title"></p>
+  <p class="text"><slot></slot></p>
+</section>
 
-<style webc:scoped="timeline">
+<style webc:scoped="job">
   :host {
     --timeline-circle-size: 3rem;
     --timeline-circle-background: var(--clr-box-background);
     --timeline-stroke-color: var(--clr-timeline-stroke);
     --timeline-stroke-thickness: calc(var(--timeline-circle-size) / 16);
 
-    margin-block: 1em;
+    margin: 0;
     padding: 0;
 
     @media (min-width: 32em) {
@@ -21,7 +19,7 @@
     }
   }
 
-  :host .job {
+  :host {
     display: grid;
     grid-template-areas:
       'icon title'
@@ -29,7 +27,7 @@
     column-gap: 1em;
   }
 
-  :host .job::before {
+  :host::before {
     content: '';
 
     grid-row: icon / line;
@@ -42,18 +40,18 @@
     background-color: var(--timeline-stroke-color);
   }
 
-  :host .job:first-child::before {
+  :host:first-of-type::before {
     align-self: end;
     height: calc(100% - var(--timeline-circle-size));
   }
 
-  :host .job:last-child::before {
+  :host:last-of-type::before {
     grid-row: icon;
     align-self: start;
     height: 50%;
   }
 
-  :host .job > .icon {
+  :host > .icon {
     grid-area: icon;
     align-self: center;
 
diff --git a/src/viktor/career.md b/src/viktor/career.md
index 9a977b5..c4c1df2 100644
--- a/src/viktor/career.md
+++ b/src/viktor/career.md
@@ -4,7 +4,26 @@ eleventyNavigation:
   order: 3
 ---
 
-Viktor's had many different jobs in the past, some of which where very formative, other's just
-paid the bills.
+Viktor has taken on a variety of jobs in his life. He's not particularly picky about the type of work, but he's anything but a 9to5 paper pusher. He vastly prefers manual labor that keeps his hands busy. Some of his past jobs have been more formative than others, allowing him to develop skills that have served him well even outside of work. Others were more focused solely on simply putting food on the table.
 
-<timeline :@jobs="jobs"></timeline>
+<job @title="Bartender" @icon="fa6-solid:whiskey-glass">
+  Viktor's professional career began as a bartender at a pub in his hometown. There he often doubled as a bouncer when a few guests got too drunk and started making a fuss. A defining moment of that job was when someone climbed over the counter and threatened him with a broken bottle. Wrestled to the ground and with a broken bottle in front of his face, he had to make a split-second decision. With a powerful swing of his tail bone, he knocked the attacker down. This experience taught him the importance of effectively defending himself against unpleasant fellows and to eliminate threats before they get close to him ever again.
+</job>
+<job @title="Lumberjack" @icon="fa6-solid:tree">
+  After leaving his hometown, Viktor started working as a lumberjack. The club at the end of his tail came very much in handy as a counterweight for each swing of his axe, allowing him to strike efficiently and powerfully, felling even the largest trees with relative ease. His naturally tough scales protected him from splinters from the felled wood. The long-lasting hard physical work toughened his body over the years. Before taking the cut logs to the sawmill, Viktor always took a break to rest in the peace and quiet of the forest. Although he enjoyed the seclusion of the country life for a while, he was longing for the sociability of city life again.
+</job>
+<job @title="Car Mechanic" @icon="fa6-solid:car">
+  Moving into a suburban town, Viktor applied at an auto repair shop, where he learned the ins and outs of fixing cars. He became really good at it and enjoyed breathing new mechanical life into broken down vehicles. However, as time went on, the repair shop faced financial troubles, as it became increasingly difficult to come by spare parts as auto makers would only deal them to certified repair partners and certifications were prohibitively expensive. Viktor had to watch business slowly deteriorate, as skilled coworkers kept getting laid off, until the repair shop closed down for good.
+</job>
+<job @title="Construction Worker" @icon="fa6-solid:helmet-safety">
+  Having taken a liking in physically demanding work, Viktor took on a job as a construction worker. Hard hat perched atop his head and belt tool slung around his waist, he was always ready to lend a hand (or tail if walls or boulders needed a good teardown). Since he had more than enough strength training from his previous jobs, he was often assigned carrying jobs to clear the site and haul building materials. After work was done, Viktor enjoyed the company of his colleagues over an after-work beer until late in the evenings. On one of these evenings, he got a little reckless with a colleague under the veil of the night and both were caught in the act of fooling around with each other on the construction site. In the following weeks, the colleagues kept their distance from Viktor and the evenings together also dissolved very quickly when he joined them. The continued ostracization ultimately prompted him to look for something new.
+</job>
+<job @title="Welder" @icon="fa6-solid:industry">
+  In his job as a welder, Viktor spent his days working shifts in a workshop. In addition to special tools and plasma welders, he also used his powerful tail club to hammer metal parts into shape. He acquired a wide variety of welding techniques to join or repair metal structures. He worked with a wide variety of alloys such as steel, aluminum and titanium. Viktor showed extreme skill in his work with great precision and attention to detail. However, this dedication was a thorn in the side of a jealous colleague who saw Viktor as a rival and schemed against him, sabotaging his work, which ultimately ended in his termination after a customer sued the welding shop for botching the job. Viktor never found out who the culprit was, and the loss of that job still hangs over him.
+</job>
+<job @title="Delivery Driver" @icon="fa6-solid:truck">
+  When Viktor was strapped for cash, he took on a job in the gig economy as a driver delivering packages for a large online delivery service. His previous physically demanding jobs allowed him to haul even bulky deliveries to their destination with relative ease. If the shipping center managers hadn't been breathing down his neck constantly, he might have held this job even longer. But after one of the managers tried to show him up in front of the whole team, he snapped and broke their leg with his tail club. Of course, he didn't have to report for duty the next day.
+</job>
+<job @title="Docks Werehouse Worker" @icon="fa6-solid:boxes-stacked">
+  Currently Viktor works at the docks in the port town he moved to. His main responsibilities include loading and unloading cargo from ships and transporting it to and from warehousing. The hustle and bustle of the port sometimes gets on his nerves. Especially when the crew of docking ships come ashore again after a long time and make it clear that they don't have much contact with \"landlubbers\". Viktor doesn't get particularly impressed by this and foul mouths them right back if he gets the impression they're looking for trouble.
+</job>
diff --git a/src/viktor/viktor.11tydata.json b/src/viktor/viktor.11tydata.json
index 0e8fc64..11f06a4 100644
--- a/src/viktor/viktor.11tydata.json
+++ b/src/viktor/viktor.11tydata.json
@@ -1,41 +1,4 @@
 {
   "layout": "character.webc",
-  "language": "en_US",
-  "jobs": [
-    {
-      "title": "Bartender",
-      "icon": "fa6-solid:whiskey-glass",
-      "desc": "Viktor's professional career began as a bartender at a pub in his hometown. There he often doubled as a bouncer when a few guests got too drunk and started making a fuss. A defining moment of that job was when someone climbed over the counter and threatened him with a broken bottle. Wrestled to the ground and with a broken bottle in front of his face, he had to make a split-second decision. With a powerful swing of his tail bone, he knocked the attacker down. This experience taught him the importance of effectively defending himself against unpleasant fellows and to eliminate threats before they get close to him ever again."
-    },
-    {
-      "title": "Lumberjack",
-      "icon": "fa6-solid:tree",
-      "desc": "After leaving his hometown, Viktor started working as a lumberjack. The club at the end of his tail came very much in handy as a counterweight for each swing of his axe, allowing him to strike efficiently and powerfully, felling even the largest trees with relative ease. His naturally tough scales protected him from splinters from the felled wood. The long-lasting hard physical work toughened his body over the years. Before taking the cut logs to the sawmill, Viktor always took a break to rest in the peace and quiet of the forest. Although he enjoyed the seclusion of the country life for a while, he was longing for the sociability of city life again."
-    },
-    {
-      "title": "Car Mechanic",
-      "icon": "fa6-solid:car",
-      "desc": "Moving into a suburban town, Viktor applied at an auto repair shop, where he learned the ins and outs of fixing cars. He became really good at it and enjoyed breathing new mechanical life into broken down vehicles. However, as time went on, the repair shop faced financial troubles, as it became increasingly difficult to come by spare parts as auto makers would only deal them to certified repair partners and certifications were prohibitively expensive. Viktor had to watch business slowly deteriorate, as skilled coworkers kept getting laid off, until the repair shop closed down for good."
-    },
-    {
-      "title": "Construction Worker",
-      "icon": "fa6-solid:helmet-safety",
-      "desc": "Having taken a liking in physically demanding work, Viktor took on a job as a construction worker. Hard hat perched atop his head and belt tool slung around his waist, he was always ready to lend a hand (or tail if walls or boulders needed a good teardown). Since he had more than enough strength training from his previous jobs, he was often assigned carrying jobs to clear the site and haul building materials. After work was done, Viktor enjoyed the company of his colleagues over an after-work beer until late in the evenings. On one of these evenings, he got a little reckless with a colleague under the veil of the night and both were caught in the act of fooling around with each other on the construction site. In the following weeks, the colleagues kept their distance from Viktor and the evenings together also dissolved very quickly when he joined them. The continued ostracization ultimately prompted him to look for something new."
-    },
-    {
-      "title": "Welder",
-      "icon": "fa6-solid:industry",
-      "desc": "In his job as a welder, Viktor spent his days working shifts in a workshop. In addition to special tools and plasma welders, he also used his powerful tail club to hammer metal parts into shape. He acquired a wide variety of welding techniques to join or repair metal structures. He worked with a wide variety of alloys such as steel, aluminum and titanium. Viktor showed extreme skill in his work with great precision and attention to detail. However, this dedication was a thorn in the side of a jealous colleague who saw Viktor as a rival and schemed against him, sabotaging his work, which ultimately ended in his termination after a customer sued the welding shop for botching the job. Viktor never found out who the culprit was, and the loss of that job still hangs over him."
-    },
-    {
-      "title": "Delivery Driver",
-      "icon": "fa6-solid:truck",
-      "desc": "When Viktor was strapped for cash, he took on a job in the gig economy as a driver delivering packages for a large online delivery service. His previous physically demanding jobs allowed him to haul even bulky deliveries to their destination with relative ease. If the shipping center managers hadn't been breathing down his neck constantly, he might have held this job even longer. But after one of the managers tried to show him up in front of the whole team, he snapped and broke their leg with his tail club. Of course, he didn't have to report for duty the next day."
-    },
-    {
-      "title": "Docks Werehouse Worker",
-      "icon": "fa6-solid:boxes-stacked",
-      "desc": "Currently Viktor works at the docks in the port town he moved to. His main responsibilities include loading and unloading cargo from ships and transporting it to and from warehousing. The hustle and bustle of the port sometimes gets on his nerves. Especially when the crew of docking ships come ashore again after a long time and make it clear that they don't have much contact with \"landlubbers\". Viktor doesn't get particularly impressed by this and foul mouths them right back if he gets the impression they're looking for trouble."
-    }
-  ]
+  "language": "en_US"
 }