From fee140d76767641c67fa3845dd96cce5bbff7538 Mon Sep 17 00:00:00 2001
From: root <dominik.geissler@rwth-aachen.de>
Date: Fri, 10 Nov 2023 21:48:39 +0100
Subject: [PATCH 1/4] #91 moved icons to content management plattform

---
 src/lib/BasePage.svelte                  |  2 +-
 src/lib/ChapterList.svelte               |  6 ++--
 src/lib/Footer.svelte                    | 11 ++-----
 src/lib/Nav.svelte                       | 15 +++-------
 src/lib/PlaceSelect.svelte               |  7 ++++-
 src/lib/PostPreview.svelte               | 15 ++++++----
 src/lib/Social.svelte                    |  8 +++--
 src/lib/TagList.svelte                   | 31 ++++---------------
 src/lib/ThemeSwitcher.svelte             | 16 +++++-----
 src/lib/types.ts                         | 35 +++++-----------------
 src/routes/+page.svelte                  | 10 +++----
 src/routes/auszeichnungen/+page.svelte   |  4 +--
 src/routes/blog/+page.svelte             |  3 +-
 src/routes/blog/[slug]/+page.svelte      | 13 ++++----
 src/routes/faq/+page.svelte              | 24 +++++----------
 src/routes/lernmaterial/+page.svelte     | 20 +++++--------
 src/routes/presse/+page.svelte           |  6 ++--
 src/routes/signup-pupil/+page.svelte     |  3 +-
 src/routes/signup-student/+page.svelte   |  3 +-
 src/routes/standorte/[slug]/+page.svelte | 38 +++++++++++++++++-------
 20 files changed, 118 insertions(+), 152 deletions(-)

