From b7e39b59fd0fc7b5610ebff29035bf622079e0d8 Mon Sep 17 00:00:00 2001
From: ivarlovlie <git@ivarlovlie.no>
Date: Wed, 5 Oct 2022 20:45:21 +0800
Subject: refactor: Change file structure

---
 old-apps/web-shared/src/components/alert.svelte    | 121 -------
 .../src/components/blowout-toolbelt.svelte         |  70 ----
 .../src/components/breadcrumb/bread.svelte         |   9 -
 .../src/components/breadcrumb/crumb.svelte         |  27 --
 .../web-shared/src/components/breadcrumb/index.ts  |   7 -
 old-apps/web-shared/src/components/button.svelte   | 116 ------
 old-apps/web-shared/src/components/chip.svelte     |  50 ---
 old-apps/web-shared/src/components/details.svelte  |  35 --
 old-apps/web-shared/src/components/dropdown.svelte | 389 ---------------------
 old-apps/web-shared/src/components/form/index.ts   |   5 -
 .../web-shared/src/components/form/textarea.svelte |  48 ---
 old-apps/web-shared/src/components/icon.svelte     |  87 -----
 .../web-shared/src/components/link-card.svelte     |  47 ---
 .../src/components/locale-switcher-icon.svelte     |  16 -
 .../src/components/locale-switcher.svelte          |  62 ----
 old-apps/web-shared/src/components/menu/index.ts   |   9 -
 .../web-shared/src/components/menu/item.svelte     |   8 -
 .../web-shared/src/components/menu/menu.svelte     |  54 ---
 .../src/components/menu/separator.svelte           |   2 -
 old-apps/web-shared/src/components/modal.svelte    |  66 ----
 .../web-shared/src/components/pre-header.svelte    |  37 --
 .../components/screens/GeneralErrorScreen.svelte   |   7 -
 .../src/components/screens/NotFoundScreen.svelte   | 161 ---------
 .../web-shared/src/components/stopwatch.svelte     | 196 -----------
 old-apps/web-shared/src/components/table/index.ts  |  15 -
 .../src/components/table/paginator.svelte          | 101 ------
 .../web-shared/src/components/table/table.svelte   |   3 -
 .../web-shared/src/components/table/tbody.svelte   |   3 -
 .../web-shared/src/components/table/tcell.svelte   |  23 --
 .../web-shared/src/components/table/thead.svelte   |  10 -
 .../web-shared/src/components/table/trow.svelte    |   6 -
 .../src/components/theme-switcher-icon.svelte      | 248 -------------
 .../src/components/theme-switcher.svelte           | 215 ------------
 old-apps/web-shared/src/components/tile.svelte     |   4 -
 .../web-shared/src/components/user-menu.svelte     |  99 ------
 35 files changed, 2356 deletions(-)
 delete mode 100644 old-apps/web-shared/src/components/alert.svelte
 delete mode 100644 old-apps/web-shared/src/components/blowout-toolbelt.svelte
 delete mode 100644 old-apps/web-shared/src/components/breadcrumb/bread.svelte
 delete mode 100644 old-apps/web-shared/src/components/breadcrumb/crumb.svelte
 delete mode 100644 old-apps/web-shared/src/components/breadcrumb/index.ts
 delete mode 100644 old-apps/web-shared/src/components/button.svelte
 delete mode 100644 old-apps/web-shared/src/components/chip.svelte
 delete mode 100644 old-apps/web-shared/src/components/details.svelte
 delete mode 100644 old-apps/web-shared/src/components/dropdown.svelte
 delete mode 100644 old-apps/web-shared/src/components/form/index.ts
 delete mode 100644 old-apps/web-shared/src/components/form/textarea.svelte
 delete mode 100644 old-apps/web-shared/src/components/icon.svelte
 delete mode 100644 old-apps/web-shared/src/components/link-card.svelte
 delete mode 100644 old-apps/web-shared/src/components/locale-switcher-icon.svelte
 delete mode 100644 old-apps/web-shared/src/components/locale-switcher.svelte
 delete mode 100644 old-apps/web-shared/src/components/menu/index.ts
 delete mode 100644 old-apps/web-shared/src/components/menu/item.svelte
 delete mode 100644 old-apps/web-shared/src/components/menu/menu.svelte
 delete mode 100644 old-apps/web-shared/src/components/menu/separator.svelte
 delete mode 100644 old-apps/web-shared/src/components/modal.svelte
 delete mode 100644 old-apps/web-shared/src/components/pre-header.svelte
 delete mode 100644 old-apps/web-shared/src/components/screens/GeneralErrorScreen.svelte
 delete mode 100644 old-apps/web-shared/src/components/screens/NotFoundScreen.svelte
 delete mode 100644 old-apps/web-shared/src/components/stopwatch.svelte
 delete mode 100644 old-apps/web-shared/src/components/table/index.ts
 delete mode 100644 old-apps/web-shared/src/components/table/paginator.svelte
 delete mode 100644 old-apps/web-shared/src/components/table/table.svelte
 delete mode 100644 old-apps/web-shared/src/components/table/tbody.svelte
 delete mode 100644 old-apps/web-shared/src/components/table/tcell.svelte
 delete mode 100644 old-apps/web-shared/src/components/table/thead.svelte
 delete mode 100644 old-apps/web-shared/src/components/table/trow.svelte
 delete mode 100644 old-apps/web-shared/src/components/theme-switcher-icon.svelte
 delete mode 100644 old-apps/web-shared/src/components/theme-switcher.svelte
 delete mode 100644 old-apps/web-shared/src/components/tile.svelte
 delete mode 100644 old-apps/web-shared/src/components/user-menu.svelte

(limited to 'old-apps/web-shared/src/components')

