aboutsummaryrefslogtreecommitdiffstats
path: root/old-apps/web-shared/src/components/locale-switcher.svelte
diff options
context:
space:
mode:
authorivarlovlie <git@ivarlovlie.no>2022-09-20 09:24:27 +0200
committerivarlovlie <git@ivarlovlie.no>2022-09-20 09:24:27 +0200
commita9072370ca1eb9a5cce928b1d487db0f307edea6 (patch)
tree59c3c23df930a8b5f888dc7813923abf4ceefed4 /old-apps/web-shared/src/components/locale-switcher.svelte
parent56fa963a1d63cbe0bf28e29e717cceaa417c45c1 (diff)
downloadgreatoffice-a9072370ca1eb9a5cce928b1d487db0f307edea6.tar.xz
greatoffice-a9072370ca1eb9a5cce928b1d487db0f307edea6.zip
feat: Move old apps into it's own directory
Diffstat (limited to 'old-apps/web-shared/src/components/locale-switcher.svelte')
-rw-r--r--old-apps/web-shared/src/components/locale-switcher.svelte62
1 files changed, 62 insertions, 0 deletions
diff --git a/old-apps/web-shared/src/components/locale-switcher.svelte b/old-apps/web-shared/src/components/locale-switcher.svelte
new file mode 100644
index 0000000..5399247
--- /dev/null
+++ b/old-apps/web-shared/src/components/locale-switcher.svelte
@@ -0,0 +1,62 @@
+<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>