diff options
| author | ivarlovlie <git@ivarlovlie.no> | 2022-09-20 09:24:27 +0200 |
|---|---|---|
| committer | ivarlovlie <git@ivarlovlie.no> | 2022-09-20 09:24:27 +0200 |
| commit | a9072370ca1eb9a5cce928b1d487db0f307edea6 (patch) | |
| tree | 59c3c23df930a8b5f888dc7813923abf4ceefed4 /old-apps/web-shared/src/components/locale-switcher.svelte | |
| parent | 56fa963a1d63cbe0bf28e29e717cceaa417c45c1 (diff) | |
| download | greatoffice-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.svelte | 62 |
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> |
