Add icons for subjects

src/lib/components/assignment/AssignmentGrid/ReadAssignmentBox.svelte

@@ -4,11 +4,20 @@
 	import { Icon, Clock } from 'svelte-hero-icons';
 	import Store from '../../utils/Store.svelte';
 	import { i } from '$lib/i18n/store';
+	import { getSubjectIcon } from '$lib/utils/icons/subjectIcons';
 
 	export let assignment: Assignment;
+
+	$: icon = getSubjectIcon(assignment.subject)
 </script>
 
-<h3>{assignment.subject}</h3>
+<div class="flex items-center gap-2">
+	{#if icon}
+		<Icon src={icon} class="h-6 w-6" mini />
+	{/if}
+
+	<h3>{assignment.subject}</h3>
+</div>
 
 <p>{assignment.description}</p>
 

src/lib/utils/icons/subjectIcons.ts

@@ -0,0 +1,93 @@
+import {
+	Banknotes,
+	Beaker,
+	Bolt,
+	BugAnt,
+	BuildingLibrary,
+	Calculator,
+	ComputerDesktop,
+	HomeModern,
+	Language,
+	LightBulb,
+	MusicalNote,
+	PaintBrush,
+	type IconSource
+} from 'svelte-hero-icons';
+
+type IconObj = {
+	subjects: string[];
+	icon: IconSource;
+};
+
+const iconObjs: IconObj[] = [
+	{
+		subjects: ['informatik', 'info', 'computer science', 'programming'],
+		icon: ComputerDesktop
+	},
+	{
+		subjects: ['biologie', 'bio', 'biology'],
+		icon: BugAnt
+	},
+	{
+		subjects: ['biologie', 'bio', 'biology'],
+		icon: Beaker
+	},
+	{
+		subjects: ['biologie', 'bio', 'biology'],
+		icon: Beaker
+	},
+	{
+		subjects: [
+			'deutsch',
+			'englisch',
+			'spanisch',
+			'german',
+			'english',
+			'spanish',
+			'latin',
+			'latein',
+			'klingon',
+			'japanese',
+			'japanisch'
+		],
+		icon: Language
+	},
+	{
+		subjects: ['geschichte', 'history'],
+		icon: BuildingLibrary
+	},
+	{
+		subjects: ['art', 'kunst', 'malen', 'drawing', 'draw'],
+		icon: PaintBrush
+	},
+	{
+		subjects: ['mathe', 'mathematik', 'math', 'mathemathics', 'rechnen', 'calculus', 'algebra'],
+		icon: Calculator
+	},
+	{
+		subjects: ['musik', 'music'],
+		icon: MusicalNote
+	},
+	{
+		subjects: ['physik', 'physics'],
+		icon: Bolt
+	},
+	{
+		subjects: ['reli', 'religion'],
+		icon: LightBulb
+	},
+	{
+		subjects: ['sport', 'pe'],
+		icon: HomeModern
+	},
+	{
+		subjects: ['powi', 'politik', 'wirtschaft', 'economy'],
+		icon: Banknotes
+	}
+];
+
+export function getSubjectIcon(subject: string) {
+	const subj = subject.trim().toLowerCase();
+
+	return iconObjs.find(({ subjects }) => subjects.includes(subj))?.icon ?? null;
+}