diff --git a/src/lib/BasePage.svelte b/src/lib/BasePage.svelte
index 29990f8c..93a3a6ba 100644
--- a/src/lib/BasePage.svelte
+++ b/src/lib/BasePage.svelte
@@ -51,7 +51,7 @@
 {#if sys?.publishedAt && !slug.includes(`blog`)}
   <time>
     <Icon
-      icon="ic:update"
+      icon={$microcopy?.icons?.pages?.index?.update}
       width="1.3em"
       style="padding: 0 4pt; vertical-align: middle;"
     />
diff --git a/src/lib/ChapterList.svelte b/src/lib/ChapterList.svelte
index 5cb498e1..8def2fe4 100644
--- a/src/lib/ChapterList.svelte
+++ b/src/lib/ChapterList.svelte
@@ -11,7 +11,7 @@
 </script>
 
 <h1>
-  <Icon icon="ic:place" inline />
+  <Icon icon={$microcopy?.icons?.global?.place} inline />
   {$microcopy?.chapterList?.locations}
 </h1>
 <ol>
@@ -21,7 +21,7 @@
 </ol>
 {#if startingChapters.length > 2}
   <h1>
-    <Icon icon="ic:round-construction" inline />
+    <Icon icon={$microcopy?.icons?.pages?.chapterList?.construction} inline />
     {$microcopy?.chapterList?.inSetup}
   </h1>
   <ol>
@@ -32,7 +32,7 @@
 {/if}
 {#if partnerChapters.length > 2}
   <h1>
-    <Icon icon="ic:place" inline />
+    <Icon icon={$microcopy?.icons?.global?.place} inline />
     {$microcopy?.chapterList?.partner}
   </h1>
   <ol>
diff --git a/src/lib/Footer.svelte b/src/lib/Footer.svelte
index b9b8093b..a664f783 100644
--- a/src/lib/Footer.svelte
+++ b/src/lib/Footer.svelte
@@ -5,12 +5,7 @@
   import { microcopy } from './stores'
   import type { Link } from './types'
 
-  const icon_map: Record<string, string> = {
-    Impressum: `octicon:law`,
-    Datenschutz: `ic:round-privacy-tip`,
-    Spenden: `ic:round-euro`,
-    Satzung: `ion:document-text`,
-  }
+  const icon_map: Record<string, string> = $microcopy?.icons?.pages?.footer
 
   export let links: Link[]
   export let social: Record<keyof typeof icon_map, string>
@@ -30,10 +25,10 @@
   <span>
     {@html $microcopy?.footer?.site}
     <a href={repository}>
-      <Icon inline icon="ri:open-source-fill" style="padding-right: 3pt;" />open source
+      <Icon inline icon={icon_map['opensource']} style="padding-right: 3pt;" />open source
     </a>
     {@html $microcopy?.footer?.uses}
-    <Icon inline icon="bxs:cookie" />
+    <Icon inline icon={icon_map['cookie']} />
     Cookies.
   </span>
   {#if $microcopy?.country == `de`}
diff --git a/src/lib/Nav.svelte b/src/lib/Nav.svelte
index aa8295d1..7fb4b02a 100644
--- a/src/lib/Nav.svelte
+++ b/src/lib/Nav.svelte
@@ -4,19 +4,12 @@
   import Icon from '@iconify/svelte'
   import { slide } from 'svelte/transition'
   import type { NavLink } from './types'
+  import { microcopy } from './stores'
 
   export let nav: NavLink[]
   export let mobile: boolean
 
-  const icon_map: Record<string, string> = {
-    'Über Uns': `ri:plant-fill`,
-    Standorte: `ic:place`,
-    Mitmachen: `ion:people-circle`,
-    Blog: `fa-solid:rss-square`,
-    Kontakt: `ic:round-alternate-email`,
-    Internes: `fa-solid:hands-helping`,
-    Anmeldung: `ic:round-assignment-ind`,
-  }
+  const icon_map: Record<string, string> = $microcopy?.icons?.pages?.nav
 
   let isOpen = false
   let activeSubNav = -1
@@ -64,7 +57,7 @@
     aria-label="Navigationsmenü öffnen"
     style="grid-area: nav;"
   >
-    <Icon icon="heroicons-solid:menu" />
+    <Icon icon={icon_map['menu']} />
   </button>
 {/if}
 
@@ -94,7 +87,7 @@
               on:click={setActiveSubNav(idx, false)}
               aria-label="Untermenü {title} öffnen"
             >
-              <Icon icon="bi:chevron-expand" />
+              <Icon icon={icon_map['expand']} />
             </button>
           {/if}
         </span>
diff --git a/src/lib/PlaceSelect.svelte b/src/lib/PlaceSelect.svelte
index f5d69ff6..a4a90085 100644
--- a/src/lib/PlaceSelect.svelte
+++ b/src/lib/PlaceSelect.svelte
@@ -5,6 +5,7 @@
   import mapbox from 'mapbox-gl'
   import { Geocoder, Map } from '.'
   import type { Place } from './types'
+  import { microcopy } from './stores'
 
   export let value: Place[] = [] // currently selected places
   export let placeholder = ``
@@ -63,7 +64,11 @@
         disabled
       />
       <button on:click={deletePlace(idx)} type="button">
-        <Icon icon="ic:delete" style="width: 3ex;" inline />
+        <Icon
+          icon={$microcopy?.icons?.pages?.placeSelect?.delete}
+          style="width: 3ex;"
+          inline
+        />
       </button>
     </li>
   {/each}
diff --git a/src/lib/PostPreview.svelte b/src/lib/PostPreview.svelte
index 7c54837c..fdf811e3 100644
--- a/src/lib/PostPreview.svelte
+++ b/src/lib/PostPreview.svelte
@@ -2,6 +2,7 @@
   import Icon from '@iconify/svelte'
   import { Img, ToolTip } from '.'
   import type { Post } from './types'
+  import { microcopy } from './stores'
 
   export let post: Post
 
@@ -31,28 +32,32 @@
       <address slot="tip">
         {#if author.url}
           <a href={author.url}>
-            <Icon inline icon="bx:link" {style} />{author.url}
+            <Icon inline icon={$microcopy?.icons?.global?.link} {style} />{author.url}
           </a>
           <br />
         {/if}
         {#if author.email}
           <a href="mailto:{author.email}">
-            <Icon inline icon="ic:email" {style} />
+            <Icon inline icon={$microcopy?.icons?.global?.email} {style} />
             {author.email}
           </a>
           <br />
         {/if}
         {#if author.fieldOfStudy}
-          <Icon inline icon="fa-solid:graduation-cap" {style} />{author.fieldOfStudy}
+          <Icon
+            inline
+            icon={$microcopy?.icons?.global?.graduationCap}
+            {style}
+          />{author.fieldOfStudy}
         {/if}
       </address>
     </ToolTip>
     <span>
-      <Icon inline icon="octicon:calendar" {style} />
+      <Icon inline icon={$microcopy?.icons?.global?.calendar} {style} />
       {new Date(date).toLocaleDateString(`de`)}
     </span>
     <span>
-      <Icon inline icon="fa-solid:tags" {style} />{tags.join(`, `)}
+      <Icon inline icon={$microcopy?.icons?.global?.tags} {style} />{tags.join(`, `)}
     </span>
   </div>
   <p>
diff --git a/src/lib/Social.svelte b/src/lib/Social.svelte
index ff94c15d..61f18afc 100644
--- a/src/lib/Social.svelte
+++ b/src/lib/Social.svelte
@@ -1,17 +1,19 @@
 <script lang="ts">
   import Icon from '@iconify/svelte'
+  import { microcopy } from './stores'
 
   export let social: Record<string, string>
   export let style = ``
   export let vertical = false
   export let fixed = false
-  export let include = [`Facebook`, `Twitter`, `Instagram`, `Youtube`, `Linkedin`]
+  export let social_icons: Record<string, string> =
+    $microcopy?.icons?.global?.socials ?? {}
 </script>
 
 <div {style} class:vertical class:fixed>
-  {#each include as key}
+  {#each Object.entries(social_icons) as [key, value]}
     <a href={social[key]} aria-label={key}>
-      <Icon icon="fa-brands:{key.toLowerCase()}" />
+      <Icon icon={value} />
     </a>
   {/each}
 </div>
diff --git a/src/lib/TagList.svelte b/src/lib/TagList.svelte
index e9f8ce49..08175194 100644
--- a/src/lib/TagList.svelte
+++ b/src/lib/TagList.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
   import Icon from '@iconify/svelte'
   import { fade, slide } from 'svelte/transition'
-  import type { BlogTag, Post } from './types'
+  import { microcopy } from './stores'
 
   export let posts: Post[]
   export let active_tag = `Alle`
@@ -15,28 +15,9 @@
     }
   }
 
-  const tagOccurrences = Object.entries(tagCounter) as [BlogTag, number][]
-
-  const icons: Record<BlogTag, string> = {
-    Alle: `ic:select-all`,
-    Spenden: `ic:round-euro`,
-    Werbung: `ic:public`,
-    Standortleiter: `fa-solid:graduation-cap`,
-    Erfahrungsberichte: `ic:rate-review`,
-    Nachhilfelehrer: `fa-solid:chalkboard-teacher`,
-    Interview: `ic:question-answer`,
-    'Soziale Partner': `fa-solid:handshake`,
-    Events: `ic:event-available`,
-    Freizeit: `ic:beach-access`,
-    IT: `bx:git-branch`,
-    Bundesvorstand: `ion:stats-chart`,
-    Stipendium: `fa-solid:donate`,
-    Mentoring: `fa-solid:chalkboard-teacher`,
-    Auszeichnung: `fa-solid:award`,
-    Sonstiges: `fa6-solid:earth-europe`,
-    Standorte: `fa6-solid:map-location-dot`,
-  }
+  const tagOccurrences = Object.entries(tagCounter) as [string, number][]
 
+  const icons: Record<string, string> = $microcopy?.icons?.tags?.blog
   let open = false
   let viewWidth: number
   const style = `height: 18pt; margin-right: 5pt;`
@@ -45,13 +26,13 @@
 <svelte:window bind:innerWidth={viewWidth} />
 
 <h2>
-  <Icon icon="fa-solid:tags" style="height: 18pt;" />Tags
+  <Icon icon={$microcopy?.icons?.global?.tags} style="height: 18pt;" />Tags
   {#if viewWidth < 750}
     <button on:click={() => (open = !open)} aria-label="Blog Tags öffnen">
       {#if open}
-        <Icon inline icon="ic:round-close" {style} />
+        <Icon inline icon={$microcopy?.icons?.global?.close} {style} />
       {:else}
-        <Icon inline icon="bi:chevron-expand" {style} />
+        <Icon inline icon={$microcopy?.icons?.global?.expand} {style} />
       {/if}
     </button>
   {/if}
diff --git a/src/lib/ThemeSwitcher.svelte b/src/lib/ThemeSwitcher.svelte
index 68599189..39437bae 100644
--- a/src/lib/ThemeSwitcher.svelte
+++ b/src/lib/ThemeSwitcher.svelte
@@ -1,16 +1,18 @@
 <script lang="ts">
   import Icon from '@iconify/svelte'
-  import { colorMode } from './stores'
+  import { colorMode, microcopy } from './stores'
 
   // TODO: i18n the color mode titles
-  const color_mode_icons = {
-    light: [`ic:round-wb-sunny`, `system`],
-    dark: [`octicon:moon-16`, `light`],
-    system: [`bi:laptop`, `dark`],
+  const next_color_mode = {
+    light: 'system',
+    dark: 'light',
+    system: 'dark',
   } as const
 
+  const color_mode_icons = $microcopy?.icons?.global?.theme
+
   function set_color_mode() {
-    const next = color_mode_icons[$colorMode][1]
+    const next = next_color_mode[$colorMode]
     $colorMode = next
   }
 </script>
@@ -20,5 +22,5 @@
   on:click={set_color_mode}
   style="display: flex; color: white;"
 >
-  <Icon icon={color_mode_icons[$colorMode][0]} title={$colorMode} />
+  <Icon icon={color_mode_icons[$colorMode]} title={$colorMode} />
 </button>
diff --git a/src/lib/types.ts b/src/lib/types.ts
index dcb1e186..97f1ea98 100644
--- a/src/lib/types.ts
+++ b/src/lib/types.ts
@@ -43,32 +43,11 @@ export type Author = {
   fieldOfStudy: string
 }
 
-export const BlogTags = [
-  `Alle`,
-  `Bundesvorstand`,
-  `Erfahrungsberichte`,
-  `Events`,
-  `Freizeit`,
-  `Interview`,
-  `IT`,
-  `Nachhilfelehrer`,
-  `Sonstiges`,
-  `Soziale Partner`,
-  `Spenden`,
-  `Standorte`,
-  `Standortleiter`,
-  `Stipendium`,
-  `Werbung`,
-  `Mentoring`,
-  `Auszeichnung`,
-] as const // use const assertion to turn BlogTags into readonly tuple
-
-export type BlogTag = (typeof BlogTags)[number]
 
 export type Post = Page & {
   author: Author
   date: Date
-  tags: BlogTag[]
+  tags: string[]
   plainBody: string
 }
 
@@ -83,12 +62,12 @@ export type Image = {
 
 export type Yaml = {
   [key: string]:
-    | string
-    | number
-    | Date
-    | boolean
-    | (string | number | Date | boolean)[]
-    | Yaml
+  | string
+  | number
+  | Date
+  | boolean
+  | (string | number | Date | boolean)[]
+  | Yaml
 }
 
 export type PressItem = {
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 71565517..de576eeb 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -36,35 +36,35 @@
   <div style="background: var(--light-blue);">
     <span>{data.chapters.filter((ch) => ch.acceptsSignups).length}</span>
     <strong>
-      <Icon inline icon="ic:place" {style} />
+      <Icon inline icon={$microcopy?.icons?.global?.place} {style} />
       {$microcopy?.indexPage?.boxes?.locationsName}</strong
     >
   </div>
   <div style="background: var(--green);">
     <span>{$microcopy?.indexPage?.boxes?.studentsNumber}</span>
     <strong>
-      <Icon inline icon="fa-solid:user-graduate" {style} />
+      <Icon inline icon={$microcopy?.icons?.global?.graduate} {style} />
       {$microcopy?.indexPage?.boxes?.studentsName}</strong
     >
   </div>
   <div style="background: var(--orange);">
     <span>{$microcopy?.indexPage?.boxes.pupilsNumber}</span>
     <strong>
-      <Icon inline icon="fa-solid:child" {style} />
+      <Icon inline icon={$microcopy?.icons?.global?.child} {style} />
       {$microcopy?.indexPage?.boxes?.pupilsName}</strong
     >
   </div>
   <div style="background: var(--green);">
     <span>{$microcopy?.indexPage?.boxes?.scholarshipNumber}</span>
     <strong>
-      <Icon inline icon="fa-solid:user-graduate" {style} />
+      <Icon inline icon={$microcopy?.icons?.global?.graduate} {style} />
       {@html $microcopy?.indexPage?.boxes?.scholarshipName}
     </strong>
   </div>
   <div style="background: var(--light-blue);">
     <span>{$microcopy?.indexPage?.boxes?.organizationMemberNumber}</span>
     <strong>
-      <Icon inline icon="fa6-solid:user-group" {style} />
+      <Icon inline icon={$microcopy?.icons?.global?.group} {style} />
       {@html $microcopy?.indexPage?.boxes?.organizationMemberName}
     </strong>
   </div>
diff --git a/src/routes/auszeichnungen/+page.svelte b/src/routes/auszeichnungen/+page.svelte
index 098c1e6d..739c0d1c 100644
--- a/src/routes/auszeichnungen/+page.svelte
+++ b/src/routes/auszeichnungen/+page.svelte
@@ -22,11 +22,11 @@
         <h3 {id}><a href={url}>{title}</a></h3>
         <div>
           <span>
-            <Icon inline icon="octicon:calendar" {style} />
+            <Icon inline icon={$microcopy?.icons?.global?.calendar} {style} />
             {date}
           </span>
           <span>
-            <Icon inline icon="fa-solid:award" {style} />
+            <Icon inline icon={$microcopy?.icons?.global?.award} {style} />
             {prize}
           </span>
         </div>
diff --git a/src/routes/blog/+page.svelte b/src/routes/blog/+page.svelte
index 3d8ad068..297713da 100644
--- a/src/routes/blog/+page.svelte
+++ b/src/routes/blog/+page.svelte
@@ -1,12 +1,11 @@
 <script lang="ts">
   import { PostPreview, Social, TagList } from '$lib'
-  import type { BlogTag } from '$lib/types'
   import { flip } from 'svelte/animate'
   import { scale } from 'svelte/transition'
 
   export let data
 
-  let active_tag: BlogTag
+  let active_tag: string
 
   $: filtered_posts = data.posts.filter(
     (post) => active_tag === `Alle` || post.tags.includes(active_tag)
diff --git a/src/routes/blog/[slug]/+page.svelte b/src/routes/blog/[slug]/+page.svelte
index 9cb2e189..ce98089b 100644
--- a/src/routes/blog/[slug]/+page.svelte
+++ b/src/routes/blog/[slug]/+page.svelte
@@ -2,6 +2,7 @@
   import { Img, ToolTip } from '$lib'
   import Icon from '@iconify/svelte'
   import { onMount } from 'svelte'
+  import { microcopy } from '$root/src/lib/stores.js'
 
   export let data
   let n_readers = 0
@@ -43,30 +44,30 @@
       von
       {#if bio || fieldOfStudy}
         <ToolTip minWidth="18em">
-          <Icon inline icon="bi:person-circle" {style} />
+          <Icon inline icon={$microcopy?.icons?.pages?.article?.person} {style} />
           <strong>{name}</strong>
           <span slot="tip">
-            <Icon inline icon="ic:round-history-edu" {style} />
+            <Icon inline icon={$microcopy?.icons?.pages?.article?.history} {style} />
             Bio:
             {bio}
             {#if fieldOfStudy}
               <br />
-              <Icon inline icon="fa-solid:graduation-cap" {style} />
+              <Icon inline icon={$microcopy?.icons?.global?.graduationCap} {style} />
               Studiert:
               {fieldOfStudy}
             {/if}
           </span>
         </ToolTip>
       {:else}
-        <Icon inline icon="bi:person-circle" {style} />
+        <Icon inline icon={$microcopy?.icons?.pages?.article?.person} {style} />
         <strong>{name}</strong>
       {/if}
       am
-      <Icon inline icon="octicon:calendar" {style} />
+      <Icon inline icon={$microcopy?.icons?.global?.calendar} {style} />
       <strong>{new Date(date).toLocaleDateString(`de`)}</strong>
     </span>
     <span>
-      <Icon icon="ic:round-remove-red-eye" />
+      <Icon icon={$microcopy?.icons?.pages?.blog?.eye} />
       {n_readers}
     </span>
   </section>
diff --git a/src/routes/faq/+page.svelte b/src/routes/faq/+page.svelte
index f1073ac2..077b9c27 100644
--- a/src/routes/faq/+page.svelte
+++ b/src/routes/faq/+page.svelte
@@ -3,26 +3,14 @@
   import Icon from '@iconify/svelte'
   import { flip } from 'svelte/animate'
   import { scale } from 'svelte/transition'
+  import { microcopy } from '$root/src/lib/stores.js'
 
   export let data
 
-  const icons: Record<string, string> = {
-    'Rund ums Engagement': `fa-solid:hands-helping`,
-    Nachhilfe: `fa-solid:chalkboard-teacher`,
-    Vermittlung: `ic:round-support-agent`,
-    Alle: `ic:select-all`,
-    Rahmenbedingungen: `ic:filter-frames`,
-    Vereinsaustritt: `ic:exit-to-app`,
-    Sonstiges: `ic:round-miscellaneous-services`,
-    Datenschutz: `ic:round-privacy-tip`,
-    'Tipps für Standorte': `ic:round-storefront`,
-    Versicherung: `map:insurance-agency`,
-    Mitgliederversammlung: `ic:round-group`,
-    Führungszeugnis: `ic:round-assignment-ind`,
-  }
+  const icons: Record<string, string> = $microcopy?.icons?.tags?.faq
 
   let active_tag = `Alle`
-  const email = `info@studenten-bilden-schueler.de`
+  const email = `info@${$microcopy?.location?.url}`
   let hash = typeof window !== `undefined` ? window.location.hash.slice(1) : ``
 
   $: filteredFaqs = data.faqs.filter(
@@ -59,7 +47,11 @@
       <Collapsible {id} active={id === hash}>
         <span slot="title">
           {title}
-          <Icon icon="fa-solid:tags" width="16pt" style="margin: 0 3pt 0 10pt;" />
+          <Icon
+            icon={$microcopy?.icons?.global?.tags}
+            width="16pt"
+            style="margin: 0 3pt 0 10pt;"
+          />
           <small>{tags.join(`, `)}</small>
         </span>
         {@html body}
diff --git a/src/routes/lernmaterial/+page.svelte b/src/routes/lernmaterial/+page.svelte
index 3c21c0fc..4316b885 100644
--- a/src/routes/lernmaterial/+page.svelte
+++ b/src/routes/lernmaterial/+page.svelte
@@ -3,23 +3,14 @@
   import Icon from '@iconify/svelte'
   import { flip } from 'svelte/animate'
   import { scale } from 'svelte/transition'
+  import { microcopy } from '$root/src/lib/stores.js'
 
   export let data
 
-  const icon_map: Record<string, string> = {
-    Alle: `ic:select-all`,
-    Mathe: `ic:functions`,
-    Wissenschaft: `ic:round-science`,
-    'Lernen mit Karteikarten': `bi:card-text`,
-    'Viele Fächer': `ic:group-work`,
-    'Deutsche Sprache': `ic:language`,
-    Englisch: `fa-brands:erlang`,
-    Deutschunterricht: `simple-icons:disqus`,
-    Physik: `simple-icons:atom`,
-  }
+  const icon_map: Record<string, string> = $microcopy?.icons?.tags?.faq
 
   let active_tag = `Alle`
-  const email = `it@studenten-bilden-schueler.de`
+  const email = `it@${$microcopy?.location?.url}`
   let hash: string
 
   $: filtered = data.studyPlatforms?.filter(
@@ -68,7 +59,10 @@
           <h3 {id} active={id === hash}>
             <a href={url}>{title}</a>
           </h3>
-          <span><Icon icon="fa-solid:tags" inline /> {tags.join(`, `)}</span>
+          <span
+            ><Icon icon={$microcopy?.icons?.global?.tags} inline />
+            {tags.join(`, `)}</span
+          >
           {@html body}
         </li>
       {/each}
diff --git a/src/routes/presse/+page.svelte b/src/routes/presse/+page.svelte
index a19ae109..e5042b15 100644
--- a/src/routes/presse/+page.svelte
+++ b/src/routes/presse/+page.svelte
@@ -27,15 +27,15 @@
             </h3>
             <div>
               <span>
-                <Icon inline icon="ion:newspaper" {style} />
+                <Icon inline icon={$microcopy?.icons?.global?.newspaper} {style} />
                 {source}
               </span>
               <span>
-                <Icon inline icon="octicon:calendar" {style} />
+                <Icon inline icon={$microcopy?.icons?.global?.calendar} {style} />
                 {new Date(date).toLocaleDateString(`de`)}
               </span>
               <span>
-                <Icon inline icon="ic:place" {style} />
+                <Icon inline icon={$microcopy?.icons?.global?.place} {style} />
                 Standort {chapter}
               </span>
             </div>
diff --git a/src/routes/signup-pupil/+page.svelte b/src/routes/signup-pupil/+page.svelte
index beb03589..2b6990ca 100644
--- a/src/routes/signup-pupil/+page.svelte
+++ b/src/routes/signup-pupil/+page.svelte
@@ -4,6 +4,7 @@
   import { signup_form_submit_handler } from '$lib/azure'
   import { signupStore } from '$lib/stores'
   import Icon from '@iconify/svelte'
+  import { microcopy } from '$lib/stores'
 
   export let data
   $: ({ chapters, form } = data)
@@ -42,7 +43,7 @@
     <!-- Prevent implicit submission of the form https://stackoverflow.com/a/51507806 -->
     <button type="submit" disabled style="display: none" aria-hidden="true" />
     <h1>
-      <Icon icon="ri:plant-fill" inline />
+      <Icon icon={$microcopy?.icons?.global?.plant} inline />
 
       {@html form.header.title}
     </h1>
diff --git a/src/routes/signup-student/+page.svelte b/src/routes/signup-student/+page.svelte
index c1559124..0f2357d8 100644
--- a/src/routes/signup-student/+page.svelte
+++ b/src/routes/signup-student/+page.svelte
@@ -3,6 +3,7 @@
   import { signup_form_submit_handler } from '$lib/azure'
   import { signupStore } from '$lib/stores'
   import Icon from '@iconify/svelte'
+  import { microcopy } from '$lib/stores'
 
   export let data
   $: ({ chapters, form } = data)
@@ -42,7 +43,7 @@
     <!-- Prevent implicit submission of the form https://stackoverflow.com/a/51507806 -->
     <button type="submit" disabled style="display: none" aria-hidden="true" />
     <h1>
-      <Icon icon="ri:plant-fill" inline />
+      <Icon icon={$microcopy?.icons?.global?.plant} inline />
       {@html form.header.title}
     </h1>
 
diff --git a/src/routes/standorte/[slug]/+page.svelte b/src/routes/standorte/[slug]/+page.svelte
index ce2580b0..19bd395e 100644
--- a/src/routes/standorte/[slug]/+page.svelte
+++ b/src/routes/standorte/[slug]/+page.svelte
@@ -18,13 +18,16 @@
       <span>
         {$microcopy?.location?.joinStudent}
         <a href="/signup-student?chapter={page.title}" class="btn blue">
-          <Icon inline icon="fa-solid:graduation-cap" {style} />{$microcopy?.location
-            ?.registerStudent}
+          <Icon
+            inline
+            icon={$microcopy?.icons?.global?.graduationCap}
+            {style}
+          />{$microcopy?.location?.registerStudent}
         </a>
         <a href={$microcopy?.location?.linkStudentInfo} class="btn blue stroke">
           <Icon
             inline
-            icon="bi:info-circle-fill"
+            icon={$microcopy?.icons?.global?.information}
             style={style + `margin-right: 6pt;`}
           />{$microcopy?.location?.infoStudentButton}
         </a>
@@ -32,13 +35,13 @@
       <span>
         {$microcopy?.location?.joinPupil}
         <a href="/signup-pupil?chapter={page.title}" class="btn green">
-          <Icon inline icon="fa-solid:child" {style} />{$microcopy?.location
-            ?.registerPupil}
+          <Icon inline icon={$microcopy?.icons?.global?.child} {style} />{$microcopy
+            ?.location?.registerPupil}
         </a>
         <a href={$microcopy?.location?.linkPupilInfo} class="btn green stroke">
           <Icon
             inline
-            icon="bi:info-circle-fill"
+            icon={$microcopy?.icons?.global?.information}
             style={style + `margin-right: 6pt;`}
           />{$microcopy?.location?.infoPupilButton}</a
         >
@@ -46,12 +49,13 @@
       <span>
         {$microcopy?.location?.locationManagement}
         <a href="mailto:info.{slug}{$microcopy?.location?.mailTo}" class="btn orange">
-          <Icon inline icon="ic:email" {style} />{$microcopy?.location?.writeMailButton}
+          <Icon inline icon={$microcopy?.icons?.global?.email} {style} />{$microcopy
+            ?.location?.writeMailButton}
         </a>
         <a href={$microcopy?.location?.linkLeadingInfo} class="btn orange stroke">
           <Icon
             inline
-            icon="bi:info-circle-fill"
+            icon={$microcopy?.icons?.global?.information}
             style={style + `margin-right: 6pt;`}
           />{$microcopy?.location?.infoLeadingButton}</a
         >
@@ -71,7 +75,11 @@
             title="{$microcopy?.location?.student}.{slug}@{$microcopy?.location?.url}"
             class="btn blue"
           >
-            <Icon icon="ic:email" inline style="margin: 0 3pt 0 0;" />
+            <Icon
+              icon={$microcopy?.icons?.global?.email}
+              inline
+              style="margin: 0 3pt 0 0;"
+            />
             {$microcopy?.location?.student}.{slug}@{$microcopy?.location?.url}
           </a>
           {$microcopy?.location?.forStudents}
@@ -82,7 +90,11 @@
             title="{$microcopy?.location?.pupil}.{slug}@{$microcopy?.location?.url}"
             class="btn green"
           >
-            <Icon icon="ic:email" inline style="margin: 0 3pt 0 0;" />
+            <Icon
+              icon={$microcopy?.icons?.global?.email}
+              inline
+              style="margin: 0 3pt 0 0;"
+            />
             {$microcopy?.location?.pupil}.{slug}@{$microcopy?.location?.url}
           </a>
           {$microcopy?.location?.forPartner}
@@ -93,7 +105,11 @@
             title="{$microcopy?.location?.info}.{slug}@{$microcopy?.location?.url}"
             class="btn orange"
           >
-            <Icon icon="ic:email" inline style="margin: 0 3pt 0 0;" />
+            <Icon
+              icon$microcopy?.icons?.global?.email
+              inline
+              style="margin: 0 3pt 0 0;"
+            />
             {$microcopy?.location?.info}.{slug}@{$microcopy?.location?.url}
           </a>
           {$microcopy?.location?.generalRequests}

From 3d4e5c9f9702a110d769d11a377f02bf88cf39b6 Mon Sep 17 00:00:00 2001
From: "pre-commit-ci[bot]"
 <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Date: Fri, 10 Nov 2023 20:51:52 +0000
Subject: [PATCH 2/4] [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci
---
 src/lib/Footer.svelte        |  4 ++--
 src/lib/Nav.svelte           |  4 ++--
 src/lib/ThemeSwitcher.svelte |  6 +++---
 src/lib/types.ts             | 13 ++++++-------
 src/utils/marked.ts          |  2 +-
 5 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/src/lib/Footer.svelte b/src/lib/Footer.svelte
index a664f783..bbf4ca11 100644
--- a/src/lib/Footer.svelte
+++ b/src/lib/Footer.svelte
@@ -25,10 +25,10 @@
   <span>
     {@html $microcopy?.footer?.site}
     <a href={repository}>
-      <Icon inline icon={icon_map['opensource']} style="padding-right: 3pt;" />open source
+      <Icon inline icon={icon_map[`opensource`]} style="padding-right: 3pt;" />open source
     </a>
     {@html $microcopy?.footer?.uses}
-    <Icon inline icon={icon_map['cookie']} />
+    <Icon inline icon={icon_map[`cookie`]} />
     Cookies.
   </span>
   {#if $microcopy?.country == `de`}
diff --git a/src/lib/Nav.svelte b/src/lib/Nav.svelte
index 7fb4b02a..6ba3d89c 100644
--- a/src/lib/Nav.svelte
+++ b/src/lib/Nav.svelte
@@ -57,7 +57,7 @@
     aria-label="Navigationsmenü öffnen"
     style="grid-area: nav;"
   >
-    <Icon icon={icon_map['menu']} />
+    <Icon icon={icon_map[`menu`]} />
   </button>
 {/if}
 
@@ -87,7 +87,7 @@
               on:click={setActiveSubNav(idx, false)}
               aria-label="Untermenü {title} öffnen"
             >
-              <Icon icon={icon_map['expand']} />
+              <Icon icon={icon_map[`expand`]} />
             </button>
           {/if}
         </span>
diff --git a/src/lib/ThemeSwitcher.svelte b/src/lib/ThemeSwitcher.svelte
index 39437bae..2b02dddb 100644
--- a/src/lib/ThemeSwitcher.svelte
+++ b/src/lib/ThemeSwitcher.svelte
@@ -4,9 +4,9 @@
 
   // TODO: i18n the color mode titles
   const next_color_mode = {
-    light: 'system',
-    dark: 'light',
-    system: 'dark',
+    light: `system`,
+    dark: `light`,
+    system: `dark`,
   } as const
 
   const color_mode_icons = $microcopy?.icons?.global?.theme
diff --git a/src/lib/types.ts b/src/lib/types.ts
index 97f1ea98..bf3fdb9c 100644
--- a/src/lib/types.ts
+++ b/src/lib/types.ts
@@ -43,7 +43,6 @@ export type Author = {
   fieldOfStudy: string
 }
 
-
 export type Post = Page & {
   author: Author
   date: Date
@@ -62,12 +61,12 @@ export type Image = {
 
 export type Yaml = {
   [key: string]:
-  | string
-  | number
-  | Date
-  | boolean
-  | (string | number | Date | boolean)[]
-  | Yaml
+    | string
+    | number
+    | Date
+    | boolean
+    | (string | number | Date | boolean)[]
+    | Yaml
 }
 
 export type PressItem = {
diff --git a/src/utils/marked.ts b/src/utils/marked.ts
index 744ec7c9..641e79e1 100644
--- a/src/utils/marked.ts
+++ b/src/utils/marked.ts
@@ -74,7 +74,7 @@ const renderer = {
 marked.use({
   renderer,
   mangle: false,
-  headerIds: false
+  headerIds: false,
 })
 
 export default marked

From 6f611ed1d48a53f97442be2c76f4ed347aeb1213 Mon Sep 17 00:00:00 2001
From: root <dominik.geissler@rwth-aachen.de>
Date: Sat, 11 Nov 2023 15:32:48 +0100
Subject: [PATCH 3/4] Import statements

---
 src/routes/auszeichnungen/+page.svelte | 1 +
 src/routes/presse/+page.svelte         | 1 +
 2 files changed, 2 insertions(+)

diff --git a/src/routes/auszeichnungen/+page.svelte b/src/routes/auszeichnungen/+page.svelte
index 739c0d1c..bb7d64e6 100644
--- a/src/routes/auszeichnungen/+page.svelte
+++ b/src/routes/auszeichnungen/+page.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
   import { BasePage, Img } from '$lib'
   import Icon from '@iconify/svelte'
+  import { microcopy } from '$root/src/lib/stores.js'
 
   export let data
 
diff --git a/src/routes/presse/+page.svelte b/src/routes/presse/+page.svelte
index e5042b15..f300bbf7 100644
--- a/src/routes/presse/+page.svelte
+++ b/src/routes/presse/+page.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
   import { BasePage, Img } from '$lib'
   import Icon from '@iconify/svelte'
+  import { microcopy } from '$root/src/lib/stores.js'
 
   export let data
 

From aac33606fdd4453a11f28efb131416ae72baf182 Mon Sep 17 00:00:00 2001
From: root <dominik.geissler@rwth-aachen.de>
Date: Sat, 11 Nov 2023 15:35:43 +0100
Subject: [PATCH 4/4] Added null checks

---
 src/lib/Footer.svelte                | 2 +-
 src/lib/Map.svelte                   | 1 +
 src/lib/Nav.svelte                   | 2 +-
 src/lib/TagList.svelte               | 2 +-
 src/lib/ThemeSwitcher.svelte         | 2 +-
 src/routes/faq/+page.svelte          | 2 +-
 src/routes/lernmaterial/+page.svelte | 2 +-
 7 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/lib/Footer.svelte b/src/lib/Footer.svelte
index bbf4ca11..1dee3e35 100644
--- a/src/lib/Footer.svelte
+++ b/src/lib/Footer.svelte
@@ -5,7 +5,7 @@
   import { microcopy } from './stores'
   import type { Link } from './types'
 
-  const icon_map: Record<string, string> = $microcopy?.icons?.pages?.footer
+  const icon_map: Record<string, string> = $microcopy?.icons?.pages?.footer ?? []
 
   export let links: Link[]
   export let social: Record<keyof typeof icon_map, string>
diff --git a/src/lib/Map.svelte b/src/lib/Map.svelte
index cd88a46b..dfddb0ac 100644
--- a/src/lib/Map.svelte
+++ b/src/lib/Map.svelte
@@ -8,6 +8,7 @@
 
   export let map: mapboxgl.Map | null = null
   export let markers: MapMarker[] = []
+  // Default values are the german options
   export const { lng, lat, zoom, minZoom, maxZoom } = $microcopy?.map?.location ?? [
     10, 51.3, 5.05, 4, 10,
   ]
diff --git a/src/lib/Nav.svelte b/src/lib/Nav.svelte
index 6ba3d89c..e1441fd2 100644
--- a/src/lib/Nav.svelte
+++ b/src/lib/Nav.svelte
@@ -9,7 +9,7 @@
   export let nav: NavLink[]
   export let mobile: boolean
 
-  const icon_map: Record<string, string> = $microcopy?.icons?.pages?.nav
+  const icon_map: Record<string, string> = $microcopy?.icons?.pages?.nav ?? {}
 
   let isOpen = false
   let activeSubNav = -1
diff --git a/src/lib/TagList.svelte b/src/lib/TagList.svelte
index 08175194..7ea917c9 100644
--- a/src/lib/TagList.svelte
+++ b/src/lib/TagList.svelte
@@ -17,7 +17,7 @@
 
   const tagOccurrences = Object.entries(tagCounter) as [string, number][]
 
-  const icons: Record<string, string> = $microcopy?.icons?.tags?.blog
+  const icons: Record<string, string> = $microcopy?.icons?.tags?.blog ?? {}
   let open = false
   let viewWidth: number
   const style = `height: 18pt; margin-right: 5pt;`
diff --git a/src/lib/ThemeSwitcher.svelte b/src/lib/ThemeSwitcher.svelte
index 2b02dddb..029c23a6 100644
--- a/src/lib/ThemeSwitcher.svelte
+++ b/src/lib/ThemeSwitcher.svelte
@@ -9,7 +9,7 @@
     system: `dark`,
   } as const
 
-  const color_mode_icons = $microcopy?.icons?.global?.theme
+  const color_mode_icons = $microcopy?.icons?.global?.theme ?? {}
 
   function set_color_mode() {
     const next = next_color_mode[$colorMode]
diff --git a/src/routes/faq/+page.svelte b/src/routes/faq/+page.svelte
index 077b9c27..43011a11 100644
--- a/src/routes/faq/+page.svelte
+++ b/src/routes/faq/+page.svelte
@@ -7,7 +7,7 @@
 
   export let data
 
-  const icons: Record<string, string> = $microcopy?.icons?.tags?.faq
+  const icons: Record<string, string> = $microcopy?.icons?.tags?.faq ?? {}
 
   let active_tag = `Alle`
   const email = `info@${$microcopy?.location?.url}`
diff --git a/src/routes/lernmaterial/+page.svelte b/src/routes/lernmaterial/+page.svelte
index 4316b885..91e36331 100644
--- a/src/routes/lernmaterial/+page.svelte
+++ b/src/routes/lernmaterial/+page.svelte
@@ -7,7 +7,7 @@
 
   export let data
 
-  const icon_map: Record<string, string> = $microcopy?.icons?.tags?.faq
+  const icon_map: Record<string, string> = $microcopy?.icons?.tags?.faq ?? {}
 
   let active_tag = `Alle`
   const email = `it@${$microcopy?.location?.url}`