fix: enhance styling of LanguageSwitcher and ThemeSwitcher components

2026-09-20 10:10:14 +00:00 · 2025-12-28 14:40:44 +08:00
parent 409ec0b62c
commit 4f9db466a3
2 changed files with 27 additions and 5 deletions
@@ -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>
        ))}