diff --git a/old-apps/web-shared/src/components/alert.svelte b/old-apps/web-shared/src/components/alert.svelte
deleted file mode 100644
index 4119edf..0000000
--- a/old-apps/web-shared/src/components/alert.svelte
+++ /dev/null
@@ -1,121 +0,0 @@
-<script lang="ts">
-    import {random_string} from "$shared/lib/helpers";
-    import {afterUpdate, onMount} from "svelte";
-    import {Temporal} from "@js-temporal/polyfill";
-
-    const noCooldownSetting = "no-cooldown";
-    // if no unique id is supplied, cooldown will not work between page loads. 
-    // Therefore we are disabling it with noCooldownSetting in the fallback id.  
-    export let id = "alert--" + noCooldownSetting + "--" + random_string(4);
-    export let title = "";
-    export let message = "";
-    export let type = "info";
-    export let closeable = false;
-    export let closeableCooldown = "-1";
-    export let visible = true;
-
-    const cooldownStorageKey = "lastseen--" + id;
-    $: cooldownEnabled = id.indexOf(noCooldownSetting) === -1 && closeable && (closeableCooldown === "~" || parseInt(closeableCooldown) > 0);
-
-    function close() {
-        visible = false;
-        if (cooldownEnabled) {
-            console.log("Cooldown enabled for " + id + ", " + closeableCooldown === "~" ? "with an endless cooldown" : "");
-            localStorage.setItem(cooldownStorageKey, String(Temporal.Now.instant().epochSeconds));
-        }
-    }
-
-    // Manages the state of the alert if cooldown is enabled
-    function run_cooldown() {
-        if (!cooldownEnabled) {
-            console.log("Alert cooldown is not enabled for " + id);
-            return;
-        }
-        if (!localStorage.getItem(cooldownStorageKey)) {
-            console.log("Alert " + id + " has not been seen yet, displaying");
-            visible = true;
-            return;
-        }
-        if (!visible) {
-            console.log("Alert " + id + " is not visible, stopping cooldown change")
-            return;
-        }
-        if (closeableCooldown === "~") {
-            console.log("Alert " + id + " has an infinite cooldown, hiding");
-            visible = false;
-            return;
-        }
-
-        const lastSeen = Temporal.Instant.fromEpochSeconds(localStorage.getItem(cooldownStorageKey) as number);
-        if (Temporal.Instant.compare(Temporal.Now.instant(), lastSeen.add({seconds: parseInt(closeableCooldown)})) === 1) {
-            console.log("Alert " + id + " has a cooldown of " + closeableCooldown + " and was last seen " + lastSeen.toLocaleString() + " making it due for a showing");
-            visible = true;
-        } else {
-            visible = false;
-        }
-    }
-
-    onMount(() => {
-        if (cooldownEnabled) {
-            run_cooldown();
-        }
-    })
-
-    afterUpdate(() => {
-        if (type === "default") {
-            type = "primary";
-        }
-    });
-</script>
-
-<div class="alert alert--{type} padding-sm radius-md"
-     id="{id}"
-     class:alert--is-visible={visible}
-     role="alert">
-    <div class="flex justify-between">
-        <div class="flex flex-row items-center">
-            <svg class="icon icon--sm alert__icon margin-right-xxs"
-                 viewBox="0 0 24 24"
-                 aria-hidden="true">
-                <path d="M12,0C5.383,0,0,5.383,0,12s5.383,12,12,12s12-5.383,12-12S18.617,0,12,0z M14.658,18.284 c-0.661,0.26-2.952,1.354-4.272,0.191c-0.394-0.346-0.59-0.785-0.59-1.318c0-0.998,0.328-1.868,0.919-3.957 c0.104-0.395,0.231-0.907,0.231-1.313c0-0.701-0.266-0.887-0.987-0.887c-0.352,0-0.742,0.125-1.095,0.257l0.195-0.799 c0.787-0.32,1.775-0.71,2.621-0.71c1.269,0,2.203,0.633,2.203,1.837c0,0.347-0.06,0.955-0.186,1.375l-0.73,2.582 c-0.151,0.522-0.424,1.673-0.001,2.014c0.416,0.337,1.401,0.158,1.887-0.071L14.658,18.284z M13.452,8c-0.828,0-1.5-0.672-1.5-1.5 s0.672-1.5,1.5-1.5s1.5,0.672,1.5,1.5S14.28,8,13.452,8z"></path>
-            </svg>
-            {#if title}
-                <p class="text-sm">
-                    <strong class="error-title">{title}</strong>
-                </p>
-            {:else if message}
-                <div class="text-component text-sm break-word">
-                    {@html message}
-                </div>
-            {/if}
-        </div>
-        {#if closeable}
-            <button class="reset alert__close-btn"
-                    on:click={close}>
-                <svg class="icon"
-                     viewBox="0 0 20 20"
-                     fill="none"
-                     stroke="currentColor"
-                     stroke-linecap="round"
-                     stroke-linejoin="round"
-                     stroke-width="2">
-                    <title>Close alert</title>
-                    <line x1="3"
-                          y1="3"
-                          x2="17"
-                          y2="17"/>
-                    <line x1="17"
-                          y1="3"
-                          x2="3"
-                          y2="17"/>
-                </svg>
-            </button>
-        {/if}
-    </div>
-
-    {#if message && title}
-        <div class="text-component text-sm break-word padding-top-xs">
-            {@html message}
-        </div>
-    {/if}
-</div>
diff --git a/old-apps/web-shared/src/components/blowout-toolbelt.svelte b/old-apps/web-shared/src/components/blowout-toolbelt.svelte
deleted file mode 100644
index b83048c..0000000
--- a/old-apps/web-shared/src/components/blowout-toolbelt.svelte
+++ /dev/null
@@ -1,70 +0,0 @@
-<script>
-	import { onMount } from "svelte";
-	import ThemeSwitcher from "./theme-switcher.svelte";
-	import ThemeSwitcherIcon from "./theme-switcher-icon.svelte";
-	import LocaleSwitcher from "./locale-switcher.svelte";
-	import LocaleSwitcherIcon from "./locale-switcher-icon.svelte";
-	import { ChevronsRightIcon, ChevronsLeftIcon } from "svelte-feather-icons";
-
-	let expanded = false;
-	const localeSwitcher = {
-		show: false,
-		selection: "preffered"
-	};
-
-	const themeSwitcher = {
-		show: false,
-		selection: "system"
-	};
-
-	onMount(() => {
-		document.addEventListener("keydown", (e) => {
-			if (e.code === "Escape") {
-				expanded = false;
-			}
-		});
-		document.addEventListener("click", (e) => {
-			if (e.target.closest("[data-blowout-toolbelt-element]") === null) {
-				expanded = false;
-			}
-		});
-	});
-</script>
-<style>
-    .blowout {
-        right: -80px;
-    }
-
-    .expanded {
-        right: 0 !important;
-    }
-</style>
-<aside class="blowout position-fixed bg-light inner-glow shadow-xs padding-xxs bottom-50% right-0 z-index-popover {expanded ? 'expanded' : ''}" data-blowout-toolbelt-element>
-    <LocaleSwitcher bind:show="{localeSwitcher.show}"
-                    glow="{false}"
-                    data-blowout-toolbelt-element
-                    bind:selection="{localeSwitcher.selection}"/>
-    <ThemeSwitcher bind:show="{themeSwitcher.show}"
-                   glow="{false}"
-                   data-blowout-toolbelt-element
-                   bind:selection="{themeSwitcher.selection}"/>
-    <div class="flex flex-row gap-sm justify-end">
-        {#if !expanded}
-            <div class="flex ld-switch-btn"
-                 data-blowout-toolbelt-element
-                 on:click={() => expanded = true}>
-                <ChevronsLeftIcon/>
-            </div>
-        {:else}
-            <div class="flex ld-switch-btn"
-                 data-blowout-toolbelt-element
-                 on:click={() => expanded = false}>
-                <ChevronsRightIcon/>
-            </div>
-        {/if}
-        <LocaleSwitcherIcon bind:show="{localeSwitcher.show}"
-                            bind:selection="{localeSwitcher.selection}"/>
-        <ThemeSwitcherIcon bind:show="{themeSwitcher.show}"
-                           bind:selection="{themeSwitcher.selection}"/>
-    </div>
-</aside>
diff --git a/old-apps/web-shared/src/components/breadcrumb/bread.svelte b/old-apps/web-shared/src/components/breadcrumb/bread.svelte
deleted file mode 100644
index 244bb24..0000000
--- a/old-apps/web-shared/src/components/breadcrumb/bread.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script lang="ts">
-    export type sizes = "big"|"small";
-    export let size: sizes = "small";
-</script>
-<nav class="breadcrumbs {size === 'small' ? 'text-sm' : 'text-lg'}">
-    <ol class="flex flex-wrap items-center gap-xxs">
-        <slot></slot>
-    </ol>
-</nav>
diff --git a/old-apps/web-shared/src/components/breadcrumb/crumb.svelte b/old-apps/web-shared/src/components/breadcrumb/crumb.svelte
deleted file mode 100644
index e540a44..0000000
--- a/old-apps/web-shared/src/components/breadcrumb/crumb.svelte
+++ /dev/null
@@ -1,27 +0,0 @@
-<script>
-    export let name;
-    export let withArrow = false;
-    export let isLink = false;
-</script>
-<li class="breadcrumbs__item">
-    {#if isLink}
-        <a class="color-inherit {isLink ? 'cursor-pointer color-primary-light' : ''}"
-           on:click>{name}</a>
-    {:else}
-        <span class="color-inherit {isLink ? 'cursor-pointer color-primary-light' : ''}"
-              on:click>{name}</span>
-    {/if}
-    {#if withArrow}
-        <svg class="icon margin-left-xxxs color-contrast-low"
-             aria-hidden="true"
-             viewBox="0 0 16 16">
-            <polyline fill="none"
-                      stroke="currentColor"
-                      stroke-width="1"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-miterlimit="10"
-                      points="6.5,3.5 11,8 6.5,12.5 "></polyline>
-        </svg>
-    {/if}
-</li>
diff --git a/old-apps/web-shared/src/components/breadcrumb/index.ts b/old-apps/web-shared/src/components/breadcrumb/index.ts
deleted file mode 100644
index 485ed7b..0000000
--- a/old-apps/web-shared/src/components/breadcrumb/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import Bread from "./bread.svelte";
-import Crumb from "./crumb.svelte";
-
-export {
-    Bread,
-    Crumb
-};
diff --git a/old-apps/web-shared/src/components/button.svelte b/old-apps/web-shared/src/components/button.svelte
deleted file mode 100644
index 5eaf19f..0000000
--- a/old-apps/web-shared/src/components/button.svelte
+++ /dev/null
@@ -1,116 +0,0 @@
-<script lang="ts">
-    import Icon from "$shared/components/icon.svelte";
-
-    export let text = "";
-    export let title = "";
-    export let href = "";
-    export let variant: "primary"|"secondary"|"subtle" = "primary";
-    export let type: "button"|"submit"|"reset" = "button";
-    export let disabled = false;
-    export let loading = false;
-    export let icon = "";
-    export let icon_right_aligned = false;
-    export let icon_width = false;
-    export let icon_height = false;
-    export let id;
-    export let tabindex;
-    export let style;
-    
-    $: shared_props = {
-        type: type,
-        id: id || null,
-        title: title || null,
-        disabled: disabled || null,
-        tabindex: tabindex || null,
-        style: style || null,
-        "aria-controls": ($$restProps["aria-controls"] ?? "") || null,
-        class: [variant === "reset" ? "reset" : `btn btn--${variant} btn--preserve-width  ${loading ? "btn--state-b" : ""}`, $$restProps.class ?? ""].filter(Boolean).join(" "),
-    };
-</script>
-
-<template>
-    {#if href && !disabled}
-        <a {href}
-           {...shared_props}
-           on:click>
-            <span class="btn__content-a">
-                {#if icon !== ""}
-                    {#if icon_right_aligned}
-                        {text}
-                        <Icon class="{text ? 'margin-left-xxxs': ''}"
-                              width={icon_width}
-                              height={icon_height}
-                              name={icon}/>
-                    {:else}
-                        <Icon class="{text ? 'margin-left-xxxs': ''}"
-                              width={icon_width}
-                              height={icon_height}
-                              name={icon}/>
-                        {text}
-                    {/if}
-                {:else}
-                    {text}
-                {/if}
-            </span>
-            {#if variant !== "reset" && loading}
-                <span class="btn__content-b">
-                    <svg class="icon icon--is-spinning"
-                         aria-hidden="true"
-                         viewBox="0 0 16 16">
-                        <title>Loading</title>
-                        <g stroke-width="1"
-                           fill="currentColor"
-                           stroke="currentColor">
-                            <path d="M.5,8a7.5,7.5,0,1,1,1.91,5"
-                                  fill="none"
-                                  stroke="currentColor"
-                                  stroke-linecap="round"
-                                  stroke-linejoin="round"/>
-                        </g>
-                    </svg>
-                </span>
-            {/if}
-        </a>
-    {:else}
-        <button {...shared_props}
-                on:click>
-            <span class="btn__content-a">
-                {#if icon !== ""}
-                    {#if icon_right_aligned}
-                        {text}
-                        <Icon class="{text ? 'margin-left-xxxs': ''}"
-                              width={icon_width}
-                              height={icon_height}
-                              name={icon}/>
-                    {:else}
-                        <Icon class="{text ? 'margin-left-xxxs': ''}"
-                              width={icon_width}
-                              height={icon_height}
-                              name={icon}/>
-                        {text}
-                    {/if}
-                {:else}
-                    {text}
-                {/if}
-            </span>
-            {#if variant !== "reset" && loading}
-                <span class="btn__content-b">
-                    <svg class="icon icon--is-spinning"
-                         aria-hidden="true"
-                         viewBox="0 0 16 16">
-                        <title>Loading</title>
-                        <g stroke-width="1"
-                           fill="currentColor"
-                           stroke="currentColor">
-                            <path d="M.5,8a7.5,7.5,0,1,1,1.91,5"
-                                  fill="none"
-                                  stroke="currentColor"
-                                  stroke-linecap="round"
-                                  stroke-linejoin="round"/>
-                        </g>
-                    </svg>
-                </span>
-            {/if}
-        </button>
-    {/if}
-</template>
diff --git a/old-apps/web-shared/src/components/chip.svelte b/old-apps/web-shared/src/components/chip.svelte
deleted file mode 100644
index 7fbb445..0000000
--- a/old-apps/web-shared/src/components/chip.svelte
+++ /dev/null
@@ -1,50 +0,0 @@
-<script>
-	import {IconNames} from "$shared/lib/configuration";
-	import {createEventDispatcher} from "svelte";
-	import Button from "./button.svelte";
-
-	const dispatch = createEventDispatcher();
-	export let removable = false;
-	export let clickable = false;
-	export let text = "";
-	export let id = "";
-	export let color = "";
-	export let tabindex = "";
-
-	function handle_remove() {
-		if (removable) {
-			dispatch("remove", {
-				id
-			});
-		}
-	}
-
-	function handle_click() {
-		if (clickable) {
-			dispatch("clicked", {
-				id
-			});
-		}
-	}
-</script>
-
-<div class="chip break-word text-sm justify-between justify-start@md {clickable ? 'chip--interactive' : ''}"
-     on:click={handle_click}
-     id={id}
-     style={color !== "" ? `background-color: ${color}15; border: 1px solid ${color}; color: ${color}` : ""}
-     {tabindex}
->
-    <span class="chip__label">{text}</span>
-
-    {#if removable}
-        <Button class="chip__btn"
-                variant="reset"
-                style="{color !== '' ? `background-color: ${color}45;` : ''}"
-                {tabindex}
-                icon="{IconNames.x}"
-                icon_width="initial"
-                icon_height="initial"
-                on:click={handle_remove}
-        />
-    {/if}
-</div>
diff --git a/old-apps/web-shared/src/components/details.svelte b/old-apps/web-shared/src/components/details.svelte
deleted file mode 100644
index 6ccacb0..0000000
--- a/old-apps/web-shared/src/components/details.svelte
+++ /dev/null
@@ -1,35 +0,0 @@
-<script>
-	import {random_string} from "$shared/lib/helpers";
-
-	let open = false;
-	export let summary;
-	const id = "details-" + random_string(4);
-
-	function on_toggle(event) {
-		open = event.target.open;
-	}
-</script>
-
-<details class="details margin-bottom-sm"
-         on:toggle={on_toggle}
-         id={id}>
-    <summary class="details__summary"
-             aria-controls={id}
-             aria-expanded={open}>
-        <span class="flex items-center">
-            <svg
-                    class="icon icon--xxs margin-right-xxxs"
-                    aria-hidden="true"
-                    viewBox="0 0 12 12">
-                <path
-                        d="M2.783.088A.5.5,0,0,0,2,.5v11a.5.5,0,0,0,.268.442A.49.49,0,0,0,2.5,12a.5.5,0,0,0,.283-.088l8-5.5a.5.5,0,0,0,0-.824Z"/>
-            </svg>
-            <span>{summary}</span>
-        </span>
-    </summary>
-    <div
-            class="details__content text-component margin-top-xs"
-            aria-hidden={!open}>
-        <slot/>
-    </div>
-</details>
diff --git a/old-apps/web-shared/src/components/dropdown.svelte b/old-apps/web-shared/src/components/dropdown.svelte
deleted file mode 100644
index a28bcd3..0000000
--- a/old-apps/web-shared/src/components/dropdown.svelte
+++ /dev/null
@@ -1,389 +0,0 @@
-<script lang="ts">
-    // @ts-ignore
-    import { go, highlight } from "fuzzysort";
-    import { element_has_focus, random_string } from "$shared/lib/helpers";
-    import Button from "$shared/components/button.svelte";
-    import Chip from "$shared/components/chip.svelte";
-
-    export let name;
-    export let id;
-    export let maxlength;
-    export let placeholder = "Search";
-    export let entries = [];
-    export let createable = false;
-    export let loading = false;
-    export let multiple = false;
-    export let noResultsText;
-    export let errorText;
-    export let label;
-    export let on_create_async = ({name: string}) => {
-    };
-
-    export const reset = () => methods.reset();
-    export const select = (id: string) => methods.select_entry(id);
-    export const deselect = (id: string) => methods.deselect_entry(id);
-
-    const INTERNAL_ID = "__dropdown-" + random_string(5);
-
-    let searchInputNode;
-    let searchResults = [];
-    let searchValue = "";
-    let showCreationHint = false;
-    let showDropdown = false;
-    let lastKeydownCode = "";
-    let mouseIsOverDropdown = false;
-    let mouseIsOverComponent = false;
-
-    $: hasSelection = entries.some((c) => c.selected === true);
-    $: if (searchValue.trim()) {
-        showCreationHint = createable && entries.every((c) => search.normalise_value(c.name) !== search.normalise_value(searchValue));
-    } else {
-        showCreationHint = false;
-        entries = methods.get_sorted_array(entries);
-    }
-
-    const search = {
-        normalise_value(value: string): string {
-            if (!value) {
-                return "";
-            }
-            return value.toString().trim().toLowerCase();
-        },
-        do() {
-            const query = search.normalise_value(searchValue);
-            if (!query.trim()) {
-                searchResults = [];
-                return;
-            }
-
-            const options = {
-                limit: 10,
-                allowTypo: true,
-                threshold: -10000,
-                key: "name",
-            };
-            searchResults = go(query, entries, options);
-            showDropdown = true;
-        },
-        on_input_focusout() {
-            if (lastKeydownCode !== "Tab" && (mouseIsOverDropdown || lastKeydownCode === "ArrowDown")) {
-                return;
-            }
-            const selected = entries.find((c) => c.selected === true);
-            if (selected && !multiple) {
-                searchValue = selected.name;
-            }
-            document.querySelector("#" + INTERNAL_ID + " ul li.focus")?.classList.remove("focus");
-            showDropdown = false;
-        }
-    };
-
-    const methods = {
-        reset(focus_input = false) {
-            searchValue = "";
-            const copy = entries;
-            for (const entry of copy) {
-                entry.selected = false;
-            }
-            entries = methods.get_sorted_array(copy);
-            if (focus_input) {
-                searchInputNode?.focus();
-                showDropdown = true;
-            } else {
-                showDropdown = false;
-            }
-        },
-        async create_entry(name) {
-            if (!name || !createable || loading) {
-                console.log("Not sending creation event due to failed preconditions", {name, createable, loading});
-                return;
-            }
-            try {
-                await on_create_async({name});
-                searchValue = "";
-                loading = false;
-            } catch (e) {
-                console.error(e);
-            }
-        },
-        select_entry(entry_id) {
-            if (!entry_id || loading) {
-                console.log("Not selecting entry due to failed preconditions", {
-                    entry_id,
-                    loading,
-                });
-                return;
-            }
-
-            const copy = entries;
-            let selected;
-            for (const entry of entries) {
-                if (entry.id === entry_id) {
-                    entry.selected = true;
-                    selected = entry;
-                    if (multiple) {
-                        searchValue = "";
-                    } else {
-                        searchValue = entry.name;
-                    }
-                } else if (!multiple) {
-                    entry.selected = false;
-                }
-            }
-            entries = methods.get_sorted_array(copy);
-            searchInputNode?.focus();
-            searchResults = [];
-        },
-        deselect_entry(entry_id) {
-            if (!entry_id || loading) {
-                console.log("Not deselecting entry due to failed preconditions", {
-                    entry_id,
-                    loading,
-                });
-                return;
-            }
-            console.log("Deselecting entry", entry_id);
-
-            const copy = entries;
-            let deselected;
-
-            for (const entry of copy) {
-                if (entry.id === entry_id) {
-                    entry.selected = false;
-                    deselected = entry;
-                }
-            }
-
-            entries = methods.get_sorted_array(copy);
-            searchInputNode?.focus();
-        },
-        get_sorted_array(entries: Array<DropdownEntry>): Array<DropdownEntry> {
-            if (!entries) {
-                return;
-            }
-            if (entries.length < 1) {
-                return [];
-            }
-            if (searchValue) {
-                return entries;
-            }
-            return (entries as any).sort((a, b) => {
-                search.normalise_value(a.name).localeCompare(search.normalise_value(b.name));
-            });
-        },
-    };
-
-    const windowEvents = {
-        on_mousemove(event) {
-            if (!event.target) return;
-            mouseIsOverDropdown = (event.target?.closest("#" + INTERNAL_ID + " .autocomplete__results") != null ?? false);
-            mouseIsOverComponent = (event.target?.closest("#" + INTERNAL_ID) != null ?? false);
-        },
-        on_click(event) {
-            if (showDropdown && !mouseIsOverDropdown && !mouseIsOverComponent && event.target.id !== id && event.target?.htmlFor !== id) {
-                showDropdown = false;
-            }
-        },
-        on_keydown(event) {
-            lastKeydownCode = event.code;
-            const enterPressed = event.code === "Enter";
-            const backspacePressed = event.code === "Backspace";
-            const arrowUpPressed = event.code === "ArrowUp";
-            const spacePressed = event.code === "Space";
-            const arrowDownPressed = event.code === "ArrowDown";
-            const searchInputHasFocus = element_has_focus(searchInputNode);
-            const focusedEntry = document.querySelector("#" + INTERNAL_ID + " ul    .focus");
-
-            if (showDropdown && (enterPressed || arrowDownPressed)) {
-                event.preventDefault();
-                event.stopPropagation();
-            }
-
-            if (searchInputHasFocus && backspacePressed && !searchValue && entries.length > 0) {
-                if (entries.filter(c => c.selected === true).at(-1)?.id ?? false) {
-                    methods.deselect_entry(entries.filter(c => c.selected === true).at(-1)?.id ?? "");
-                }
-                return;
-            }
-            if (searchInputHasFocus && enterPressed && showCreationHint) {
-                methods.create_entry(searchValue.trim());
-                return;
-            }
-
-            if (searchInputHasFocus && !focusedEntry && arrowDownPressed) {
-                const firstEntry = document.querySelector("#" + INTERNAL_ID + " ul li:first-of-type");
-                if (firstEntry) {
-                    firstEntry.classList.add("focus");
-                    return;
-                }
-            }
-
-            if (focusedEntry && (arrowUpPressed || arrowDownPressed)) {
-                if (arrowDownPressed) {
-                    if (focusedEntry.nextElementSibling) {
-                        focusedEntry.nextElementSibling.classList.add("focus");
-                        focusedEntry.nextElementSibling.scrollIntoView();
-                    } else {
-                        document.querySelector("#" + INTERNAL_ID + " ul li:first-of-type").classList.add("focus");
-                        document.querySelector("#" + INTERNAL_ID + " ul li:first-of-type").scrollIntoView();
-                    }
-                } else if (arrowUpPressed) {
-                    if (focusedEntry.previousElementSibling) {
-                        focusedEntry.previousElementSibling.classList.add("focus");
-                        focusedEntry.previousElementSibling.scrollIntoView();
-                    } else {
-                        document.querySelector("#" + INTERNAL_ID + " ul li:last-of-type").classList.add("focus");
-                        document.querySelector("#" + INTERNAL_ID + " ul li:last-of-type").scrollIntoView();
-                    }
-                }
-                focusedEntry.classList.remove("focus");
-                return;
-            }
-
-            if (focusedEntry && (spacePressed || enterPressed)) {
-                methods.select_entry(focusedEntry.dataset.id);
-                return;
-            }
-
-            if (lastKeydownCode === "Tab" && !searchInputHasFocus) {
-                showDropdown = false;
-            }
-        },
-        on_touchend(event) {
-            windowEvents.on_mousemove(event);
-        }
-    };
-
-    interface DropdownEntry {
-        name: string,
-        id: string,
-    }
-</script>
-
-<svelte:window
-        on:keydown={windowEvents.on_keydown}
-        on:mousemove={windowEvents.on_mousemove}
-        on:touchend={windowEvents.on_touchend}
-        on:click={windowEvents.on_click}
-/>
-
-{#if label}
-    <label for="{id}"
-           class="form-label margin-bottom-xxs">{label}</label>
-{/if}
-
-<div class="autocomplete position-relative select-auto"
-     class:cursor-wait={loading}
-     class:autocomplete--results-visible={showDropdown}
-     class:select-auto--selection-done={searchValue}
-     id={INTERNAL_ID}
->
-    <!-- input -->
-    <div class="select-auto__input-wrapper form-control"
-         style="cursor: text"
-         on:click={() => {
-			 if (!element_has_focus(searchInputNode)) searchInputNode.focus();
-			 showDropdown = true;
-         }}
-         class:multiple={multiple === true}
-         class:has-selection={hasSelection}>
-        {#if multiple === true && hasSelection}
-            {#each entries.filter((c) => c.selected === true) as entry}
-                <Chip id={entry.id}
-                      removable={true}
-                      tabindex="-1"
-                      on:remove={() => methods.deselect_entry(entry.id)}
-                      text={entry.name}/>
-            {/each}
-        {/if}
-        <input
-                class="reset width-100%"
-                style="outline:none;"
-                type="text"
-                {name}
-                {id}
-                {maxlength}
-                {placeholder}
-                bind:value={searchValue}
-                bind:this={searchInputNode}
-                on:input={() => search.do()}
-                on:click={() => (showDropdown = true)}
-                on:focus={() => (showDropdown = true)}
-                on:blur={search.on_input_focusout}
-                autocomplete="off"
-        />
-        <div class="select-auto__input-icon-wrapper">
-            <!-- arrow icon -->
-            <svg class="icon"
-                 viewBox="0 0 16 16">
-                <title>Open selection</title>
-                <polyline points="1 5 8 12 15 5"
-                          fill="none"
-                          stroke="currentColor"
-                          stroke-linecap="round"
-                          stroke-linejoin="round"
-                          stroke-width="2"/>
-            </svg>
-
-            <!-- close X icon -->
-            <button class="reset select-auto__input-btn"
-                    type="button"
-                    on:click={() => reset(true)}>
-                <svg class="icon"
-                     viewBox="0 0 16 16">
-                    <title>Reset selection</title>
-                    <path
-                            d="M8,0a8,8,0,1,0,8,8A8,8,0,0,0,8,0Zm3.707,10.293a1,1,0,1,1-1.414,1.414L8,9.414,5.707,11.707a1,1,0,0,1-1.414-1.414L6.586,8,4.293,5.707A1,1,0,0,1,5.707,4.293L8,6.586l2.293-2.293a1,1,0,1,1,1.414,1.414L9.414,8Z"
-                    />
-                </svg>
-            </button>
-        </div>
-    </div>
-
-    {#if errorText}
-        <small class="color-error">{errorText}</small>
-    {/if}
-
-    <!-- dropdown -->
-    <div class="autocomplete__results select-auto__results shadow-xs inner-glow">
-        <ul on:keydown={(event) => event.code.startsWith("Arrow") && event.preventDefault()}
-            tabindex="-1"
-            class="autocomplete__list">
-            {#if searchResults.length > 0}
-                {#each searchResults.filter((c) => !c.selected) as result}
-                    <li class="select-auto__option padding-y-xs padding-x-sm"
-                        data-id={result.obj.id}
-                        on:click={(e) => methods.select_entry(e.target.dataset.id)}
-                        tabindex="-1">
-                        {@html highlight(result, (open = '<span class="font-semibold">'), (close = "</span>"))}
-                    </li>
-                {/each}
-            {:else if entries.length > 0}
-                {#each entries.filter((c) => !c.selected) as entry}
-                    <li class="select-auto__option padding-y-xs padding-x-sm"
-                        data-id={entry.id}
-                        on:click={(e) => methods.select_entry(e.target.dataset.id)}
-                        tabindex="-1">
-                        {entry.name}
-                    </li>
-                {/each}
-            {:else}
-                <li class="select-auto__option text-center padding-y-xs padding-x-sm pointer-events-none"
-                    tabindex="-1">
-                    {noResultsText}
-                </li>
-            {/if}
-        </ul>
-        {#if showCreationHint}
-            <div class="width-100% border-top border-bg-lighter padding-xxxs">
-                <Button variant="reset"
-                        type="button"
-                        class="width-100%"
-                        text="Press enter or click to create {searchValue.trim()}"
-                        title="Press enter or click here to create {searchValue.trim()}"
-                        loading={loading}
-                        on:click={() => methods.create_entry(searchValue.trim())}/>
-            </div>
-        {/if}
-    </div>
-</div>
diff --git a/old-apps/web-shared/src/components/form/index.ts b/old-apps/web-shared/src/components/form/index.ts
deleted file mode 100644
index 08769bd..0000000
--- a/old-apps/web-shared/src/components/form/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import Textarea from "./textarea.svelte";
-
-export {
-    Textarea
-};
diff --git a/old-apps/web-shared/src/components/form/textarea.svelte b/old-apps/web-shared/src/components/form/textarea.svelte
deleted file mode 100644
index b313d2e..0000000
--- a/old-apps/web-shared/src/components/form/textarea.svelte
+++ /dev/null
@@ -1,48 +0,0 @@
-<script lang="ts">
-    export let id;
-    export let disabled = false;
-    export let loading = false;
-    export let rows = 2;
-    export let cols = 0;
-    export let name;
-    export let placeholder;
-    export let value;
-    export let label;
-    export let errorText;
-
-    $: shared_props = {
-        rows: rows || null,
-        cols: cols || null,
-        name: name || null,
-        id: id || null,
-        disabled: disabled || null,
-        class: [`form-control ${loading ? "c-disabled loading" : ""}`, $$restProps.class ?? ""].filter(Boolean).join(" "),
-    };
-
-    let textarea;
-    let scrollHeight = 0;
-
-    $:if (textarea) {
-        scrollHeight = textarea.scrollHeight;
-    }
-
-    function on_input(event) {
-        event.target.style.height = "auto";
-        event.target.style.height = (this.scrollHeight) + "px";
-    }
-</script>
-
-{#if label}
-    <label for="{id}"
-           class="form-label margin-bottom-xxs">{label}</label>
-{/if}
-<textarea {...shared_props}
-          {placeholder}
-          style="overflow-y:hidden;min-height:calc(1.5em + .75rem + 2px);{scrollHeight ? 'height:{scrollHeight}px' : ''};"
-          bind:value={value}
-          bind:this={textarea}
-          on:input={on_input}
-></textarea>
-{#if errorText}
-    <small class="color-error">{errorText}</small>
-{/if}
diff --git a/old-apps/web-shared/src/components/icon.svelte b/old-apps/web-shared/src/components/icon.svelte
deleted file mode 100644
index 144b45d..0000000
--- a/old-apps/web-shared/src/components/icon.svelte
+++ /dev/null
@@ -1,87 +0,0 @@
-<script>
-	import {IconNames} from "$shared/lib/configuration";
-
-	const icons = [
-		{
-			box: 16,
-			name: IconNames.verticalDots,
-			svg: `<path d="M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/>`,
-		},
-		{
-			box: 16,
-			name: IconNames.clock,
-			svg: `<path d="M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z"/><path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0z"/>`,
-		},
-		{
-			box: 21,
-			name: IconNames.trash,
-			svg: `<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" transform="translate(3 2)"><path d="m2.5 2.5h10v12c0 1.1045695-.8954305 2-2 2h-6c-1.1045695 0-2-.8954305-2-2zm5-2c1.0543618 0 1.91816512.81587779 1.99451426 1.85073766l.00548574.14926234h-4c0-1.1045695.8954305-2 2-2z"/><path d="m.5 2.5h14"/><path d="m5.5 5.5v8"/><path d="m9.5 5.5v8"/></g>`,
-		},
-		{
-			box: 21,
-			name: IconNames.pencilSquare,
-			svg: `
-			<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" transform="translate(3 3)"><path d="m14 1c.8284271.82842712.8284271 2.17157288 0 3l-9.5 9.5-4 1 1-3.9436508 9.5038371-9.55252193c.7829896-.78700064 2.0312313-.82943964 2.864366-.12506788z"/><path d="m6.5 14.5h8"/><path d="m12.5 3.5 1 1"/></g>
-			`,
-		},
-		{
-			box: 16,
-			name: IconNames.x,
-			svg: `<path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>`,
-		},
-		{
-			box: 16,
-			name: IconNames.funnel,
-			svg: `<path d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5v-2zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2h-11z"/>`,
-		},
-		{
-			box: 16,
-			name: IconNames.funnelFilled,
-			svg: `<path d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5v-2z"/>`,
-		},
-		{
-			box: 16,
-			name: IconNames.github,
-			svg: `
-			  <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
-			`
-		},
-		{
-			box: 21,
-			name: IconNames.refresh,
-			svg: `<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" transform="translate(2 2)"><path d="m4.5 1.5c-2.4138473 1.37729434-4 4.02194088-4 7 0 4.418278 3.581722 8 8 8s8-3.581722 8-8-3.581722-8-8-8"/><path d="m4.5 5.5v-4h-4"/></g>            `
-		},
-		{
-			box: 21,
-			name: IconNames.resetHard,
-			svg: `<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" transform="matrix(0 1 1 0 2.5 2.5)"><path d="m13 11 3 3v-6c0-3.36502327-2.0776-6.24479706-5.0200433-7.42656457-.9209869-.36989409-1.92670197-.57343543-2.9799567-.57343543-4.418278 0-8 3.581722-8 8s3.581722 8 8 8c1.48966767 0 3.4724708-.3698516 5.0913668-1.5380762" transform="matrix(-1 0 0 -1 16 16)"/><path d="m5 5 6 6"/><path d="m11 5-6 6"/></g>`
-		},
-		{
-			box: 21,
-			name: IconNames.arrowUp,
-			svg: `<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" transform="translate(6 3)"><path d="m8.5 4.5-4-4-4.029 4"/><path d="m4.5.5v13"/></g>`
-		},
-		{
-			box: 21,
-			name: IconNames.arrowDown,
-			svg: `<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" transform="translate(6 4)"><path d="m.5 9.499 4 4.001 4-4.001"/><path d="m4.5.5v13" transform="matrix(-1 0 0 -1 9 14)"/></g>`
-		},
-		{
-			box: 21,
-			name: IconNames.chevronDown,
-			svg: `<path d="m8.5.5-4 4-4-4" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" transform="translate(6 8)"/>`
-		}
-	];
-
-	export let name;
-	export let fill = false;
-	export let width = "1rem";
-	export let height = "1rem";
-	const displayIcon = icons.find((e) => e.name === name);
-</script>
-
-<svg class="icon {$$restProps.class ?? ''}"
-     style="width: {width}; height:{height}; fill: currentColor;"
-     viewBox="0 0 {displayIcon.box} {displayIcon.box}">
-    {@html displayIcon.svg}
-</svg>
diff --git a/old-apps/web-shared/src/components/link-card.svelte b/old-apps/web-shared/src/components/link-card.svelte
deleted file mode 100644
index 85738c7..0000000
--- a/old-apps/web-shared/src/components/link-card.svelte
+++ /dev/null
@@ -1,47 +0,0 @@
-<script>
-	export let text = "View";
-	export let name;
-	export let description = null;
-	export let href = null;
-	export let target;
-	export let title = null;
-</script>
-
-<a class="link-card flex flex-column bg-light cursor-pointer radius-sm inner-glow {$$restProps.class??''}"
-   {href}
-   {target}
-   {title}
-   on:click
-   aria-label="Link label">
-    <div class="padding-sm">
-        <div class="flex flex-wrap gap-xs items-center">
-            <slot name="icon"></slot>
-            <div class="line-height-xs">
-                <p class="text-lg font-semibold color-contrast-higher">{name}</p>
-                {#if description}
-                    <p class="color-contrast-low margin-top-xxxs">{description}</p>
-                {/if}
-            </div>
-        </div>
-    </div>
-    <div class="link-card__footer margin-top-auto border-top border-contrast-lower">
-        <p class="text-sm">{text}</p>
-        <div>
-            <svg class="icon icon--sm"
-                 viewBox="0 0 24 24">
-                <g fill="none"
-                   stroke="currentColor"
-                   stroke-linecap="round"
-                   stroke-linejoin="round"
-                   stroke-width="2">
-                    <line x1="3"
-                          y1="12"
-                          x2="21"
-                          y2="12"/>
-                    <polyline points="15 6 21 12 15 18"/>
-                </g>
-            </svg>
-        </div>
-    </div>
-</a>
-
diff --git a/old-apps/web-shared/src/components/locale-switcher-icon.svelte b/old-apps/web-shared/src/components/locale-switcher-icon.svelte
deleted file mode 100644
index d2776a1..0000000
--- a/old-apps/web-shared/src/components/locale-switcher-icon.svelte
+++ /dev/null
@@ -1,16 +0,0 @@
-<script>
-	import {GlobeIcon} from "svelte-feather-icons";
-
-	export let show = false;
-	export let selection = "preffered";
-</script>
-<div data-locale-switcher-element
-     class="ld-switch flex">
-    <button class="reset ld-switch-btn"
-            on:click={() => (show = !show)}>
-        <div class="ld-switch-btn__icon-wrapper ld-switch-btn__icon-wrapper--in"
-             aria-hidden="true">
-            <GlobeIcon/>
-        </div>
-    </button>
-</div>
diff --git a/old-apps/web-shared/src/components/locale-switcher.svelte b/old-apps/web-shared/src/components/locale-switcher.svelte
deleted file mode 100644
index 5399247..0000000
--- a/old-apps/web-shared/src/components/locale-switcher.svelte
+++ /dev/null
@@ -1,62 +0,0 @@
-<script>
-	import { CookieNames } from "$shared/lib/configuration";
-	import { get_cookie } from "$shared/lib/helpers";
-	import { currentLocale } from "$shared/lib/locale";
-	import { onMount } from "svelte";
-
-	export let glow = false;
-	export let show = false;
-	export let selection = "preffered";
-	export let size;
-
-	function change(to) {
-		selection = to;
-		currentLocale.set(to);
-	}
-
-	onMount(() => {
-		selection = get_cookie(CookieNames.locale);
-		document.addEventListener("keydown", (e) => {
-			if (e.code === "Escape") {
-				show = false;
-			}
-		});
-		document.addEventListener("click", (e) => {
-			if (e.target.closest("[data-locale-switcher-element]") === null) {
-				show = false;
-			}
-		});
-	});
-</script>
-
-<div class="bg-light padding-x-xs padding-bottom-xs padding-top-xxxs radius-md {glow ? 'inner-glow shadow-xs':''}"
-     data-locale-switcher-element
-     class:is-hidden={!show}
-     role="listbox">
-    <div class="flex flex-wrap flex-column"
-         role="group">
-        <div class="margin-bottom-xs flex-grow">
-            <span class="text-xs color-contrast-medium">Language</span>
-        </div>
-        <div class="flex gap-xs flex-row">
-            <div class="ld-switch-popover__option"
-                 aria-selected="{selection === 'en' ? 'true' : 'false'}"
-                 on:click={() => change("en")}
-                 role="option">
-                <div class="text-xs margin-top-xxxs padding-x-xxxxs">English</div>
-            </div>
-            <div class="ld-switch-popover__option"
-                 aria-selected="{selection === 'nb' ? 'true' : 'false'}"
-                 on:click={() => change("nb")}
-                 role="option">
-                <div class="text-xs margin-top-xxxs padding-x-xxxxs">Norsk</div>
-            </div>
-            <div class="ld-switch-popover__option"
-                 aria-selected="{selection === 'preffered' ? 'true' : 'false'}"
-                 on:click={() => change("preffered")}
-                 role="option">
-                <div class="text-xs margin-top-xxxs padding-x-xxxxs">Default</div>
-            </div>
-        </div>
-    </div>
-</div>
diff --git a/old-apps/web-shared/src/components/menu/index.ts b/old-apps/web-shared/src/components/menu/index.ts
deleted file mode 100644
index 8eb7938..0000000
--- a/old-apps/web-shared/src/components/menu/index.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import Menu from "./menu.svelte";
-import MenuItem from "./item.svelte";
-import MenuItemSeparator from "./separator.svelte";
-
-export {
-    Menu,
-    MenuItem,
-    MenuItemSeparator
-};
diff --git a/old-apps/web-shared/src/components/menu/item.svelte b/old-apps/web-shared/src/components/menu/item.svelte
deleted file mode 100644
index aeb0f99..0000000
--- a/old-apps/web-shared/src/components/menu/item.svelte
+++ /dev/null
@@ -1,8 +0,0 @@
-<script lang="ts">
-    export let danger = false;
-</script>
-<li role="menuitem" on:click>
-    <span class="menu__content {danger ? 'bg-error-lighter@hover color-white@hover' : ''}">
-        <slot/>
-    </span>
-</li>
diff --git a/old-apps/web-shared/src/components/menu/menu.svelte b/old-apps/web-shared/src/components/menu/menu.svelte
deleted file mode 100644
index 33517ab..0000000
--- a/old-apps/web-shared/src/components/menu/menu.svelte
+++ /dev/null
@@ -1,54 +0,0 @@
-<script lang="ts">
-    import {random_string} from "$shared/lib/helpers";
-
-    export const id = "__menu_" + random_string(3);
-    export let trigger: HTMLElement;
-    export let show = false;
-
-    let windowInnerWidth = 0;
-    let windowInnerHeight = 0;
-    let menu: HTMLMenuElement;
-
-    $: if (show && menu && trigger) {
-        const
-            selectedTriggerPosition = trigger.getBoundingClientRect(),
-            menuOnTop = (windowInnerHeight - selectedTriggerPosition.bottom) < selectedTriggerPosition.top,
-            left = selectedTriggerPosition.left,
-            right = (windowInnerWidth - selectedTriggerPosition.right),
-            isRight = (windowInnerWidth < selectedTriggerPosition.left + menu.offsetWidth),
-            vertical = menuOnTop
-                ? "bottom: " + (windowInnerHeight - selectedTriggerPosition.top) + "px;"
-                : "top: " + selectedTriggerPosition.bottom + "px;";
-
-        let horizontal = isRight ? "right: " + right + "px;" : "left: " + left + "px;";
-
-        // check right position is correct -> otherwise set left to 0
-        if (isRight && (right + menu.offsetWidth) > windowInnerWidth) horizontal = ("left: " + (windowInnerWidth - menu.offsetWidth) / 2 + "px;");
-        const maxHeight = menuOnTop ? selectedTriggerPosition.top - 20 : windowInnerHeight - selectedTriggerPosition.bottom - 20;
-        menu.setAttribute("style", horizontal + vertical + "max-height:" + Math.floor(maxHeight) + "px;");
-    }
-    
-    function on_window_click(event) {
-        if (!event.target.closest("#" + id) && !event.target.closest("[aria-controls='" + id + "']")) show = false;
-    }
-
-    function on_window_touchend(event) {
-        if (!event.target.closest("#" + id) && !event.target.closest("[aria-controls='" + id + "']")) show = false;
-    }
-</script>
-
-<svelte:window
-        on:click={on_window_click}
-        on:touchend={on_window_touchend}
-        bind:innerWidth={windowInnerWidth}
-        bind:innerHeight={windowInnerHeight}
-/>
-
-<menu class="menu"
-      id="{id}"
-      bind:this={menu}
-      class:menu--is-visible={show}
-      aria-expanded="{show}"
-      aria-haspopup="true">
-    <slot name="options"/>
-</menu>
diff --git a/old-apps/web-shared/src/components/menu/separator.svelte b/old-apps/web-shared/src/components/menu/separator.svelte
deleted file mode 100644
index 798dce0..0000000
--- a/old-apps/web-shared/src/components/menu/separator.svelte
+++ /dev/null
@@ -1,2 +0,0 @@
-<li class="menu__separator"
-    role="separator"></li>
diff --git a/old-apps/web-shared/src/components/modal.svelte b/old-apps/web-shared/src/components/modal.svelte
deleted file mode 100644
index f3b633c..0000000
--- a/old-apps/web-shared/src/components/modal.svelte
+++ /dev/null
@@ -1,66 +0,0 @@
-<script>
-	import {random_string} from "$shared/lib/helpers";
-
-	export let title = "";
-	let isVisible = false;
-	const modal_id = "modal_" + random_string(5);
-
-	function handle_keyup(e) {
-		if (e.key === "Escape") {
-			isVisible = false;
-		}
-	}
-
-	export const functions = {
-		open() {
-			isVisible = true;
-			window.addEventListener("keyup", handle_keyup);
-		},
-		close() {
-			isVisible = false;
-			window.removeEventListener("keyup", handle_keyup);
-		},
-	};
-</script>
-
-<div class="modal modal--animate-scale flex flex-center padding-md bg-dark bg-opacity-40% {isVisible ? 'modal--is-visible' : ''}"
-     id={modal_id}
->
-    <div class="modal__content width-100% max-width-xs max-height-100% overflow-auto radius-md shadow-md bg"
-         role="alertdialog"
-    >
-        <header class="padding-y-sm padding-x-md flex items-center justify-between"
-        >
-            <h4 class="text-truncate">{title}</h4>
-
-            <button class="reset modal__close-btn modal__close-btn--inner"
-                    on:click={functions.close}
-            >
-                <svg class="icon"
-                     viewBox="0 0 20 20">
-                    <title>Close modal window</title>
-                    <g fill="none"
-                       stroke="currentColor"
-                       stroke-miterlimit="10"
-                       stroke-width="2"
-                       stroke-linecap="round"
-                       stroke-linejoin="round"
-                    >
-                        <line x1="3"
-                              y1="3"
-                              x2="17"
-                              y2="17"/>
-                        <line x1="17"
-                              y1="3"
-                              x2="3"
-                              y2="17"/>
-                    </g>
-                </svg>
-            </button>
-        </header>
-
-        <div class="padding-bottom-md padding-x-md">
-            <slot/>
-        </div>
-    </div>
-</div>
diff --git a/old-apps/web-shared/src/components/pre-header.svelte b/old-apps/web-shared/src/components/pre-header.svelte
deleted file mode 100644
index 87a19b1..0000000
--- a/old-apps/web-shared/src/components/pre-header.svelte
+++ /dev/null
@@ -1,37 +0,0 @@
-<script>
-	export let closable = true;
-	export let show = false;
-</script>
-
-<div class="pre-header padding-y-xs" style="{show ? '' : 'display:none'}">
-    <div class="container max-width-lg position-relative">
-        <div class="text-component text-sm padding-right-lg">
-            <p>
-                <slot/>
-            </p>
-        </div>
-        {#if closable}
-            <button class="reset pre-header__close-btn"
-                    on:click={(event) => event.target.closest(".pre-header")?.remove()}>
-                <svg class="icon"
-                     viewBox="0 0 20 20">
-                    <title>Close header banner</title>
-                    <g fill="none"
-                       stroke="currentColor"
-                       stroke-linecap="round"
-                       stroke-linejoin="round"
-                       stroke-width="2">
-                        <line x1="4"
-                              y1="4"
-                              x2="16"
-                              y2="16"/>
-                        <line x1="16"
-                              y1="4"
-                              x2="4"
-                              y2="16"/>
-                    </g>
-                </svg>
-            </button>
-        {/if}
-    </div>
-</div>
diff --git a/old-apps/web-shared/src/components/screens/GeneralErrorScreen.svelte b/old-apps/web-shared/src/components/screens/GeneralErrorScreen.svelte
deleted file mode 100644
index dd4b5bd..0000000
--- a/old-apps/web-shared/src/components/screens/GeneralErrorScreen.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	export let message;
-	export let status;
-</script>
-
-<h1>{status}</h1>
-<p>{message}</p>
diff --git a/old-apps/web-shared/src/components/screens/NotFoundScreen.svelte b/old-apps/web-shared/src/components/screens/NotFoundScreen.svelte
deleted file mode 100644
index 69d55af..0000000
--- a/old-apps/web-shared/src/components/screens/NotFoundScreen.svelte
+++ /dev/null
@@ -1,161 +0,0 @@
-<style>
-    .fof__animation svg {
-        display: block;
-        max-width: 520px;
-        margin-left: auto;
-        margin-right: auto;
-    }
-
-    #i-fof-browser {
-        -webkit-transform-origin: 260px 304px;
-        transform-origin: 260px 304px;
-        -webkit-animation: i-fof-browser 4s infinite;
-        animation: i-fof-browser 4s infinite;
-    }
-
-    #i-fof-shadow {
-        -webkit-transform-origin: 282px 410px;
-        transform-origin: 282px 410px;
-        -webkit-animation: i-fof-shadow 4s infinite;
-        animation: i-fof-shadow 4s infinite;
-    }
-
-    @-webkit-keyframes i-fof-browser {
-        0%, 100% {
-            -webkit-transform: translateY(0) scale(1);
-            transform: translateY(0) scale(1);
-        }
-        50% {
-            -webkit-transform: translateY(-10%) scale(0.9);
-            transform: translateY(-10%) scale(0.9);
-        }
-    }
-
-    @keyframes i-fof-browser {
-        0%, 100% {
-            -webkit-transform: translateY(0) scale(1);
-            transform: translateY(0) scale(1);
-        }
-        50% {
-            -webkit-transform: translateY(-10%) scale(0.9);
-            transform: translateY(-10%) scale(0.9);
-        }
-    }
-
-    @-webkit-keyframes i-fof-shadow {
-        0%, 100% {
-            -webkit-transform: scale(1);
-            transform: scale(1);
-        }
-        50% {
-            -webkit-transform: scale(0.8);
-            transform: scale(0.8);
-        }
-    }
-
-    @keyframes i-fof-shadow {
-        0%, 100% {
-            -webkit-transform: scale(1);
-            transform: scale(1);
-        }
-        50% {
-            -webkit-transform: scale(0.8);
-            transform: scale(0.8);
-        }
-    }
-</style>
-
-<section class="fof">
-    <div class="container max-width-sm">
-        <div class="text-component text-center margin-bottom-lg">
-            <h1>Page not found</h1>
-            <p>Sorry, but the page you were looking for could not be found.</p>
-            <p><a href="/">Go to homepage</a>.</p>
-        </div>
-
-        <div class="fof__animation"
-             aria-lable="404 animation">
-            <svg id="i-fof"
-                 viewBox="0 0 520 450">
-                <g id="i-fof-ship">
-                    <path id="i-fof-capsule"
-                          d="M260,9a53,53,0,0,0-53,53H313A53,53,0,0,0,260,9Z"
-                          fill="var(--color-contrast-lower)"/>
-                    <path id="i-fof-ship-top"
-                          d="M448,73H72s78-37,188-37S448,73,448,73Z"
-                          fill="var(--color-contrast-low)"/>
-                    <path id="i-fof-ship-bottom"
-                          d="M448,73A1185.633,1185.633,0,0,0,72,73c80.173,34.484,144.2,37,188,37C370,110,448,73,448,73Z"
-                          fill="var(--color-contrast-high)"/>
-                </g>
-                <g id="i-fof-browser">
-                    <rect id="i-fof-browser-canvas"
-                          x="179"
-                          y="243"
-                          width="160"
-                          height="109"
-                          rx="6"
-                          transform="translate(131.361 -75.723) rotate(22.162)"
-                          fill="var(--color-contrast-higher)"/>
-                    <g id="i-fof-browser-dots"
-                       fill="var(--color-bg)">
-                        <circle cx="211.713"
-                                cy="228.029"
-                                r="3"/>
-                        <circle cx="221.9"
-                                cy="232.179"
-                                r="3"/>
-                        <circle cx="232.088"
-                                cy="236.328"
-                                r="3"/>
-                    </g>
-                    <rect id="i-fof-browser-body"
-                          x="180.737"
-                          y="258.557"
-                          width="152"
-                          height="89"
-                          rx="2"
-                          transform="translate(133.29 -74.459) rotate(22.162)"
-                          fill="var(--color-bg)"/>
-                    <g id="i-fof-emoji">
-                        <path d="M248.626,322.968A22,22,0,1,1,277.3,310.893,22,22,0,0,1,248.626,322.968Z"
-                              fill="#ffd764"/>
-                        <path d="M264.3,311a7,7,0,1,1,9.124-3.843A7,7,0,0,1,264.3,311Z"
-                              fill="#fff"/>
-                        <path d="M245.778,303.452a7,7,0,1,1,9.123-3.842A7,7,0,0,1,245.778,303.452Z"
-                              fill="#fff"/>
-                        <path d="M258.5,317.274l-12.966-5.281a1,1,0,0,1,.755-1.853l12.966,5.282a1,1,0,0,1-.755,1.852Z"
-                              fill="#444"/>
-                        <path d="M247.287,299.747a3,3,0,1,1,3.91-1.646A3,3,0,0,1,247.287,299.747Z"
-                              fill="#444"/>
-                        <path d="M265.809,307.292a3,3,0,1,1,3.91-1.647A3,3,0,0,1,265.809,307.292Z"
-                              fill="#444"/>
-                    </g>
-                </g>
-                <polygon id="i-fof-radar-body"
-                         points="415 410 105 410 196 106 324 106 415 410"
-                         fill="#4ad36b"
-                         opacity="0.5"/>
-                <ellipse id="i-fof-radar-bottom"
-                         cx="260"
-                         cy="410"
-                         rx="155"
-                         ry="28"
-                         fill="#4ad36b"/>
-                <ellipse id="i-fof-shadow"
-                         cx="282"
-                         cy="410"
-                         rx="72"
-                         ry="10"
-                         opacity="0.4"
-                         fill="var(--color-black)"/>
-                <ellipse id="i-fof-radar-top"
-                         cx="260"
-                         cy="106"
-                         rx="64"
-                         ry="6"
-                         fill="#4ad36b"/>
-            </svg>
-        </div>
-    </div>
-</section>
diff --git a/old-apps/web-shared/src/components/stopwatch.svelte b/old-apps/web-shared/src/components/stopwatch.svelte
deleted file mode 100644
index 0e641e8..0000000
--- a/old-apps/web-shared/src/components/stopwatch.svelte
+++ /dev/null
@@ -1,196 +0,0 @@
-<script lang="ts">
-    import Button from "$shared/components/button.svelte";
-    import { Textarea } from "$shared/components/form";
-    import { StorageKeys } from "$shared/lib/configuration";
-    import { loadLocaleAsync } from "$shared/lib/i18n/i18n-util.async";
-    import { i18nObject } from "$shared/lib/i18n/i18n-util";
-    import { currentLocale, preffered_or_default } from "$shared/lib/locale";
-    import { StoreType, writable_persistent } from "$shared/lib/persistent-store";
-    import { Temporal } from "@js-temporal/polyfill";
-    import { createEventDispatcher, onMount } from "svelte";
-
-    const state = writable_persistent({
-        initialState: {
-            hours: 0,
-            minutes: 0,
-            seconds: 0,
-            startTime: null as Temporal.PlainDateTime,
-            lastStep: null as Temporal.PlainDateTime,
-            isRunning: false,
-            intervalId: 0,
-            note: "",
-        },
-        options: {
-            store: StoreType.LOCAL
-        },
-        name: StorageKeys.stopwatch,
-    });
-
-    let timeString;
-    let LL = i18nObject($currentLocale);
-
-    $: if ($state.hours || $state.minutes || $state.seconds) {
-        timeString = $state.hours.toLocaleString(undefined, {minimumIntegerDigits: 2})
-            + ":" + $state.minutes.toLocaleString(undefined, {minimumIntegerDigits: 2})
-            + ":" + $state.seconds.toLocaleString(undefined, {minimumIntegerDigits: 2});
-    } else {
-        timeString = "--:--:--";
-    }
-
-    currentLocale.subscribe(async locale => {
-        if (locale === "preffered") locale = preffered_or_default();
-        await loadLocaleAsync(locale);
-        LL = i18nObject(locale);
-    });
-
-    onMount(async () => {
-        start_if_running();
-        await loadLocaleAsync($currentLocale);
-        LL = i18nObject($currentLocale);
-    });
-
-    function start_if_running() {
-        if ($state.isRunning) {
-            if (Temporal.PlainDateTime.compare($state.lastStep, Temporal.Now.plainDateTimeISO()) == -1) {
-                const duration = Temporal.Now.plainDateTimeISO().since($state.lastStep, {smallestUnit: "second"});
-                console.log("lastStep", $state.lastStep.toString());
-                console.log("duration", duration.toString());
-                console.log(duration.seconds);
-                // for (let i = 0; i < steps; i++) {
-                //     step();
-                // }
-            }
-            clearInterval($state.intervalId);
-            $state.intervalId = setInterval(step, 1000);
-        }
-    }
-
-    window.addEventListener("focus", () => {
-        start_if_running();
-    });
-
-    const dispatch = createEventDispatcher();
-
-    function step() {
-        $state.seconds = $state.seconds + 1;
-
-        if ($state.seconds == 60) {
-            $state.minutes = $state.minutes + 1;
-            $state.seconds = 0;
-        }
-
-        if ($state.minutes == 60) {
-            $state.hours = $state.hours + 1;
-            $state.minutes = 0;
-            $state.seconds = 0;
-        }
-
-        if (!$state.startTime) $state.startTime = Temporal.Now.plainDateTimeISO();
-        $state.lastStep = Temporal.Now.plainDateTimeISO();
-    }
-
-    function reset() {
-        clearInterval($state.intervalId);
-        $state.isRunning = false;
-        $state.hours = 0;
-        $state.minutes = 0;
-        $state.seconds = 0;
-        $state.startTime = null;
-        $state.intervalId = 0;
-        $state.note = "";
-    }
-
-    let roundUpToNearest = 30;
-    let roundDownToNearest = 30;
-
-    function on_round_up() {
-        const newTime = Temporal.PlainTime
-            .from({hour: $state.hours, minute: $state.minutes, second: $state.seconds})
-            .round({
-                roundingIncrement: roundUpToNearest,
-                smallestUnit: "minute",
-                roundingMode: "ceil"
-            });
-        $state.hours = newTime.hour;
-        $state.minutes = newTime.minute;
-        $state.seconds = newTime.second;
-    }
-
-    function on_round_down() {
-        const newTime = Temporal.PlainTime
-            .from({hour: $state.hours, minute: $state.minutes, second: $state.seconds,})
-            .round({
-                roundingIncrement: roundDownToNearest,
-                smallestUnit: "minute",
-                roundingMode: "trunc"
-            });
-        $state.hours = newTime.hour;
-        $state.minutes = newTime.minute;
-        $state.seconds = newTime.second;
-    }
-
-    function on_start_stop() {
-        if ($state.isRunning) {
-            clearInterval($state.intervalId);
-            $state.isRunning = false;
-            return;
-        }
-        step();
-        $state.intervalId = setInterval(step, 1000);
-        $state.isRunning = true;
-    }
-
-    function on_create_entry() {
-        if (!$state.startTime) return;
-        const plainStartTime = Temporal.PlainDateTime.from($state.startTime);
-        dispatch("create", {
-            from: plainStartTime,
-            to: plainStartTime.add({hours: $state.hours, minutes: $state.minutes, seconds: $state.seconds}),
-            description: $state.note
-        });
-        reset();
-    }
-</script>
-
-<div class="grid">
-    <div class="col-6">
-        <slot name="header"></slot>
-        <pre class="text-xxl padding-y-sm">{timeString}</pre>
-    </div>
-    <div class="col-6 flex align-bottom flex-column text-xs">
-        <Button title="{$state.isRunning ? LL.stopwatch.stop() : LL.stopwatch.start()}"
-                text="{$state.isRunning ? LL.stopwatch.stop() : LL.stopwatch.start()}"
-                variant="link"
-                on:click={on_start_stop}/>
-
-        {#if $state.startTime}
-            <Button title="{LL.stopwatch.reset()}"
-                    text="{LL.stopwatch.reset()}"
-                    variant="link"
-                    class="bg-error-lighter@hover color-white@hover"
-                    on:click={reset}/>
-            {#if !$state.isRunning}
-                <Button title="{LL.stopwatch.roundUp()}"
-                        text="{LL.stopwatch.roundUp()}"
-                        variant="link"
-                        on:click={on_round_up}/>
-                <Button title="{LL.stopwatch.roundDown()}"
-                        text="{LL.stopwatch.roundDown()}"
-                        variant="link"
-                        on:click={on_round_down}/>
-                {#if $state.minutes > 0 || $state.hours > 0}
-                    <Button title="{LL.stopwatch.createEntry()}"
-                            text="{LL.stopwatch.createEntry()}"
-                            variant="link"
-                            on:click={on_create_entry}/>
-                {/if}
-            {/if}
-        {/if}
-    </div>
-</div>
-
-<Textarea class="width-100% margin-top-xs"
-          placeholder="{LL.stopwatch.whatsYourFocus()}"
-          rows="1"
-          bind:value={$state.note}
-/>
diff --git a/old-apps/web-shared/src/components/table/index.ts b/old-apps/web-shared/src/components/table/index.ts
deleted file mode 100644
index 8390c0e..0000000
--- a/old-apps/web-shared/src/components/table/index.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import TablePaginator from "./paginator.svelte";
-import Table from "./table.svelte";
-import THead from "./thead.svelte";
-import TBody from "./tbody.svelte";
-import TCell from "./tcell.svelte";
-import TRow from "./trow.svelte";
-
-export {
-    TablePaginator,
-    Table,
-    THead,
-    TBody,
-    TCell,
-    TRow
-};
diff --git a/old-apps/web-shared/src/components/table/paginator.svelte b/old-apps/web-shared/src/components/table/paginator.svelte
deleted file mode 100644
index 53c6392..0000000
--- a/old-apps/web-shared/src/components/table/paginator.svelte
+++ /dev/null
@@ -1,101 +0,0 @@
-<script>
-	import {createEventDispatcher, onMount} from "svelte";
-	import {restrict_input_to_numbers} from "$shared/lib/helpers";
-
-	const dispatch = createEventDispatcher();
-	export let page = 1;
-	export let pageCount = 1;
-	let prevCount = page;
-	let canIncrement = false;
-	let canDecrement = false;
-	$: canIncrement = page < pageCount;
-	$: canDecrement = page > 1;
-
-	onMount(() => {
-		restrict_input_to_numbers(document.querySelector("#curr-page"));
-	});
-
-	function increment() {
-		if (canIncrement) {
-			page++;
-		}
-	}
-
-	function decrement() {
-		if (canDecrement) {
-			page--;
-		}
-	}
-
-	$: if (page) {
-		handle_change();
-	}
-
-	function handle_change() {
-		if (page === prevCount) {
-			return;
-		}
-		prevCount = page;
-		if (page > pageCount) {
-			page = pageCount;
-		}
-		dispatch("value_change", {
-			newValue: page,
-		});
-	}
-</script>
-
-<nav class="pagination"
-     aria-label="Pagination">
-    <ul class="pagination__list flex flex-wrap gap-xxxs justify-center justify-end@md">
-        <li>
-            <button on:click={decrement}
-                    class="reset pagination__item {canDecrement ? '' : 'c-disabled'}">
-                <svg class="icon icon--xs flip-x"
-                     viewBox="0 0 16 16"
-                ><title>Go to previous page</title>
-                    <polyline
-                            points="6 2 12 8 6 14"
-                            fill="none"
-                            stroke="currentColor"
-                            stroke-linecap="round"
-                            stroke-linejoin="round"
-                            stroke-width="2"
-                    />
-                </svg>
-            </button>
-        </li>
-
-        <li>
-            <span class="pagination__jumper flex items-center">
-                <input
-                        aria-label="Page number"
-                        class="form-control"
-                        id="curr-page"
-                        type="text"
-                        on:change={handle_change}
-                        value={page}
-                />
-                <em>of {pageCount}</em>
-            </span>
-        </li>
-
-        <li>
-            <button on:click={increment}
-                    class="reset pagination__item {canIncrement ? '' : 'c-disabled'}">
-                <svg class="icon icon--xs"
-                     viewBox="0 0 16 16"
-                ><title>Go to next page</title>
-                    <polyline
-                            points="6 2 12 8 6 14"
-                            fill="none"
-                            stroke="currentColor"
-                            stroke-linecap="round"
-                            stroke-linejoin="round"
-                            stroke-width="2"
-                    />
-                </svg>
-            </button>
-        </li>
-    </ul>
-</nav>
diff --git a/old-apps/web-shared/src/components/table/table.svelte b/old-apps/web-shared/src/components/table/table.svelte
deleted file mode 100644
index 4acbf37..0000000
--- a/old-apps/web-shared/src/components/table/table.svelte
+++ /dev/null
@@ -1,3 +0,0 @@
-<table class="int-table {$$restProps.class ?? ''}">
-    <slot/>
-</table>
diff --git a/old-apps/web-shared/src/components/table/tbody.svelte b/old-apps/web-shared/src/components/table/tbody.svelte
deleted file mode 100644
index f0617fa..0000000
--- a/old-apps/web-shared/src/components/table/tbody.svelte
+++ /dev/null
@@ -1,3 +0,0 @@
-<tbody class="int-table__body {$$restProps.class ?? ''}">
-<slot/>
-</tbody>
diff --git a/old-apps/web-shared/src/components/table/tcell.svelte b/old-apps/web-shared/src/components/table/tcell.svelte
deleted file mode 100644
index 76f500f..0000000
--- a/old-apps/web-shared/src/components/table/tcell.svelte
+++ /dev/null
@@ -1,23 +0,0 @@
-<script lang="ts">
-    export let thScope: "row"|"col"|"rowgroup"|"colgroup"|"";
-    export let colspan = "";
-    export let type: "th"|"td" = "td";
-    export let style;
-
-    $: shared_props = {
-        colspan: colspan || null,
-        style: style || null,
-        class: [type === "th" ? "int-table__cell--th" : "", "int-table__cell", $$restProps.class ?? ""].filter(Boolean).join(" "),
-    };
-</script>
-{#if type === "th"}
-    <th {thScope}
-        {...shared_props}>
-        <slot/>
-    </th>
-{/if}
-{#if type === "td"}
-    <td {...shared_props}>
-        <slot/>
-    </td>
-{/if}
diff --git a/old-apps/web-shared/src/components/table/thead.svelte b/old-apps/web-shared/src/components/table/thead.svelte
deleted file mode 100644
index aa20bf0..0000000
--- a/old-apps/web-shared/src/components/table/thead.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script lang="ts">
-    import TRow from "./trow.svelte";
-</script>
-
-
-<thead class="int-table__header {$$restProps.class ?? ''}">
-<TRow>
-    <slot/>
-</TRow>
-</thead>
diff --git a/old-apps/web-shared/src/components/table/trow.svelte b/old-apps/web-shared/src/components/table/trow.svelte
deleted file mode 100644
index 35b34bb..0000000
--- a/old-apps/web-shared/src/components/table/trow.svelte
+++ /dev/null
@@ -1,6 +0,0 @@
-<script>
-    export let dataId;
-</script>
-<tr class="int-table__row {$$restProps.class ?? ''}" data-id={dataId}>
-    <slot/>
-</tr>
diff --git a/old-apps/web-shared/src/components/theme-switcher-icon.svelte b/old-apps/web-shared/src/components/theme-switcher-icon.svelte
deleted file mode 100644
index 1531ab2..0000000
--- a/old-apps/web-shared/src/components/theme-switcher-icon.svelte
+++ /dev/null
@@ -1,248 +0,0 @@
-<script>
-    export let show = false;
-	export let selection = "";
-</script>
-
-<div class="ld-switch flex"
-     data-theme-switcher-element>
-    <button class="reset ld-switch-btn"
-            on:click={() => show =!show}>
-        <span class="sr-only">{selection}</span>
-        <div class="ld-switch-btn__icon-wrapper ld-switch-btn__icon-wrapper--in"
-             aria-hidden="true">
-            {#if selection === "dark"}
-                <svg class="icon ld-switch-btn__icon"
-                     viewBox="0 0 20 20">
-                    <title>dark</title>
-                    <g fill="currentColor">
-                        <path d="M11.964 3.284c.021.237.036.474.036.716a8 8 0 0 1-8 8c-.242 0-.479-.015-.716-.036a7 7 0 1 0 8.68-8.68z"
-                              fill-opacity=".2"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"></path>
-                        <path d="M7 4a.979.979 0 0 1-1-1 1 1 0 0 0-2 0 .979.979 0 0 1-1 1 1 1 0 0 0 0 2 .979.979 0 0 1 1 1 1 1 0 0 0 2 0 .979.979 0 0 1 1-1 1 1 0 0 0 0-2z"></path>
-                    </g>
-                </svg>
-            {:else if selection === "light"}
-                <svg class="icon ld-switch-btn__icon"
-                     viewBox="0 0 20 20"><title>light</title>
-                    <g fill="currentColor">
-                        <circle cx="10"
-                                cy="10"
-                                r="4"
-                                fill-opacity=".2"
-                                stroke="currentColor"
-                                stroke-linecap="round"
-                                stroke-linejoin="round"
-                                stroke-width="2"></circle>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M10 1v1.5"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M16.364 3.636l-1.061 1.061"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M19 10h-1.5"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M16.364 16.364l-1.061-1.061"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M10 19v-1.5"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M3.636 16.364l1.061-1.061"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M1 10h1.5"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M3.636 3.636l1.061 1.061"></path>
-                    </g>
-                </svg>
-            {:else }
-                <svg class="icon ld-switch-btn__icon"
-                     viewBox="0 0 20 20"><title>light-auto</title>
-                    <g fill="currentColor">
-                        <path d="M10 14a4 4 0 1 1 3.465-6"
-                              fill-opacity=".2"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M12 18l2.5-7h1l2.5 7"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M12.714 16h4.572"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M10 1v1.5"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M16.364 3.636l-1.061 1.061"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M3.636 16.364l1.061-1.061"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M1 10h1.5"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M3.636 3.636l1.061 1.061"></path>
-                    </g>
-                </svg>
-            {/if}
-        </div>
-
-        <div class="ld-switch-btn__icon-wrapper js-ld-switch-icon"
-             aria-hidden="true">
-            {#if selection === "dark"}
-                <svg class="icon ld-switch-btn__icon"
-                     viewBox="0 0 20 20">
-                    <title>dark</title>
-                    <g fill="currentColor">
-                        <path d="M11.964 3.284c.021.237.036.474.036.716a8 8 0 0 1-8 8c-.242 0-.479-.015-.716-.036a7 7 0 1 0 8.68-8.68z"
-                              fill-opacity=".2"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"></path>
-                        <path d="M7 4a.979.979 0 0 1-1-1 1 1 0 0 0-2 0 .979.979 0 0 1-1 1 1 1 0 0 0 0 2 .979.979 0 0 1 1 1 1 1 0 0 0 2 0 .979.979 0 0 1 1-1 1 1 0 0 0 0-2z"></path>
-                    </g>
-                </svg>
-            {:else if selection === "light"}
-                <svg class="icon ld-switch-btn__icon"
-                     viewBox="0 0 20 20">
-                    <title>light-auto</title>
-                    <g fill="currentColor">
-                        <path d="M10 14a4 4 0 1 1 3.465-6"
-                              fill-opacity=".2"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M12 18l2.5-7h1l2.5 7"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M12.714 16h4.572"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M10 1v1.5"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M16.364 3.636l-1.061 1.061"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M3.636 16.364l1.061-1.061"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M1 10h1.5"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M3.636 3.636l1.061 1.061"></path>
-                    </g>
-                </svg>
-            {:else }
-                <svg class="icon ld-switch-btn__icon"
-                     viewBox="0 0 20 20">
-                    <title>dark-auto</title>
-                    <g fill="currentColor">
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M12 18l2.5-7h1l2.5 7"></path>
-                        <path fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"
-                              d="M12.714 16h4.572"></path>
-                        <path d="M12.146 10.159A2.5 2.5 0 0 1 14.5 8.5h1a2.5 2.5 0 0 1 1.412.441 7 7 0 0 0-4.948-5.657c.021.237.036.474.036.716a8 8 0 0 1-8 8c-.242 0-.479-.015-.716-.036a6.99 6.99 0 0 0 6.427 5.012z"
-                              fill-opacity=".2"></path>
-                        <path d="M16.71 8a7.015 7.015 0 0 0-4.746-4.716c.021.237.036.474.036.716a8 8 0 0 1-8 8c-.242 0-.479-.015-.716-.036A7.006 7.006 0 0 0 9 16.929"
-                              fill="none"
-                              stroke="currentColor"
-                              stroke-linecap="round"
-                              stroke-linejoin="round"
-                              stroke-width="2"></path>
-                        <path d="M7 4a.979.979 0 0 1-1-1 1 1 0 0 0-2 0 .979.979 0 0 1-1 1 1 1 0 0 0 0 2 .979.979 0 0 1 1 1 1 1 0 0 0 2 0 .979.979 0 0 1 1-1 1 1 0 0 0 0-2z"></path>
-                    </g>
-                </svg>
-            {/if}
-        </div>
-    </button>
-</div>
diff --git a/old-apps/web-shared/src/components/theme-switcher.svelte b/old-apps/web-shared/src/components/theme-switcher.svelte
deleted file mode 100644
index 6f86875..0000000
--- a/old-apps/web-shared/src/components/theme-switcher.svelte
+++ /dev/null
@@ -1,215 +0,0 @@
-<script lang="ts">
-    import {base_domain, CookieNames} from "$shared/lib/configuration";
-    import {get_cookie, set_cookie} from "$shared/lib/helpers";
-    import {onMount} from "svelte";
-
-    type theme = "system"|"dark"|"light";
-
-    export let show = false;
-    export let glow = false;
-    export let selection: theme = "system";
-    export let size;
-    let prefers = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-    onMount(() => {
-        selection = get_cookie(CookieNames.theme) as theme;
-        document.addEventListener("keydown", (e) => {
-            if (e.code === "Escape") show = false;
-        });
-        document.addEventListener("click", (e: any) => {
-            if (e.target.closest("[data-theme-switcher-element]") === null) show = false;
-        });
-    });
-    let html = document.querySelector("html");
-
-    window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", (event) => {
-        prefers = event.matches ? "dark" : "light";
-    });
-
-    $: switch (selection || prefers) {
-        case "system":
-            html.dataset.theme = prefers;
-            break;
-        case "light":
-            html.dataset.theme = "light";
-            break;
-        case "dark":
-            html.dataset.theme = "dark";
-            break;
-    }
-
-    function change(to: theme) {
-        selection = to;
-        set_cookie(CookieNames.theme, selection, base_domain());
-    }
-</script>
-
-<div class="bg-light padding-x-xs padding-bottom-xs padding-top-xxxs radius-md {glow ? 'inner-glow shadow-xs' : ''}"
-     class:is-hidden={!show}
-     data-theme-switcher-element
-     role="listbox">
-    <div class="flex flex-wrap flex-column"
-         role="group">
-        <div class="margin-bottom-xs flex-grow">
-            <span class="text-xs color-contrast-medium">Appearance</span>
-        </div>
-        <div class="flex gap-xs flex-row">
-            <div class="ld-switch-popover__option"
-                 aria-selected="{selection === 'dark' ? 'true' : 'false'}"
-                 role="option">
-                <figure class="radius-md inner-glow"
-                        on:click={() => change("dark")}>
-                    <svg id="Layer_1"
-                         class="block radius-inherit"
-                         data-name="Layer 1"
-                         xmlns="http://www.w3.org/2000/svg"
-                         width="70"
-                         height="50"
-                         viewBox="0 0 70 50">
-                        <rect width="70"
-                              height="50"
-                              fill="#22232a"/>
-                        <path d="M14,10H70V50H10V14A4,4,0,0,1,14,10Z"
-                              fill="#5a5c63"/>
-                        <circle cx="18"
-                                cy="18"
-                                r="3"
-                                fill="#22232a"/>
-                        <circle cx="27"
-                                cy="18"
-                                r="3"
-                                fill="#22232a"/>
-                        <circle cx="36"
-                                cy="18"
-                                r="3"
-                                fill="#22232a"/>
-                        <rect x="17"
-                              y="28"
-                              width="46"
-                              height="3"
-                              rx="1"
-                              fill="#fafaff"/>
-                        <rect x="17"
-                              y="34"
-                              width="46"
-                              height="3"
-                              rx="1"
-                              fill="#fafaff"/>
-                        <rect x="17"
-                              y="40"
-                              width="30"
-                              height="3"
-                              rx="1"
-                              fill="#fafaff"/>
-                    </svg>
-                </figure>
-                <div class="text-xs margin-top-xxxs padding-x-xxxxs">Dark</div>
-            </div>
-            <div class="ld-switch-popover__option"
-                 aria-selected="{selection === 'light' ? 'true' : 'false'}"
-                 role="option">
-                <figure class="radius-md inner-glow"
-                        on:click={() => change("light")}>
-                    <svg id="Layer_1"
-                         class="block radius-inherit"
-                         data-name="Layer 1"
-                         xmlns="http://www.w3.org/2000/svg"
-                         width="70"
-                         height="50"
-                         viewBox="0 0 70 50">
-                        <rect width="70"
-                              height="50"
-                              fill="#e5e5e6"/>
-                        <path d="M14,10H70a0,0,0,0,1,0,0V50a0,0,0,0,1,0,0H10a0,0,0,0,1,0,0V14A4,4,0,0,1,14,10Z"
-                              fill="#fff"/>
-                        <circle cx="18"
-                                cy="18"
-                                r="3"
-                                fill="#e5e5e6"/>
-                        <circle cx="27"
-                                cy="18"
-                                r="3"
-                                fill="#e5e5e6"/>
-                        <circle cx="36"
-                                cy="18"
-                                r="3"
-                                fill="#e5e5e6"/>
-                        <rect x="17"
-                              y="28"
-                              width="46"
-                              height="3"
-                              rx="1"
-                              fill="#38393e"/>
-                        <rect x="17"
-                              y="34"
-                              width="46"
-                              height="3"
-                              rx="1"
-                              fill="#38393e"/>
-                        <rect x="17"
-                              y="40"
-                              width="30"
-                              height="3"
-                              rx="1"
-                              fill="#38393e"/>
-                    </svg>
-                </figure>
-                <div class="text-xs margin-top-xxxs padding-x-xxxxs">Light</div>
-            </div>
-            <div class="ld-switch-popover__option"
-                 aria-selected="{selection === 'system' ? 'true' : 'false'}"
-                 role="option">
-                <figure class="radius-md inner-glow"
-                        on:click={() => change("system")}>
-                    <svg id="Layer_1"
-                         data-name="Layer 1"
-                         xmlns="http://www.w3.org/2000/svg"
-                         class="block radius-inherit"
-                         width="70"
-                         height="50"
-                         viewBox="0 0 70 50">
-                        <rect width="35"
-                              height="50"
-                              fill="#e5e5e6"/>
-                        <path d="M14,10H35a0,0,0,0,1,0,0V50a0,0,0,0,1,0,0H10a0,0,0,0,1,0,0V14A4,4,0,0,1,14,10Z"
-                              fill="#fff"/>
-                        <circle cx="18"
-                                cy="18"
-                                r="3"
-                                fill="#e5e5e6"/>
-                        <circle cx="27"
-                                cy="18"
-                                r="3"
-                                fill="#e5e5e6"/>
-                        <path d="M18,28H35a0,0,0,0,1,0,0v3a0,0,0,0,1,0,0H18a1,1,0,0,1-1-1V29A1,1,0,0,1,18,28Z"
-                              fill="#38393e"/>
-                        <path d="M18,34H35a0,0,0,0,1,0,0v3a0,0,0,0,1,0,0H18a1,1,0,0,1-1-1V35A1,1,0,0,1,18,34Z"
-                              fill="#38393e"/>
-                        <path d="M18,40H35a0,0,0,0,1,0,0v3a0,0,0,0,1,0,0H18a1,1,0,0,1-1-1V41A1,1,0,0,1,18,40Z"
-                              fill="#38393e"/>
-                        <rect x="35"
-                              width="35"
-                              height="50"
-                              fill="#22232a"/>
-                        <path d="M49,10H70V50H45V14A4,4,0,0,1,49,10Z"
-                              fill="#5a5c63"/>
-                        <circle cx="53"
-                                cy="18"
-                                r="3"
-                                fill="#22232a"/>
-                        <circle cx="62"
-                                cy="18"
-                                r="3"
-                                fill="#22232a"/>
-                        <path d="M53,28H70a0,0,0,0,1,0,0v3a0,0,0,0,1,0,0H53a1,1,0,0,1-1-1V29A1,1,0,0,1,53,28Z"
-                              fill="#fafaff"/>
-                        <path d="M53,34H70a0,0,0,0,1,0,0v3a0,0,0,0,1,0,0H53a1,1,0,0,1-1-1V35A1,1,0,0,1,53,34Z"
-                              fill="#fafaff"/>
-                        <path d="M53,40H70a0,0,0,0,1,0,0v3a0,0,0,0,1,0,0H53a1,1,0,0,1-1-1V41A1,1,0,0,1,53,40Z"
-                              fill="#fafaff"/>
-                    </svg>
-                </figure>
-                <div class="text-xs margin-top-xxxs padding-x-xxxxs">System</div>
-            </div>
-        </div>
-    </div>
-</div>
diff --git a/old-apps/web-shared/src/components/tile.svelte b/old-apps/web-shared/src/components/tile.svelte
deleted file mode 100644
index b8e9cdf..0000000
--- a/old-apps/web-shared/src/components/tile.svelte
+++ /dev/null
@@ -1,4 +0,0 @@
-<section class="bg-light radius-sm padding-sm inner-glow shadow-xs {$$restProps.class??''}"
-         style="height: fit-content;">
-    <slot/>
-</section>
diff --git a/old-apps/web-shared/src/components/user-menu.svelte b/old-apps/web-shared/src/components/user-menu.svelte
deleted file mode 100644
index c0195f4..0000000
--- a/old-apps/web-shared/src/components/user-menu.svelte
+++ /dev/null
@@ -1,99 +0,0 @@
-<script>
-	import {onMount} from "svelte";
-	import {Menu, MenuItem, MenuItemSeparator} from "./menu";
-
-	let userMenuTrigger;
-	let showUserMenu = false;
-	
-	export let avatar = "";
-	export let name;
-	export let secondary = "";
-	let userMenuId;
-	
-	onMount(() => {
-		userMenuTrigger = document.getElementById("open-user-menu");
-	});
-</script>
-
-<button class="reset user-menu-control"
-        id="open-user-menu"
-        aria-controls="{userMenuId}"
-        on:click={() => showUserMenu = true}>
-    {#if avatar}
-        <figure class="user-menu-control__img-wrapper radius-50%">
-            <img class="user-menu-control__img"
-                 src="{avatar}"
-                 alt="User picture">
-        </figure>
-    {/if}
-
-    <div class="margin-x-xs user-menu__meta">
-        <p class="user-menu__meta-title text-sm line-height-1 padding-y-xxxxs font-semibold color-contrast-higher text-truncate">{name}</p>
-        {#if secondary}
-            <p class="text-xs color-contrast-medium line-height-1 padding-bottom-xxxxs">{secondary}</p>
-        {/if}
-    </div>
-
-    <svg class="icon icon--xxs"
-         aria-hidden="true"
-         viewBox="0 0 12 12">
-        <polyline points="1 4 6 9 11 4"
-                  fill="none"
-                  stroke="currentColor"
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  stroke-width="2"/>
-    </svg>
-</button>
-
-<Menu trigger={userMenuTrigger}
-      bind:id={userMenuId}
-      bind:show="{showUserMenu}">
-    <div slot="options">
-        <MenuItem>
-            <svg class="icon menu__icon"
-                 aria-hidden="true"
-                 viewBox="0 0 16 16">
-                <circle cx="8"
-                        cy="3.5"
-                        r="3.5"/>
-                <path d="M14.747,14.15a6.995,6.995,0,0,0-13.494,0A1.428,1.428,0,0,0,1.5,15.4a1.531,1.531,0,0,0,1.209.6H13.288a1.531,1.531,0,0,0,1.209-.6A1.428,1.428,0,0,0,14.747,14.15Z"/>
-            </svg>
-            <span>Profile</span>
-
-        </MenuItem>
-
-        <MenuItem>
-            <svg class="icon menu__icon"
-                 aria-hidden="true"
-                 viewBox="0 0 16 16">
-                <g fill="currentColor">
-                    <path d="M15.135,6.784c-1.303-0.326-1.921-1.818-1.23-2.969c0.322-0.536,0.225-0.998-0.094-1.316l-0.31-0.31 c-0.318-0.318-0.78-0.415-1.316-0.094c-1.152,0.691-2.644,0.073-2.969-1.23C9.065,0.258,8.669,0,8.219,0H7.781 c-0.45,0-0.845,0.258-0.997,0.865c-0.326,1.303-1.818,1.921-2.969,1.23C3.279,1.773,2.816,1.87,2.498,2.188l-0.31,0.31 C1.87,2.816,1.773,3.279,2.095,3.815c0.691,1.152,0.073,2.644-1.23,2.969C0.26,6.935,0,7.33,0,7.781v0.438 c0,0.45,0.258,0.845,0.865,0.997c1.303,0.326,1.921,1.818,1.23,2.969c-0.322,0.536-0.225,0.998,0.094,1.316l0.31,0.31 c0.319,0.319,0.782,0.415,1.316,0.094c1.152-0.691,2.644-0.073,2.969,1.23C6.935,15.742,7.331,16,7.781,16h0.438 c0.45,0,0.845-0.258,0.997-0.865c0.326-1.303,1.818-1.921,2.969-1.23c0.535,0.321,0.997,0.225,1.316-0.094l0.31-0.31 c0.318-0.318,0.415-0.78,0.094-1.316c-0.691-1.152-0.073-2.644,1.23-2.969C15.742,9.065,16,8.669,16,8.219V7.781 C16,7.33,15.74,6.935,15.135,6.784z M8,11c-1.657,0-3-1.343-3-3s1.343-3,3-3s3,1.343,3,3S9.657,11,8,11z"></path>
-                </g>
-            </svg>
-            <span>Settings</span>
-        </MenuItem>
-
-        <MenuItem>
-            <svg class="icon menu__icon"
-                 aria-hidden="true"
-                 viewBox="0 0 16 16">
-                <circle cx="10.5"
-                        cy="2.5"
-                        r="2.5"/>
-                <circle cx="5.5"
-                        cy="6.5"
-                        r="2.5"/>
-                <path d="M15.826,10.124A5.455,5.455,0,0,0,9.46,6.107,3.932,3.932,0,0,1,9.5,6.5,3.97,3.97,0,0,1,8.452,9.176,6.963,6.963,0,0,1,11.539,12h2.829a1.5,1.5,0,0,0,1.458-1.876Z"/>
-                <path d="M10.826,14.124a5.5,5.5,0,0,0-10.652,0A1.5,1.5,0,0,0,1.632,16H9.368a1.5,1.5,0,0,0,1.458-1.876Z"/>
-            </svg>
-            <span>Team</span>
-        </MenuItem>
-
-        <MenuItemSeparator/>
-
-        <MenuItem danger="true" on:click={() => logout_user()}>
-            Logout
-        </MenuItem>
-    </div>
-</Menu>
-- 
cgit v1.3