diff --git a/packages/theme/src/Theme.svelte b/packages/theme/src/Theme.svelte index 936823c0a7..806b6380a0 100644 --- a/packages/theme/src/Theme.svelte +++ b/packages/theme/src/Theme.svelte @@ -18,8 +18,10 @@ const getCurrentTheme = (): string => localStorage.getItem('theme') ?? 'theme-dark' const getCurrnetFontSize = (): string => localStorage.getItem('fontsize') ?? 'normal-font' + const getCurrnetLanguage = (): string => localStorage.getItem('lang') ?? 'en' const currentTheme = getCurrentTheme() const currentFontSize = getCurrnetFontSize() + const currentLanguage = getCurrnetLanguage() const setRootColors = (theme: string) => { document.documentElement.setAttribute('class', `${theme} ${getCurrnetFontSize()}`) @@ -42,6 +44,12 @@ localStorage.setItem('fontsize', fontsize) } }) + setContext('lang', { + currentLanguage: currentLanguage, + setLanguage: (lang: string) => { + localStorage.setItem('lang', lang) + } + }) onMount(() => { setRootColors(currentTheme) diff --git a/packages/ui/src/components/internal/LangPopup.svelte b/packages/ui/src/components/internal/LangPopup.svelte new file mode 100644 index 0000000000..f1af14f8bc --- /dev/null +++ b/packages/ui/src/components/internal/LangPopup.svelte @@ -0,0 +1,63 @@ + + + + + + + diff --git a/packages/ui/src/components/internal/LangSelector.svelte b/packages/ui/src/components/internal/LangSelector.svelte new file mode 100644 index 0000000000..831b1a3834 --- /dev/null +++ b/packages/ui/src/components/internal/LangSelector.svelte @@ -0,0 +1,46 @@ + + + + +{#if selected} +
+ +
+{/if} diff --git a/packages/ui/src/components/internal/Root.svelte b/packages/ui/src/components/internal/Root.svelte index 17561a5037..b403f8c519 100644 --- a/packages/ui/src/components/internal/Root.svelte +++ b/packages/ui/src/components/internal/Root.svelte @@ -15,6 +15,7 @@ import WiFi from './icons/WiFi.svelte' import ThemeSelector from './ThemeSelector.svelte' import FontSizeSelector from './FontSizeSelector.svelte' + import LangSelector from './LangSelector.svelte' let application: AnyComponent | undefined @@ -42,6 +43,9 @@
+
+ +
diff --git a/packages/ui/src/components/internal/flags/english.svelte b/packages/ui/src/components/internal/flags/english.svelte new file mode 100644 index 0000000000..f4c0134d4a --- /dev/null +++ b/packages/ui/src/components/internal/flags/english.svelte @@ -0,0 +1,40 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/ui/src/components/internal/flags/russia.svelte b/packages/ui/src/components/internal/flags/russia.svelte new file mode 100644 index 0000000000..47df98a06b --- /dev/null +++ b/packages/ui/src/components/internal/flags/russia.svelte @@ -0,0 +1,25 @@ + + + + + + + + +