m/umami
1
0
Fork 0
mirror of https://github.com/kremalicious/umami.git synced 2024-12-18 15:23:38 +01:00
Code Issues Packages Projects Releases Wiki Activity

Updated language menu.

Browse Source
This commit is contained in:
Mike Cao 2020-10-02 12:15:42 -07:00
parent dd651e3c77
commit 561491c2aa
6 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
components/common/Menu.module.css
View File

@ -1,4 +1,5 @@
.menu { .menu {
background: var(--gray50);
border: 1px solid var(--gray500); border: 1px solid var(--gray500);
border-radius: 4px; border-radius: 4px;
overflow: hidden; overflow: hidden;

3
components/common/MenuButton.js
View File

@ -9,6 +9,7 @@ export default function MenuButton({
icon, icon,
value, value,
options, options,
menuClassname,
menuPosition = 'bottom', menuPosition = 'bottom',
menuAlign = 'right', menuAlign = 'right',
onSelect, onSelect,
@ -45,7 +46,7 @@ export default function MenuButton({
</Button> </Button>
{showMenu && ( {showMenu && (
<Menu <Menu
className={styles.menu} className={classNames(styles.menu, menuClassname)}
options={options} options={options}
selectedOption={selectedOption} selectedOption={selectedOption}
onSelect={handleSelect} onSelect={handleSelect}

2
components/settings/LanguageButton.js
View File

@ -4,6 +4,7 @@ import { menuOptions } from 'lib/lang';
import useLocale from 'hooks/useLocale'; import useLocale from 'hooks/useLocale';
import MenuButton from 'components/common/MenuButton'; import MenuButton from 'components/common/MenuButton';
import Globe from 'assets/globe.svg'; import Globe from 'assets/globe.svg';
import styles from './LanguageButton.module.css';
export default function LanguageButton() { export default function LanguageButton() {
const [locale, setLocale] = useLocale(); const [locale, setLocale] = useLocale();
@ -32,6 +33,7 @@ export default function LanguageButton() {
icon={<Globe />} icon={<Globe />}
options={menuOptions} options={menuOptions}
value={locale} value={locale}
menuClassname={styles.menu}
renderValue={option => option?.display} renderValue={option => option?.display}
onSelect={handleSelect} onSelect={handleSelect}
/> />

12
components/settings/LanguageButton.module.css Normal file
View File

@ -0,0 +1,12 @@
.menu {
display: flex;
flex-flow: row wrap;
min-width: 500px;
max-width: 100vw;
padding: 10px;
}
.menu div {
border-radius: 5px;
min-width: 33%;
}

2
lib/lang.js
View File

@ -59,10 +59,10 @@ export const dateLocales = {
}; };
export const menuOptions = [ export const menuOptions = [
{ label: 'English', value: 'en-US', display: 'en' },
{ label: '中文', value: 'zh-CN', display: 'cn' }, { label: '中文', value: 'zh-CN', display: 'cn' },
{ label: 'Dansk', value: 'da-DK', display: 'da' }, { label: 'Dansk', value: 'da-DK', display: 'da' },
{ label: 'Deutsch', value: 'de-DE', display: 'de' }, { label: 'Deutsch', value: 'de-DE', display: 'de' },
{ label: 'English', value: 'en-US', display: 'en' },
{ label: 'Español', value: 'es-MX', display: 'es' }, { label: 'Español', value: 'es-MX', display: 'es' },
{ label: 'Føroyskt', value: 'fo-FO', display: 'fo' }, { label: 'Føroyskt', value: 'fo-FO', display: 'fo' },
{ label: 'Français', value: 'fr-FR', display: 'fr' }, { label: 'Français', value: 'fr-FR', display: 'fr' },

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "umami", "name": "umami",
"version": "0.70.0", "version": "0.71.0",
"description": "A simple, fast, website analytics alternative to Google Analytics. ", "description": "A simple, fast, website analytics alternative to Google Analytics. ",
"author": "Mike Cao <mike@mikecao.com>", "author": "Mike Cao <mike@mikecao.com>",
"license": "MIT", "license": "MIT",