consolidated web dev projects in its own page, and update sw jobs

src/lib/Projects.svelte

@@ -1,11 +1,8 @@
 <script>
 	import { projects } from '$lib/projects.js';
 	import ProjectCard from './ProjectCard/ProjectCard.svelte';
-	export let category;
 </script>
 
 {#each projects as project}
-	{#if project.category === category}
 		<ProjectCard {...project} />
-	{/if}
 {/each}

src/lib/TopNav.svelte

@@ -9,10 +9,7 @@
 		DarkMode
 	} from 'flowbite-svelte';
 	import { ChevronDownOutline } from 'flowbite-svelte-icons';
-	import logo from '$lib/logo.png'
+	import logo from '$lib/logo.png';
-	import { page } from '$app/stores';
-
-	$: activeUrl = $page.url.pathname;
 </script>
 
 <Navbar class="bg-transparent dark:bg-transparent">
@@ -25,18 +22,13 @@
 	<div class="flex">
 		<DarkMode btnClass="block sm:hidden" />
 	</div>
-	<NavUl class="md:flex-row" {activeUrl}>
+	<NavUl class="md:flex-row">
 		<NavLi href="/">home</NavLi>
 		<NavLi class="cursor-pointer">
 			projects<ChevronDownOutline class="w-6 h-6  text-primary-800 dark:text-stone-200 inline" />
 		</NavLi>
-		<Dropdown
+		<Dropdown activeClass="font-bold text-primary-800 dark:text-stone-200" class="w-44 z-20">
-			{activeUrl}
+			<DropdownItem href="/projects/web-dev">web-dev</DropdownItem>
-			activeClass="font-bold text-primary-800 dark:text-stone-200"
-			class="w-44 z-20"
-		>
-			<DropdownItem href="/projects/svelte">svelte</DropdownItem>
-			<DropdownItem href="/projects/nextjs">nextjs</DropdownItem>
 			<DropdownItem href="/projects/homelab">homelab</DropdownItem>
 		</Dropdown>
 		<NavLi class="hidden sm:block">

src/lib/projects.js

@@ -4,19 +4,15 @@ import vercelIcon from '$lib/images/vendorIcons/vercelIcon.svg';
 import flowbiteSvelteIcon from '$lib/images/vendorIcons/flowbiteSvelteIcon.svg';
 import reactIcon from '$lib/images/vendorIcons/reactIcon.svg';
 import nextjsIcon from '$lib/images/vendorIcons/nextjsIcon.svg';
-import drizzleIcon from '$lib/images/vendorIcons/drizzleIcon.webp';
-import zustandIcon from '$lib/images/vendorIcons/zustandIcon.png';
-import shadcnIcon from '$lib/images/vendorIcons/shadcnIcon.png';
 import goIcon from '$lib/images/vendorIcons/goIcon.svg';
-import awsIcon from '$lib/images/vendorIcons/awsIcon.svg';
+import k8sIcon from '$lib/images/vendorIcons/kubernetes.svg'
 
 export const projects = [
   {
-		category: 'nextjs',
     title: 'Software Jobs',
     url: 'https://jobs.rannes.dev',
     description:
-			'I wanted an excuse to try out Go, and I also want to find a job. The scraper is built with Go and the Colly package. It runs on a AWS EC2 instance, and the frontend is built with Next.js which is deployed to Vercel.',
+      'I wanted an excuse to try out Go, and I also want to find a job. The scraper is built with Go and the Colly package. The scraper runs as a cron job in kubernetes, and is served as an API deployd to the same cluster. The frontend is built with Next.js which is deployed to Vercel.',
     repo: 'https://gitea.rannes.dev/rannes.dev/sw-jobs-frontend',
     rss: 'https://gitea.rannes.dev/rannes.dev/sw-jobs-frontend.rss',
     image: '',
@@ -42,14 +38,13 @@ export const projects = [
         url: 'https://vercel.com/'
       },
       {
-				name: 'AWS',
+        name: 'k8s',
-				img: awsIcon,
+        img: k8sIcon,
         url: 'https://aws.amazon.com/'
       }
     ]
   },
   {
-		category: 'svelte',
     title: 'Portfolio',
     url: 'https://rannes.dev',
     description:
@@ -80,53 +75,6 @@ export const projects = [
       }
     ]
   },
-	{
-		category: 'nextjs',
-		title: 'Online Wine Shop.',
-		url: 'https://wine-shop-eta.vercel.app/',
-		description:
-			"To get practical experience with forms, databases, queries and states I want to build a online wine shop for my friend Ketil (that he didn't ask for). Besides the current technologies, I plan to implement Clerk or Auth.js for auth, and Zustand for state management if neccesary (Something tells me it's needed at least for cart) I am doing my best to implement progressive enhancement in forms with cool hooks like <code class='dark:bg-slate-800 bg-stone-300 rounded p-1'>useActionState</code> and explore caching and the prevention of caching in nextjs and vercel. 🤷",
-		repo: 'https://gitea.rannes.dev/rannes.dev/wine-shop',
-		rss: 'https://gitea.rannes.dev/rannes.dev/wine-shop.rss',
-		image: '',
-		vendors: [
-			{
-				name: 'React',
-				img: reactIcon,
-				url: 'https://react.dev/'
-			},
-			{
-				name: 'Next.js',
-				img: nextjsIcon,
-				url: 'https://nextjs.org/'
-			},
-			{
-				name: 'Tailwind',
-				img: tailwindIcon,
-				url: 'https://tailwindcss.com/'
-			},
-			{
-				name: 'Drizzle',
-				img: drizzleIcon,
-				url: 'https://orm.drizzle.team/'
-			},
-			{
-				name: 'Zustand',
-				img: zustandIcon,
-				url: 'https://zustand-demo.pmnd.rs/'
-			},
-			{
-				name: 'Shadcn',
-				img: shadcnIcon,
-				url: 'https://ui.shadcn.com/'
-			},
-			{
-				name: 'Vercel',
-				img: vercelIcon,
-				url: 'https://vercel.com/'
-			}
-		]
-	},
   {
     category: 'nextjs',
     title: 'Local weather',

src/routes/+layout.svelte

@@ -1,18 +1,10 @@
-<script>
+<script lang="ts">
 	import '../app.css';
 	import CloudflareAnalytics from '$lib/CloudflareAnalytics.svelte';
 	import BottomNavigation from '../lib/BottomNavigation.svelte';
 	import TopNav from '../lib/TopNav.svelte';
-	import { inject } from '@vercel/analytics';
-	let activeBtn = 'home';
-	function handleNavItemClick(btnName) {
-		activeBtn = btnName;
-	}
-	$: activeBtn = activeBtn === 'projects';
-	inject();
 </script>
 
-<CloudflareAnalytics />
 <TopNav />
 <div class="px-2 sm:px-0 mx-auto max-w-xs sm:max-w-md md:max-w-3xl mb-20 md:mb-0">
 	<slot />

src/routes/projects/web-dev/+page.svelte

@@ -2,11 +2,10 @@
 	import { fade } from 'svelte/transition';
 	import Projects from '$lib/Projects.svelte';
 	import PageHeader from '$lib/PageHeader.svelte';
-	const category = 'nextjs';
+	const title = 'Web dev projects';
-	const title = 'Next.js Projects';
 </script>
 
 <div in:fade>
 	<PageHeader {title} />
-	<Projects {category} />
+	<Projects />
 </div>