mirror of
https://github.com/iib0011/omni-tools.git
synced 2025-11-10 18:19:52 +05:30
Displayed flags next to the language in language selector
This commit is contained in:
parent
2f9947d851
commit
a0a798143c
1 changed files with 19 additions and 12 deletions
|
|
@ -16,7 +16,8 @@ import {
|
||||||
Stack,
|
Stack,
|
||||||
Select,
|
Select,
|
||||||
MenuItem,
|
MenuItem,
|
||||||
FormControl
|
FormControl,
|
||||||
|
Typography
|
||||||
} from '@mui/material';
|
} from '@mui/material';
|
||||||
import useMediaQuery from '@mui/material/useMediaQuery';
|
import useMediaQuery from '@mui/material/useMediaQuery';
|
||||||
import { useTheme } from '@mui/material/styles';
|
import { useTheme } from '@mui/material/styles';
|
||||||
|
|
@ -29,16 +30,16 @@ interface NavbarProps {
|
||||||
onChangeMode: () => void;
|
onChangeMode: () => void;
|
||||||
}
|
}
|
||||||
const languages = [
|
const languages = [
|
||||||
{ code: 'en', label: 'English' },
|
{ code: 'en', label: 'English', flag: 'circle-flags:lang-en' },
|
||||||
{ code: 'de', label: 'Deutsch' },
|
{ code: 'de', label: 'Deutsch', flag: 'circle-flags:lang-de' },
|
||||||
{ code: 'es', label: 'Español' },
|
{ code: 'es', label: 'Español', flag: 'circle-flags:lang-es' },
|
||||||
{ code: 'fr', label: 'Français' },
|
{ code: 'fr', label: 'Français', flag: 'circle-flags:lang-fr' },
|
||||||
{ code: 'pt', label: 'Português' },
|
{ code: 'pt', label: 'Português', flag: 'circle-flags:lang-pt' },
|
||||||
{ code: 'ja', label: '日本語' },
|
{ code: 'ja', label: '日本語', flag: 'circle-flags:lang-ja' },
|
||||||
{ code: 'hi', label: 'हिंदी' },
|
{ code: 'hi', label: 'हिंदी', flag: 'circle-flags:lang-hi' },
|
||||||
{ code: 'nl', label: 'Nederlands' },
|
{ code: 'nl', label: 'Nederlands', flag: 'circle-flags:lang-nl' },
|
||||||
{ code: 'ru', label: 'Русский' },
|
{ code: 'ru', label: 'Русский', flag: 'circle-flags:lang-ru' },
|
||||||
{ code: 'zh', label: '中文' }
|
{ code: 'zh', label: '中文', flag: 'circle-flags:lang-zh' }
|
||||||
];
|
];
|
||||||
|
|
||||||
const Navbar: React.FC<NavbarProps> = ({
|
const Navbar: React.FC<NavbarProps> = ({
|
||||||
|
|
@ -89,7 +90,10 @@ const Navbar: React.FC<NavbarProps> = ({
|
||||||
>
|
>
|
||||||
{languages.map((lang) => (
|
{languages.map((lang) => (
|
||||||
<MenuItem key={lang.code} value={lang.code}>
|
<MenuItem key={lang.code} value={lang.code}>
|
||||||
{lang.label}
|
<Stack direction="row" alignItems="center" spacing={1}>
|
||||||
|
<Icon key={lang.code} icon={lang.flag} fontSize={30} />
|
||||||
|
<Typography>{lang.label}</Typography>
|
||||||
|
</Stack>
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
))}
|
))}
|
||||||
</Select>
|
</Select>
|
||||||
|
|
@ -112,12 +116,14 @@ const Navbar: React.FC<NavbarProps> = ({
|
||||||
}
|
}
|
||||||
/>,
|
/>,
|
||||||
<Icon
|
<Icon
|
||||||
|
key="discord"
|
||||||
onClick={() => window.open('https://discord.gg/SDbbn3hT4b', '_blank')}
|
onClick={() => window.open('https://discord.gg/SDbbn3hT4b', '_blank')}
|
||||||
style={{ cursor: 'pointer' }}
|
style={{ cursor: 'pointer' }}
|
||||||
fontSize={30}
|
fontSize={30}
|
||||||
icon={'ic:baseline-discord'}
|
icon={'ic:baseline-discord'}
|
||||||
/>,
|
/>,
|
||||||
<iframe
|
<iframe
|
||||||
|
key="github-star"
|
||||||
src="https://ghbtns.com/github-btn.html?user=iib0011&repo=omni-tools&type=star&count=true&size=large"
|
src="https://ghbtns.com/github-btn.html?user=iib0011&repo=omni-tools&type=star&count=true&size=large"
|
||||||
frameBorder="0"
|
frameBorder="0"
|
||||||
scrolling="0"
|
scrolling="0"
|
||||||
|
|
@ -126,6 +132,7 @@ const Navbar: React.FC<NavbarProps> = ({
|
||||||
title="GitHub"
|
title="GitHub"
|
||||||
></iframe>,
|
></iframe>,
|
||||||
<Button
|
<Button
|
||||||
|
key="buy-me-a-coffee"
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
window.open('https://buymeacoffee.com/iib0011', '_blank');
|
window.open('https://buymeacoffee.com/iib0011', '_blank');
|
||||||
}}
|
}}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue