@turnipxenon/pineapple 5.0.0 → 5.1.0

package/dist/ui/modules/experience/ExampleJob1.svelte.d.ts

@@ -0,0 +1,26 @@
+import type { ProjectComponentProps } from "../../templates/SeaweedLayout/ProjectComponentProps";
+declare const key = "Software Engineer at Old Company";
+declare const dateStarted = "2022-01-01";
+declare const dateFinished = "2024-12-31";
+declare const tags: string[];
+export { component, key, dateStarted, dateFinished, tags };
+declare const component: (props: ProjectComponentProps) => ReturnType<import("svelte").Snippet>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const ExampleJob1: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type ExampleJob1 = InstanceType<typeof ExampleJob1>;
+export default ExampleJob1;
+//# sourceMappingURL=ExampleJob1.svelte.d.ts.map

package/dist/ui/modules/experience/ExampleJob1.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExampleJob1.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/experience/ExampleJob1.svelte.ts"],"names":[],"mappings":"AAKC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAEnG,QAAA,MAAM,GAAG,qCAAqC,CAAC;AAC/C,QAAA,MAAM,WAAW,eAAe,CAAC;AACjC,QAAA,MAAM,YAAY,eAAe,CAAC;AAClC,QAAA,MAAM,IAAI,UAAkC,CAAC;AAI7C,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC;AACzD,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAyBlG,CAAC;AAe9B,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,WAAW;;kBAA+E,CAAC;AAC/E,KAAK,WAAW,GAAG,YAAY,CAAC,OAAO,WAAW,CAAC,CAAC;AACtD,eAAe,WAAW,CAAC"}

package/dist/ui/modules/experience/ExampleJob2.svelte

