wip: making themes more dynamic and easy to add

src/lib/components/themes/ThemeCard.svelte

@@ -1,23 +1,23 @@
 <script lang="ts">
 	import CardPattern from './svgs/CardPattern.svelte';
-	import { getTheme, getThemeColor } from '$lib/utils/themes';
+	import { getTheme } from '$lib/utils/themes';
+
+	const patternOpacity = 0.1;
 
 	let {
 		themeName,
 		color
 	}: {
-		themeName?: string | null;
-		color?: string | null;
+		themeName?: string;
+		color?: string;
 	} = $props();
 
 	const theme = $derived(getTheme(themeName));
-	const themeColor = $derived(getThemeColor(color));
 </script>
 
 {#if theme.pattern !== 'none'}
 	<CardPattern
 		pattern={theme.pattern}
-		color={themeColor}
-		opacity={theme.opacity}
+		opacity={patternOpacity}
 	/>
 {/if}