diff --git a/client/src/components/Sidebar.tsx b/client/src/components/Sidebar.tsx index 141d9c71..75882d06 100644 --- a/client/src/components/Sidebar.tsx +++ b/client/src/components/Sidebar.tsx @@ -520,7 +520,9 @@ export function Sidebar({ wsConnected, collapsed, onToggle }: SidebarProps) {

{t("nav:language")}

-
+ {/* One column per language: a wider grid squeezed each button + below the width of its own label once Theme grew a third. */} +
{SUPPORTED_LANGUAGES.map((language) => { const active = language === currentLanguage; return ( @@ -530,7 +532,7 @@ export function Sidebar({ wsConnected, collapsed, onToggle }: SidebarProps) { aria-pressed={active} aria-label={t(`nav:languageNames.${language}`)} title={t(`nav:languageNames.${language}`)} - className={`rounded-md px-2 py-1.5 text-[11px] font-semibold transition-colors ${ + className={`rounded-md px-1 py-1.5 text-center text-[11px] font-semibold transition-colors ${ active ? "bg-accent/20 text-accent border border-accent/30" : "bg-surface-1 text-fg-secondary border border-border hover:bg-surface-3 hover:text-fg-primary"