diff --git a/.dockerignore b/.dockerignore index c5292ac..5c8545a 100644 --- a/.dockerignore +++ b/.dockerignore @@ -2,3 +2,4 @@ uploads node_modules private devdocker +.env* diff --git a/src/app.css b/src/app.css index 8841df8..43bbd6b 100644 --- a/src/app.css +++ b/src/app.css @@ -57,3 +57,18 @@ a[target='_blank']::after { margin-left: 2px; vertical-align: top; } + +.visually-hidden { + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border: 0; + + &:not(caption) { + position: absolute; + } +} diff --git a/src/lib/components/ThemeButton.svelte b/src/lib/components/ThemeButton.svelte index 1a24c8b..6f9eb42 100644 --- a/src/lib/components/ThemeButton.svelte +++ b/src/lib/components/ThemeButton.svelte @@ -1,12 +1,16 @@ + {$t(`common.theme.${nextMode}`)} diff --git a/src/lib/components/icons/Icon.svelte b/src/lib/components/icons/Icon.svelte index 455fe57..06021d6 100644 --- a/src/lib/components/icons/Icon.svelte +++ b/src/lib/components/icons/Icon.svelte @@ -4,7 +4,7 @@ $: iconComponent = import(`./svg/${icon}.svelte`); - + {#await iconComponent then { default: component }} {/await} diff --git a/src/lib/i18n/en/common.json b/src/lib/i18n/en/common.json index b7f88a3..de54319 100644 --- a/src/lib/i18n/en/common.json +++ b/src/lib/i18n/en/common.json @@ -17,5 +17,9 @@ "available": "Available", "current": "Current", "remove": "Remove", - "filter": "Filter" + "filter": "Filter", + "theme": { + "light": "Light mode", + "dark": "Dark mode" + } } diff --git a/src/lib/theme-mode.ts b/src/lib/theme-mode.ts index 002d154..d631501 100644 --- a/src/lib/theme-mode.ts +++ b/src/lib/theme-mode.ts @@ -17,11 +17,10 @@ export const themeMode = writable('light', (set) => { return () => uaTheme?.removeEventListener('change', uaThemeCallback); }); -export const useThemeMode = () => { +export const useThemeMode = () => onMount(() => themeMode.subscribe((value) => document.documentElement.setAttribute('theme-base', value)) ); -}; export const setThemeMode = (mode: ThemeModeType) => { if (!browser) return; diff --git a/src/routes/account/authorizations/+page.svelte b/src/routes/account/authorizations/+page.svelte index 0cbd678..424e35f 100644 --- a/src/routes/account/authorizations/+page.svelte +++ b/src/routes/account/authorizations/+page.svelte @@ -31,8 +31,7 @@ {#each data.items as client} - - + {client.title}