From da5c533d301d5ef92dbab7daf483b379d837a57c Mon Sep 17 00:00:00 2001
From: christian <christian@rannes.dev>
Date: Tue, 6 May 2025 01:08:13 +0200
Subject: [PATCH] ``` Improve styling and data consistency across components

- Added `whitespace-nowrap` to Badge component for better layout control.
- Changed JobCard list styling to `list-outside` and adjusted tag scrolling.
- Updated project titles and tags in rannesDevData for accuracy.
```
---
 src/routes/Badge.svelte     | 2 +-
 src/routes/JobCard.svelte   | 6 +++---
 src/routes/rannesDevData.ts | 6 +++---
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/routes/Badge.svelte b/src/routes/Badge.svelte
index 09258c7..a87531c 100644
--- a/src/routes/Badge.svelte
+++ b/src/routes/Badge.svelte
@@ -2,6 +2,6 @@
 	let { children } = $props();
 </script>
 
-<div class="rounded-full bg-gray-200 px-2 py-1 text-sm text-gray-600">
+<div class="rounded-full bg-gray-200 px-2 py-1 text-sm whitespace-nowrap text-gray-600">
 	{@render children()}
 </div>
diff --git a/src/routes/JobCard.svelte b/src/routes/JobCard.svelte
index 51a87a9..e6219f9 100644
--- a/src/routes/JobCard.svelte
+++ b/src/routes/JobCard.svelte
@@ -24,12 +24,12 @@
 		{jobDescription}
 	</p>
 	<h3 class="mt-6 text-xl md:text-2xl">Accomplishments</h3>
-	<ul class="mt-4 list-inside list-disc">
+	<ul class="mt-4 list-outside list-disc">
 		{#each accomplishments as accomplishment, i (i)}
 			<li class="mt-4 md:text-xl">
 				<span class="underline md:no-underline">{accomplishment.title}</span>
-				<p class="mt-1 ml-4 text-base md:mt-2 md:ml-5">{accomplishment.description}</p>
-				<div class="mt-2 ml-5 flex gap-2">
+				<p class="mt-1 text-base md:mt-2">{accomplishment.description}</p>
+				<div class="mt-2 flex gap-2 overflow-x-scroll">
 					{#each accomplishment.tags as tag, i (`${tag}-${i}`)}
 						<Badge>{tag}</Badge>
 					{/each}
diff --git a/src/routes/rannesDevData.ts b/src/routes/rannesDevData.ts
index ff69ff1..00c6769 100644
--- a/src/routes/rannesDevData.ts
+++ b/src/routes/rannesDevData.ts
@@ -5,13 +5,13 @@ export const rannesDescription =
 
 export const rannesAccomplish: Accomplishment[] = [
 	{
-		title: 'Developed, Deployed and maintaining Calma.dk',
+		title: 'Developed, Deployed and maintaining calmacph.dk',
 		description:
 			'The web page is developed in Svelte with integrated CMS (Sanity.io) which allows the client to customize all text, and menus on the page. I also wrote a program in Golang which parses their winelist from an excel sheet (their stock take list), and uploads it to a s3 bucket from where its served to the user on the web page. This enables the client to make instant changes to their website, including their winelist. The page is built mobile first, and scales for all devices. It is deployed to my k3s cluster in hetzner',
-		tags: ['Svelte', 'Sveltekit', 'AWS', 'k3s', 'Object Storage', 'CMS']
+		tags: ['Svelte', 'Sveltekit', 'AWS', 'k3s', 'S3', 'CMS']
 	},
 	{
-		title: 'Developed, deployed and maintaining Sauerwine.dk',
+		title: 'Developed, deployed and maintaining sauerwine.dk',
 		description:
 			'The web page is developed in Svelte and integrated with CMS (Sanity.io) so the client can change all text content on the web page. It is deployed to my k3s cluster in hetzner.',
 		tags: ['Svelte', 'Sveltekit', 'k3s', 'CMS']