Use the browser's preferred language if available
This commit is contained in:
parent
36bd59ef02
commit
dd3b797ec2
3 changed files with 22 additions and 1 deletions
|
@ -17,6 +17,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||
### Added
|
||||
- Possibility to set a default account
|
||||
- Dark mode
|
||||
- Use the browser's preferred language if available
|
||||
|
||||
### Changed
|
||||
- The style has been entirely reworked using Bootstrap instead of Bulma
|
||||
|
|
19
src/locales_utils.js
Normal file
19
src/locales_utils.js
Normal file
|
@ -0,0 +1,19 @@
|
|||
import { allowedLocales } from './const';
|
||||
|
||||
const fallBackValue = 'en';
|
||||
|
||||
const getShortLanguageCode = (language) => {
|
||||
language = language.split('-')[0];
|
||||
language = language.split('_')[0];
|
||||
return language;
|
||||
};
|
||||
|
||||
export const getDefaultLocale = () => {
|
||||
for (const lang of navigator.languages) {
|
||||
const lang_short = getShortLanguageCode(lang);
|
||||
if (allowedLocales.includes(lang_short)) {
|
||||
return lang_short;
|
||||
}
|
||||
}
|
||||
return fallBackValue;
|
||||
};
|
|
@ -1,6 +1,7 @@
|
|||
import './assets/main.sass';
|
||||
|
||||
import { allowedColorModes, allowedLocales } from './const';
|
||||
import { getDefaultLocale } from './locales_utils';
|
||||
import { createApp } from 'vue';
|
||||
import { createI18n } from 'vue-i18n';
|
||||
import { useStorage } from '@vueuse/core';
|
||||
|
@ -22,7 +23,7 @@ const setGlobalAttribute = (attrName, storageName, defaultValue, allowedValues)
|
|||
'defaultValue': defaultValue,
|
||||
};
|
||||
};
|
||||
const locale = setGlobalAttribute('lang', 'sake-locale', 'en', allowedLocales);
|
||||
const locale = setGlobalAttribute('lang', 'sake-locale', getDefaultLocale(), allowedLocales);
|
||||
const colorMode = setGlobalAttribute('data-bs-theme', 'sake-color-mode', 'light', allowedColorModes);
|
||||
|
||||
const i18n = createI18n({
|
||||
|
|
Loading…
Reference in a new issue