@@ -0,0 +1,74 @@
+<!-- TODO: Documentation: consider documentation showcase -->
+
+<script module lang="ts">
+	import type { ProjectComponentProps } from "../../templates/SeaweedLayout/ProjectComponentProps";
+	import { default as FourPartCard } from "../../components/FourPartCard.svelte";
+	import { TextChip } from "../../elements/TextChip";
+
+	const key = "Senior Developer at Current Company";
+	const dateStarted = "2024-01-01";
+	// No dateFinished export - indicates ongoing position
+	// qt-ongoing, qt-systems, qt-performance, qt-infrastructure
+	const tags = ["ongoing", "rust", "systems", "performance", "infrastructure"];
+	export { component, key, dateStarted, tags };
+</script>
+
+{#snippet component(props: ProjectComponentProps)}
+	<FourPartCard>
+		{#snippet headerCover()}
+			<div class="company-logo-placeholder">
+				<h1>CC</h1>
+			</div>
+		{/snippet}
+
+		{#snippet header()}
+			<h3>Senior Developer</h3>
+			<h4>Current Company</h4>
+			<p class="date-range">Jan 2024 - Present</p>
+		{/snippet}
+
+		<p>
+			Currently working on high-performance systems using
+			<span class="qt-rust">Rust</span>.
+			Leading development of critical infrastructure components and mentoring junior developers to preach our love of
+			<span class="qt-rust">Rust</span>. Did I forget to mention <span class="qt-rust">RUST</span>?!?!
+		</p>
+
+		<div class="text-chip-container">
+			{#each tags as t (t)}
+				<TextChip queryClass="qt-{t}">{t}</TextChip>
+			{/each}
+		</div>
+	</FourPartCard>
+{/snippet}
+
+<style>
+	.company-logo-placeholder {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 100%;
+		height: 100%;
+		min-height: 150px;
+		background: linear-gradient(135deg, var(--color-secondary-500), var(--color-tertiary-500));
+		color: white;
+		font-size: 2rem;
+		font-weight: bold;
+	}
+
+	.date-range {
+		font-size: 0.875rem;
+		color: var(--color-text-secondary);
+		margin-bottom: 0.5rem;
+	}
+
+	h4 {
+		margin-top: 0.25rem;
+		margin-bottom: 0.5rem;
+		color: var(--color-text-secondary);
+	}
+
+	.ongoing-badge {
+		margin-top: 0.5rem;
+	}
+</style>

package/dist/ui/modules/experience/ExampleJob2.svelte.d.ts

@@ -0,0 +1,25 @@
+import type { ProjectComponentProps } from "../../templates/SeaweedLayout/ProjectComponentProps";
+declare const component: (props: ProjectComponentProps) => ReturnType<import("svelte").Snippet>;
+declare const key = "Senior Developer at Current Company";
+declare const dateStarted = "2024-01-01";
+declare const tags: string[];
+export { component, key, dateStarted, tags };
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const ExampleJob2: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type ExampleJob2 = InstanceType<typeof ExampleJob2>;
+export default ExampleJob2;
+//# sourceMappingURL=ExampleJob2.svelte.d.ts.map

package/dist/ui/modules/experience/ExampleJob2.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExampleJob2.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/experience/ExampleJob2.svelte.ts"],"names":[],"mappings":"AAGC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAGnG,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CA2BhG,CAAC;AAE7B,QAAA,MAAM,GAAG,wCAAwC,CAAC;AAClD,QAAA,MAAM,WAAW,eAAe,CAAC;AAGjC,QAAA,MAAM,IAAI,UAAkE,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;AAW9C,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,WAAW;;kBAA+E,CAAC;AAC/E,KAAK,WAAW,GAAG,YAAY,CAAC,OAAO,WAAW,CAAC,CAAC;AACtD,eAAe,WAAW,CAAC"}

package/dist/ui/modules/experience/index.d.ts

@@ -0,0 +1,3 @@
+export * as ExampleJob1 from './ExampleJob1.svelte';
+export * as ExampleJob2 from './ExampleJob2.svelte';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/modules/experience/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/experience/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,WAAW,MAAM,sBAAsB,CAAC;AACpD,OAAO,KAAK,WAAW,MAAM,sBAAsB,CAAC"}

package/dist/ui/modules/experience/index.js

@@ -0,0 +1,2 @@
+export * as ExampleJob1 from './ExampleJob1.svelte';
+export * as ExampleJob2 from './ExampleJob2.svelte';

package/dist/ui/modules/modals/general-settings/LanguagePicker.svelte

@@ -16,16 +16,15 @@
 		{ label: "Tagalog", value: "tl" }
 	];
 
-	let selectedCountry = $state(getLocale());
+	let selectedCountry = $state([getLocale()]);
 
-	const onValueChange = (e: { value: ComboxData["value"] | undefined }) => {
-		if (!e.value) return;
+	const onValueChange = (e: ComboxData["value"][] | undefined) => {
+		if (!e || e.length === 0) return;
 
-		const data = comboboxData.find((d) => d.value === e.value);
-		if (data) {
-			selectedCountry = data.value;
+		const data = comboboxData.filter(v => e.includes(v.value));
+		if (data && data.length > 0) {
 			const pathname = deLocalizeHref(location.href);
-			location.href = localizeHref(pathname, { locale: data.value });
+			location.href = localizeHref(pathname, { locale: data[0].value });
 		}
 	};
 
@@ -34,8 +33,7 @@
 
 <PinyaCombobox
 	data={comboboxData}
-	value={selectedCountry}
-	defaultValue={selectedCountry}
+	bind:value={selectedCountry}
 	label="Select Language"
 	placeholder="Select Language"
 	{onValueChange}

package/dist/ui/modules/modals/general-settings/LanguagePicker.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LanguagePicker.svelte.d.ts","sourceRoot":"","sources":["../../../../../src/lib/ui/modules/modals/general-settings/LanguagePicker.svelte.ts"],"names":[],"mappings":"AA6CA,QAAA,MAAM,cAAc,2DAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}
+{"version":3,"file":"LanguagePicker.svelte.d.ts","sourceRoot":"","sources":["../../../../../src/lib/ui/modules/modals/general-settings/LanguagePicker.svelte.ts"],"names":[],"mappings":"AA4CA,QAAA,MAAM,cAAc,2DAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/ui/modules/projects/Hepcat.svelte

@@ -11,7 +11,11 @@
 	import { ButtonVariant } from "../../elements/PinyaButtonCommon/ButtonVariant";
 
 	const key = "Hepcat";
-	export { component, key };
+	const dateStarted = "2020-01-01";
+	const dateFinished = "2020-04-15";
+	const tags = ["unity", "csharp", "game", "rhythm", "rpgmaker"];
+	// type SnippetMeta at src/lib/ui/templates/SeaweedLayout/props.ts:6
+	export { component, key, dateStarted, dateFinished, tags };
 </script>
 
 {#snippet component(props: ProjectComponentProps)}

package/dist/ui/modules/projects/Hepcat.svelte.d.ts

@@ -1,7 +1,10 @@
 import type { ProjectComponentProps } from "../../templates/SeaweedLayout/ProjectComponentProps";
 declare const component: (props: ProjectComponentProps) => ReturnType<import("svelte").Snippet>;
 declare const key = "Hepcat";
-export { component, key };
+declare const dateStarted = "2020-01-01";
+declare const dateFinished = "2020-04-15";
+declare const tags: string[];
+export { component, key, dateStarted, dateFinished, tags };
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;

package/dist/ui/modules/projects/Hepcat.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Hepcat.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/projects/Hepcat.svelte.ts"],"names":[],"mappings":"AAKC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAMnG,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAwChG,CAAC;AAE7B,QAAA,MAAM,GAAG,WAAW,CAAC;AACrB,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC;AAY3B,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,MAAM;;kBAA+E,CAAC;AAC1E,KAAK,MAAM,GAAG,YAAY,CAAC,OAAO,MAAM,CAAC,CAAC;AAC5C,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Hepcat.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/projects/Hepcat.svelte.ts"],"names":[],"mappings":"AAKC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAMnG,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAwChG,CAAC;AAE7B,QAAA,MAAM,GAAG,WAAW,CAAC;AACrB,QAAA,MAAM,WAAW,eAAe,CAAC;AACjC,QAAA,MAAM,YAAY,eAAe,CAAC;AAClC,QAAA,MAAM,IAAI,UAAoD,CAAC;AAE/D,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC;AAY5D,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,MAAM;;kBAA+E,CAAC;AAC1E,KAAK,MAAM,GAAG,YAAY,CAAC,OAAO,MAAM,CAAC,CAAC;AAC5C,eAAe,MAAM,CAAC"}

package/dist/ui/modules/projects/Pengi.svelte

@@ -11,7 +11,10 @@
 	import { ButtonVariant } from "../../elements/PinyaButtonCommon/ButtonVariant";
 
 	const key = "Pengi";
-	export { component, key };
+	const dateStarted = "2020-08-01";
+	const dateFinished = "2020-12-15";
+	const tags = ["unity", "csharp", "game", "narrative", "yarnspinner"];
+	export { component, key, dateStarted, dateFinished, tags };
 </script>
 
 {#snippet component(props: ProjectComponentProps)}

package/dist/ui/modules/projects/Pengi.svelte.d.ts

@@ -1,7 +1,10 @@
 import type { ProjectComponentProps } from "../../templates/SeaweedLayout/ProjectComponentProps";
 declare const component: (props: ProjectComponentProps) => ReturnType<import("svelte").Snippet>;
 declare const key = "Pengi";
-export { component, key };
+declare const dateStarted = "2020-08-01";
+declare const dateFinished = "2020-12-15";
+declare const tags: string[];
+export { component, key, dateStarted, dateFinished, tags };
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;

package/dist/ui/modules/projects/Pengi.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pengi.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/projects/Pengi.svelte.ts"],"names":[],"mappings":"AAKC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAMnG,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAoChG,CAAC;AAE7B,QAAA,MAAM,GAAG,UAAU,CAAC;AACpB,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC;AAS3B,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,KAAK;;kBAA+E,CAAC;AACzE,KAAK,KAAK,GAAG,YAAY,CAAC,OAAO,KAAK,CAAC,CAAC;AAC1C,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Pengi.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/projects/Pengi.svelte.ts"],"names":[],"mappings":"AAKC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAMnG,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAoChG,CAAC;AAE7B,QAAA,MAAM,GAAG,UAAU,CAAC;AACpB,QAAA,MAAM,WAAW,eAAe,CAAC;AACjC,QAAA,MAAM,YAAY,eAAe,CAAC;AAClC,QAAA,MAAM,IAAI,UAA0D,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC;AAS5D,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,KAAK;;kBAA+E,CAAC;AACzE,KAAK,KAAK,GAAG,YAAY,CAAC,OAAO,KAAK,CAAC,CAAC;AAC1C,eAAe,KAAK,CAAC"}

package/dist/ui/modules/projects/Soulwork.svelte

@@ -11,7 +11,10 @@
 	import { ButtonVariant } from "../../elements/PinyaButtonCommon/ButtonVariant";
 
 	const key = "Soulwork";
-	export { component, key };
+	const dateStarted = "2019-11-09";
+	const dateFinished = "2019-11-10";
+	const tags = ["unity", "csharp", "game", "gamejam", "physics"];
+	export { component, key, dateStarted, dateFinished, tags };
 </script>
 
 {#snippet component(props: ProjectComponentProps)}

package/dist/ui/modules/projects/Soulwork.svelte.d.ts

@@ -1,7 +1,10 @@
 import type { ProjectComponentProps } from "../../templates/SeaweedLayout";
 declare const component: (props: ProjectComponentProps) => ReturnType<import("svelte").Snippet>;
 declare const key = "Soulwork";
-export { component, key };
+declare const dateStarted = "2019-11-09";
+declare const dateFinished = "2019-11-10";
+declare const tags: string[];
+export { component, key, dateStarted, dateFinished, tags };
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;

package/dist/ui/modules/projects/Soulwork.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Soulwork.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/projects/Soulwork.svelte.ts"],"names":[],"mappings":"AAKC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AAM7E,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAiChG,CAAC;AAE7B,QAAA,MAAM,GAAG,aAAa,CAAC;AACvB,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC;AAS3B,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,QAAQ;;kBAA+E,CAAC;AAC5E,KAAK,QAAQ,GAAG,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC;AAChD,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Soulwork.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/projects/Soulwork.svelte.ts"],"names":[],"mappings":"AAKC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AAM7E,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAiChG,CAAC;AAE7B,QAAA,MAAM,GAAG,aAAa,CAAC;AACvB,QAAA,MAAM,WAAW,eAAe,CAAC;AACjC,QAAA,MAAM,YAAY,eAAe,CAAC;AAClC,QAAA,MAAM,IAAI,UAAoD,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC;AAS5D,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,QAAQ;;kBAA+E,CAAC;AAC5E,KAAK,QAAQ,GAAG,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC;AAChD,eAAe,QAAQ,CAAC"}

package/dist/ui/modules/projects/ThisWebpage.svelte

@@ -12,7 +12,9 @@
 	import { ButtonVariant } from "../../elements/PinyaButtonCommon/ButtonVariant";
 
 	const key = "This Webpage";
-	export { component, key };
+	const dateStarted = "2023-06-01";
+	const tags = ["svelte", "typescript", "web", "tailwind", "postgres", "prisma", "ongoing", "database"];
+	export { component, key, dateStarted, tags };
 </script>
 
 {#snippet component(props: ProjectComponentProps)}
@@ -48,7 +50,7 @@
 			<TextChip queryClass="qt-svelte">Svelte 5</TextChip>
 			<TextChip queryClass="qt-tailwind">Tailwind 4</TextChip>
 			<TextChip queryClass="qt-skeleton">Skeleton (Svelte UI library)</TextChip>
-			<TextChip queryClass="qt-ts">Typescript</TextChip>
+			<TextChip queryClass="qt-typescript">Typescript</TextChip>
 			<TextChip queryClass="qt-vercel qt-cicd">Vercel</TextChip>
 			<TextChip queryClass="qt-gamedev">YarnSpinner</TextChip>
 			<TextChip queryClass="qt-postgres qt-db">Postgres (SQL database)</TextChip>

package/dist/ui/modules/projects/ThisWebpage.svelte.d.ts

@@ -1,7 +1,9 @@
 import type { ProjectComponentProps } from "../../templates/SeaweedLayout/ProjectComponentProps";
 declare const component: (props: ProjectComponentProps) => ReturnType<import("svelte").Snippet>;
 declare const key = "This Webpage";
-export { component, key };
+declare const dateStarted = "2023-06-01";
+declare const tags: string[];
+export { component, key, dateStarted, tags };
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;

package/dist/ui/modules/projects/ThisWebpage.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThisWebpage.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/projects/ThisWebpage.svelte.ts"],"names":[],"mappings":"AAMC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAMnG,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAgDhG,CAAC;AAE7B,QAAA,MAAM,GAAG,iBAAiB,CAAC;AAC3B,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC;AAS3B,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,WAAW;;kBAA+E,CAAC;AAC/E,KAAK,WAAW,GAAG,YAAY,CAAC,OAAO,WAAW,CAAC,CAAC;AACtD,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ThisWebpage.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/projects/ThisWebpage.svelte.ts"],"names":[],"mappings":"AAMC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAMnG,QAAA,MAAM,SAAS,GAAyB,OAAO,qBAAqB,KAAqB,UAAU,CAAC,OAAO,QAAQ,EAAE,OAAO,CAgDhG,CAAC;AAE7B,QAAA,MAAM,GAAG,iBAAiB,CAAC;AAC3B,QAAA,MAAM,WAAW,eAAe,CAAC;AACjC,QAAA,MAAM,IAAI,UAA2F,CAAC;AACtG,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;AAS9C,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,WAAW;;kBAA+E,CAAC;AAC/E,KAAK,WAAW,GAAG,YAAY,CAAC,OAAO,WAAW,CAAC,CAAC;AACtD,eAAe,WAAW,CAAC"}

package/dist/ui/modules/universal-overlay/UniversalOverlay.svelte

@@ -50,7 +50,6 @@ See panels:
 
 		dialogManager.currentReadableState.subscribe((value) => {
 			isHidden = value === DialogState.Invisible;
-			console.log(value, DialogState.Invisible, isHidden)
 		});
 
 		dialogManager.update(0);

package/dist/ui/modules/universal-overlay/UniversalOverlay.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UniversalOverlay.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/universal-overlay/UniversalOverlay.svelte.ts"],"names":[],"mappings":"AAmHA;;;;;;;GAOG;AACH,QAAA,MAAM,gBAAgB,2DAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"UniversalOverlay.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/modules/universal-overlay/UniversalOverlay.svelte.ts"],"names":[],"mappings":"AAkHA;;;;;;;GAOG;AACH,QAAA,MAAM,gBAAgB,2DAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/ui/templates/SeaweedLayout/EntryGroup.svelte

@@ -1,42 +1,161 @@
 <!-- TODO: Documentation: consider documentation showcase -->
 
 <script lang="ts">
+	import SortDropdown from "../../components/SortDropdown.svelte";
+	import TagFilter from "../../components/TagFilter.svelte";
 	import { PinyaCard } from "../../elements/PinyaCard";
 	import type { ProjectGroup, SnippetMeta } from "./";
+	import { SectionType } from "./props";
 
 	let {
 		title,
 		entryList,
-		projectComponentProps
+		projectComponentProps,
+		// New props for Seaweed 3
+		sectionType = SectionType.Projects,
+		showFilter = false,
+		showSort = false,
+		showMoreLimit = 0
 	}: ProjectGroup = $props();
 
-	const isSpecial = $derived(entryList.length % 3 === 1);
+	// State
+	let selectedTags = $state<string[]>([]);
+	let sortBy = $state<string[]>(["default"]);
+	let isExpanded = $state(false);
 
-	let normalUiList: SnippetMeta[] = $derived(isSpecial
-		? [...entryList.slice(0, -4)]
-		: [...entryList]);
-	let overflowUiList: SnippetMeta[] = $derived(isSpecial
-		? [...entryList.slice(-4)]
-		: []);
+	// Derived values
+	const allTags = $derived([...new Set(entryList.flatMap(e => e.tags ?? []))]);
+
+	const filteredList = $derived(
+		selectedTags.length === 0
+			? entryList
+			: entryList.filter(e => e.tags?.some(t => selectedTags.includes(t)))
+	);
+
+	function sortEntries(list: SnippetMeta[], sort: string): SnippetMeta[] {
+		const sorted = [...list];
+		switch (sort) {
+			case "date-desc":
+				return sorted.sort((a, b) => {
+					// Entries without dateFinished go to the bottom
+					if (!a.dateFinished) return 1;
+					if (!b.dateFinished) return -1;
+					return new Date(b.dateFinished).getTime() - new Date(a.dateFinished).getTime();
+				});
+			case "date-asc":
+				return sorted.sort((a, b) => {
+					// Entries without dateFinished go to the bottom
+					if (!a.dateFinished) return 1;
+					if (!b.dateFinished) return -1;
+					return new Date(a.dateFinished).getTime() - new Date(b.dateFinished).getTime();
+				});
+			case "duration-desc":
+				return sorted.sort((a, b) => {
+					const durationA = getDuration(a);
+					const durationB = getDuration(b);
+					// Entries without valid dates go to the bottom
+					if (durationA === 0) return 1;
+					if (durationB === 0) return -1;
+					return durationB - durationA;
+				});
+			case "duration-asc":
+				return sorted.sort((a, b) => {
+					const durationA = getDuration(a);
+					const durationB = getDuration(b);
+					// Entries without valid dates go to the bottom
+					if (durationA === 0) return 1;
+					if (durationB === 0) return -1;
+					return durationA - durationB;
+				});
+			default:
+				return sorted;
+		}
+	}
+
+	function getDuration(entry: SnippetMeta): number {
+		if (!entry.dateStarted) return 0;
+
+		if (!entry.dateFinished) {
+			return new Date().getTime() - new Date(entry.dateStarted).getTime();
+		}
+
+		return new Date(entry.dateFinished).getTime() - new Date(entry.dateStarted).getTime();
+	}
+
+	const sortedList = $derived(sortEntries(filteredList, sortBy.length > 0 ? sortBy[0] : "default"));
+
+	const visibleList = $derived(
+		showMoreLimit > 0 && !isExpanded
+			? sortedList.slice(0, showMoreLimit)
+			: sortedList
+	);
+
+	const hasMore = $derived(showMoreLimit > 0 && sortedList.length > showMoreLimit);
 </script>
 
-<div class="mt-8 flex flex-col items-center">
+<div class="flex flex-col items-center entry-group-wrapper">
 	<PinyaCard class="group-header">
-		<h2 class="m-auto">{title}</h2>
+		<div class="header-content">
+			<h2>{title}</h2>
+			<div class="header-controls">
+				{#if showFilter && allTags.length > 0}
+					<TagFilter bind:selectedTags {allTags} />
+				{/if}
+				{#if showSort}
+					<SortDropdown bind:sortBy={sortBy} {sectionType} />
+				{/if}
+			</div>
+		</div>
 	</PinyaCard>
-	<div class="normal-project-container">
-		{#each normalUiList as ui (ui.key)}
-			{@render ui.component(projectComponentProps ?? {})}
-		{/each}
-	</div>
-	<div class="overflow-project-container">
-		{#each overflowUiList as ui (ui.key)}
-			{@render ui.component(projectComponentProps ?? {})}
-		{/each}
-	</div>
+
+	{#if sortedList.length === 0}
+		<div class="no-results">
+			<p>No items match your filter</p>
+		</div>
+	{:else}
+		<div class="normal-project-container">
+			{#each visibleList as ui (ui.key)}
+				{@render ui.component(projectComponentProps ?? {})}
+			{/each}
+		</div>
+
+		{#if hasMore}
+			<button class="show-more-btn" onclick={() => isExpanded = !isExpanded}>
+				{isExpanded ? "Show less" : `Click to see ${sortedList.length - visibleList.length} more...`}
+			</button>
+		{/if}
+	{/if}
 </div>
 
 <style>
+    .header-content {
+        display: flex;
+        flex-direction: column;
+        gap: 1rem;
+        width: 100%;
+    }
+
+    @media (min-width: 768px) {
+        .header-content {
+            flex-direction: row;
+            justify-content: space-between;
+            align-items: center;
+        }
+    }
+
+    .header-controls {
+        display: flex;
+        flex-direction: column;
+        gap: 0.5rem;
+    }
+
+    @media (min-width: 768px) {
+        .header-controls {
+            flex-direction: row;
+            gap: 1rem;
+        }
+    }
+
     .normal-project-container {
         display: flex;
         flex-wrap: wrap;
@@ -49,21 +168,50 @@
         align-items: start;
     }
 
-    .overflow-project-container {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 2rem;
-        margin: auto;
-        /* 2 containers + 1 gap + extra rem */
-        max-width: calc((28rem * 2) + 3rem);
-        justify-content: center;
-        align-items: start;
+    :global {
+        .upper-section-style .normal-project-container > .pinya-four-part-card {
+            max-width: revert;
+            flex-grow: revert;
+            flex-basis: revert;
+        }
+
+        .normal-project-container > .pinya-four-part-card {
+            max-width: 30em;
+            flex-grow: 1;
+            flex-basis: 25em;
+        }
+    }
+
+    .show-more-btn {
+        margin-bottom: 1.5lh;
+        padding: 0.5rem 1rem;
+        border-radius: var(--radius-lg);
+        border: 2px solid var(--color-primary-500);
+        background: transparent;
+        cursor: pointer;
+        transition: background-color 0.2s;
+    }
+
+    .show-more-btn:hover {
+        background: var(--color-primary-100);
+    }
+
+    .no-results {
+        padding: 2rem;
+        text-align: center;
+        color: var(--color-text-secondary);
     }
 
     :global {
         .group-header.pinya-card {
             margin-bottom: calc(var(--spacing) * 8);
             max-width: unset;
+            width: 100%;
         }
     }
+
+    .entry-group-wrapper {
+        max-width: calc((28rem * 3) + 5rem);
+        width: 100%;
+    }
 </style>

package/dist/ui/templates/SeaweedLayout/EntryGroup.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EntryGroup.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/templates/SeaweedLayout/EntryGroup.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,iCAAiC,CAAC;AA4CjF,QAAA,MAAM,UAAU,kDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"EntryGroup.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/ui/templates/SeaweedLayout/EntryGroup.svelte.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,iCAAiC,CAAC;AAwIjF,QAAA,MAAM,UAAU,kDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/ui/templates/SeaweedLayout/ProjectGroupConfig.svelte

@@ -102,7 +102,7 @@
 		};
 	});
 
-	let comboboxValue = $state(comboboxData[0].value);
+	let comboboxValue = $state([comboboxData[0].value]);
 
 	const addEntry = () => {
 		const c = allEntries.find(e => e.key === comboboxValue[0]);
@@ -205,11 +205,9 @@
 				<PinyaCombobox
 					class="project-group-config"
 					data={comboboxData}
-					defaultValue={comboboxValue}
 					bind:value={comboboxValue}
 					label="New entry"
 					placeholder="Add new entry"
-					contentZIndex="10"
 				/>
 			</td>
 		</tr>