3pp-mirror/rallly
1
0
Fork 0
mirror of https://github.com/lukevella/rallly.git synced 2025-06-05 04:02:21 +02:00
Code Issues Projects Releases Packages Wiki Activity

💄 Add dropdown indicator to language selector (#552)

Browse source
This commit is contained in:
Jonas Höbenreich 2023-03-13 13:22:32 +01:00 • committed by GitHub
parent 39a07558ee
commit 5b78093c6f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 38 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

69
apps/web/src/components/poll/language-selector.tsx
View file

@ -2,42 +2,49 @@ import clsx from "clsx";
import Cookies from "js-cookie";
import { useTranslation } from "next-i18next";
import ChevronDown from "@/components/icons/chevron-down.svg";
export const LanguageSelect: React.FunctionComponent<{
className?: string;
onChange?: (language: string) => void;
}> = ({ className, onChange }) => {
const { i18n } = useTranslation("common");
return (
<select
className={clsx("input", className)}
defaultValue={i18n.language}
onChange={(e) => {
Cookies.set("NEXT_LOCALE", e.target.value, {
expires: 365,
});
onChange?.(e.target.value);
}}
>
<option value="en">English</option>
<option value="ca">Català</option>
<option value="cs">Česky</option>
<option value="zh">汉语</option>
<option value="da">Dansk</option>
<option value="de">Deutsch</option>
<option value="es">Español</option>
<option value="fi">Suomi</option>
<option value="fr">Français</option>
<option value="hr">Hrvatski</option>
<option value="it">Italiano</option>
<option value="ko">한국어</option>
<option value="hu">Magyar</option>
<option value="nl">Nederlands</option>
<option value="pl">Polski</option>
<option value="pt">Português</option>
<option value="pt-BR">Português - Brasil</option>
<option value="ru">Pусский</option>
<option value="sk">Slovenčina</option>
<option value="sv">Svenska</option>
</select>
<div className="relative">
<select
className={clsx("input block pr-4", className)}
defaultValue={i18n.language}
onChange={(e) => {
Cookies.set("NEXT_LOCALE", e.target.value, {
expires: 365,
});
onChange?.(e.target.value);
}}
>
<option value="en">English</option>
<option value="ca">Català</option>
<option value="cs">Česky</option>
<option value="zh">汉语</option>
<option value="da">Dansk</option>
<option value="de">Deutsch</option>
<option value="es">Español</option>
<option value="fi">Suomi</option>
<option value="fr">Français</option>
<option value="hr">Hrvatski</option>
<option value="it">Italiano</option>
<option value="ko">한국어</option>
<option value="hu">Magyar</option>
<option value="nl">Nederlands</option>
<option value="pl">Polski</option>
<option value="pt">Português</option>
<option value="pt-BR">Português - Brasil</option>
<option value="ru">Pусский</option>
<option value="sk">Slovenčina</option>
<option value="sv">Svenska</option>
</select>
<div className="pointer-events-none absolute inset-y-0 right-2 flex items-center">
<ChevronDown className="w-5" />
</div>
</div>
);
};