diff --git a/src/components/LanguageSwitcher.tsx b/src/components/LanguageSwitcher.tsx index 243587e..ebd71b6 100644 --- a/src/components/LanguageSwitcher.tsx +++ b/src/components/LanguageSwitcher.tsx @@ -43,8 +43,21 @@ export function LanguageSwitcher() { - {localeItems.map((item) => ( - handleSelect(e, item.code)} className={locale === item.code ? "bg-muted gap-3" : ""}> + {localeItems.map((item, index) => ( + handleSelect(e, item.code)} + className={cn( + { + "gap-3 bg-muted font-semibold": locale === item.code, + }, + { + "rounded-t-[5px]": index === localeItems.length - 1, + "rounded-[5px]": index !== 0 && index !== localeItems.length - 1, + "rounded-b-[5px]": index === 0, + }, + )} + > {item.name} {locale === item.code && } ))} diff --git a/src/components/ThemeSwitcher.tsx b/src/components/ThemeSwitcher.tsx index 9dcea33..4005c50 100644 --- a/src/components/ThemeSwitcher.tsx +++ b/src/components/ThemeSwitcher.tsx @@ -35,15 +35,24 @@ export function ModeToggle() { - handleSelect(e, "light")}> + handleSelect(e, "light")} + > {t("theme.light")} {theme === "light" && } - handleSelect(e, "dark")}> + handleSelect(e, "dark")} + > {t("theme.dark")} {theme === "dark" && } - handleSelect(e, "system")}> + handleSelect(e, "system")} + > {t("theme.system")} {theme === "system" && }