Buriburizaemon/nezha-dash-v1
1
0
Fork 0
mirror of https://github.com/Buriburizaem0n/nezha-dash-v1.git synced 2026-05-06 05:48:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: enhance styling of LanguageSwitcher and ThemeSwitcher components

Browse Source
This commit is contained in:
hamster1963
2025-12-28 14:40:44 +08:00
parent 409ec0b62c
commit 4f9db466a3
2 changed files with 27 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/LanguageSwitcher.tsx
+15 -2
View File
@@ -43,8 +43,21 @@ export function LanguageSwitcher() {
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="flex flex-col gap-0.5" align="end">
{localeItems.map((item) => (
<DropdownMenuItem key={item.code} onSelect={(e) => handleSelect(e, item.code)} className={locale === item.code ? "bg-muted gap-3" : ""}>
{localeItems.map((item, index) => (
<DropdownMenuItem
key={item.code}
onSelect={(e) => 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 && <CheckCircleIcon className="size-4" />}
</DropdownMenuItem>
))}
src/components/ThemeSwitcher.tsx
+12 -3
View File
@@ -35,15 +35,24 @@ export function ModeToggle() {
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="flex flex-col gap-0.5" align="end">
<DropdownMenuItem className={cn({ "gap-3 bg-muted": theme === "light" })} onSelect={(e) => handleSelect(e, "light")}>
<DropdownMenuItem
className={cn("rounded-b-[5px]", { "gap-3 bg-muted font-semibold": theme === "light" })}
onSelect={(e) => handleSelect(e, "light")}
>
{t("theme.light")}
{theme === "light" && <CheckCircleIcon className="size-4" />}
</DropdownMenuItem>
<DropdownMenuItem className={cn({ "gap-3 bg-muted": theme === "dark" })} onSelect={(e) => handleSelect(e, "dark")}>
<DropdownMenuItem
className={cn("rounded-[5px]", { "gap-3 bg-muted font-semibold": theme === "dark" })}
onSelect={(e) => handleSelect(e, "dark")}
>
{t("theme.dark")}
{theme === "dark" && <CheckCircleIcon className="size-4" />}
</DropdownMenuItem>
<DropdownMenuItem className={cn({ "gap-3 bg-muted": theme === "system" })} onSelect={(e) => handleSelect(e, "system")}>
<DropdownMenuItem
className={cn("rounded-t-[5px]", { "gap-3 bg-muted font-semibold": theme === "system" })}
onSelect={(e) => handleSelect(e, "system")}
>
{t("theme.system")}
{theme === "system" && <CheckCircleIcon className="size-4" />}
</DropdownMenuItem>