wip: 2024-11-26T08:29:42+0100 (1732606182)

api/endpoints/work/GET.php

@@ -53,9 +53,10 @@
 
 				(new Rules(PARAM_LIMIT))
 					->type(Type::NUMBER)
+					->type(Type::NULL)
 					->min(1)
 					->max(parent::MYSQL_INT_MAX_LENGTH)
-					->default(parent::MYSQL_INT_MAX_LENGTH)
+					->default(null)
 			]);
 
 			parent::__construct(Databases::VLW, $this->ruleset);

public/assets/css/pages/work.css

@@ -19,28 +19,6 @@ vv-shell {
 
 /* # Sections */
 
-/* ## Git */
-
-section.git {
-	display: flex;
-	flex-direction: column;
-	gap: var(--padding);
-	background-color: rgba(var(--primer-color-accent), .1);
-	padding: calc(var(--padding) * 1.5);
-	border-radius: 6px;
-}
-
-section.git svg {
-	fill: white;
-	width: 60px;
-}
-
-section.git .buttons {
-	display: flex;
-	flex-direction: column;
-	gap: var(--padding);
-}
-
 /* ## Hero */
 
 section.hero {
@@ -161,12 +139,6 @@ section.featured featured-item .actions {
 
 /* # Size queries */
 
-@media (min-width: 460px) {
-	section.git .buttons {
-		flex-direction: row;
-	}
-}
-
 @media (min-width: 600px) {
 	section.hero {
 		grid-template-columns: repeat(2, 1fr);
@@ -174,21 +146,6 @@ section.featured featured-item .actions {
 }
 
 @media (min-width: 900px) {
-	section.git {
-		display: grid;
-		grid-template-columns: 70px 1fr 400px;
-		align-items: center;
-		gap: calc(var(--padding) * 1.5);
-	}
-
-	section.git svg {
-		width: 100%;
-	}
-
-	section.git .buttons {
-		justify-content: end;
-	}
-
 	section.featured {
 		grid-template-columns: repeat(3, 1fr);
 	}

public/assets/css/pages/work/timeline.css

@@ -16,6 +16,28 @@ vv-shell {
 
 /* # Sections */
 
+/* ## Git */
+
+section.git {
+	display: flex;
+	flex-direction: column;
+	gap: var(--padding);
+	background-color: rgba(var(--primer-color-accent), .1);
+	padding: calc(var(--padding) * 1.5);
+	border-radius: 6px;
+}
+
+section.git svg {
+	fill: white;
+	width: 60px;
+}
+
+section.git .buttons {
+	display: flex;
+	flex-direction: column;
+	gap: var(--padding);
+}
+
 /* ## Timeline */
 
 section.timeline {
@@ -101,10 +123,12 @@ section.timeline .items .item .actions {
 	margin-top: 7px;
 }
 
-/* ## Note */
+/* # Size queries */
 
-section.note {
+@media (min-width: 460px) {
-	text-align: center;
+	section.git .buttons {
+		flex-direction: row;
+	}
 }
 
 @media (max-width: 500px) {
@@ -145,3 +169,20 @@ section.note {
 		margin-top: var(--padding);
 	}
 }
+
+@media (min-width: 900px) {
+	section.git {
+		display: grid;
+		grid-template-columns: 70px 1fr 400px;
+		align-items: center;
+		gap: calc(var(--padding) * 1.5);
+	}
+
+	section.git svg {
+		width: 100%;
+	}
+
+	section.git .buttons {
+		justify-content: end;
+	}
+}

public/work.php

@@ -13,7 +13,7 @@
 	require_once VV::root("api/src/databases/models/Work/Work.php");
 
 	// Number of items from the timeline to display on this page
-	const TIMELINE_PREVIEW_LIMIT = 10;
+	const TIMELINE_PREVIEW_LIMIT = 5;
 
 	$work = new class extends API {
 		const ERROR_MSG = "Something went wrong";
@@ -41,14 +41,6 @@
 
 ?>
 <style><?= VV::css("public/assets/css/pages/work") ?></style>
-<section class="git">
-	<?= VV::embed("public/assets/media/icons/codeberg.svg") ?>
-	<p>I have moved most of my free open-source software <a href="https://giveupgithub.com">away from GitHub</a> to <a href="https://codeberg.org/vlw">Codeberg</a>. I also have a mirror of everything and sources for some smaller projects on <a href="https://git.vlw.se">Forgejo</a>.</p>
-	<div class="buttons">
-		<a href="https://codeberg.org/vlw"><button class="inline solid">Codeberg</button></a>
-		<a href="https://git.vlw.se"><button class="inline">Forgejo</button></a>
-	</div>
-</section>
 <section class="hero">
 	<div class="item vegvisir">
 		<div class="wrapper">
@@ -134,7 +126,7 @@
 			<?= VV::embed("public/assets/media/icons/star.svg") ?>
 		</div>
 		<h3>Custom pages for Deltaco AB</h3>
-		<p>From design mock-ups created by the SweDeltaco marketing team, I built various web pages for campagins and special events for the nordic IT-distributor's website using a custom content injection framework for SharePoint that would later inspire my other project, Vegvisir.</p>
+		<p><?= $work->get_summary("deltaco/asyncapp") ?></p>
 		<div class="actions">
 			<a href=""><button class="inline">read more</button></a>
 		</div>

public/work/timeline.php

@@ -20,6 +20,8 @@
 	require_once VV::root("api/src/databases/models/Work/WorkActions.php");
 
 	$work = new class extends API {
+		private const API_PARAM_LIMIT = "limit";
+
 		private readonly Response $resp;
 		private readonly Response $tags;
 		private readonly Response $actions;
@@ -28,7 +30,8 @@
 			parent::__construct();
 
 			$this->resp = $this->call(Endpoints::WORK->value)->params([
-				WorkModel::IS_LISTED->value => true
+				WorkModel::IS_LISTED->value => true,
+				self::API_PARAM_LIMIT       => $_GET[self::API_PARAM_LIMIT] ?? null
 			])->get();
 
 			// Fetch metadata for work items if we got an ok from work endpoint
@@ -87,12 +90,20 @@
 				return [];
 			}
 
-			return in_array($key, $this->actions->json()) ? $this->actions->json()[$key] : [];
+			return array_key_exists($key, $this->actions->json()) ? $this->actions->json()[$key] : [];
 		}
 	}
 
 ?>
 <style><?= VV::css("public/assets/css/pages/work/timeline") ?></style>
+<section class="git">
+	<?= VV::embed("public/assets/media/icons/codeberg.svg") ?>
+	<p>This timeline contains most but not all of my FOSS software. If you want to see a list of all things I've created for the free software world, check out my repos on Codeberg or Forgejo.</p>
+	<div class="buttons">
+		<a href="https://codeberg.org/vlw"><button class="inline solid">Codeberg</button></a>
+		<a href="https://git.vlw.se"><button class="inline">Forgejo</button></a>
+	</div>
+</section>
 <section class="timeline">
 
 	<?php // Get year int from key and array of months for current year ?>
@@ -170,7 +181,4 @@
 	<?php endforeach; ?>
 
 </section>
-<section class="note">
-	<p>This is not really the end of the list. I will add some of my notable older work at some point.</p>
-</section>
 <script><?= VV::js("assets/js/pages/work/timeline") ?></script>