ui(dropdown): keep menu items single-line + widen container to w-60

Add whitespace-nowrap to the DropdownMenuItem primitive so every
dropdown row stays on a single line app-wide, and bump the sidebar
3-dot overflow menu from w-56 to w-60. The Benachrichtigungs-Center
label (23 chars) plus its Bell icon and the default text-sm cap sat
right at the 14-rem ceiling and wrapped at the hyphen on sub-pixel
rounding.
This commit is contained in:
Marc-André Bombeck committed 2026-05-17 14:21:25 +02:00
1 parent 96e9842963
commit 5f86d6d4fa
2 files changed
+8 -2

No files matched your search

+1 -1
View File
@@ -117,7 +117,7 @@ function SidebarUserSection({ collapsed }: { collapsed: boolean }) {
<DropdownMenuContent
side="right"
align="end"
className="w-56"
className="w-60"
sideOffset={8}
>
<div className="flex items-center gap-3 px-2 py-2">
+7 -1
View File
@@ -74,7 +74,13 @@ function DropdownMenuItem({
data-inset={inset}
data-variant={variant}
className={cn(
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex min-h-11 cursor-default items-center gap-2 rounded-sm px-2 py-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
// v1.4.37 W4a item 2 — `whitespace-nowrap` keeps every
// dropdown row on a single line (the sidebar 3-dot menu's
// "Benachrichtigungs-Center" otherwise wrapped at the
// hyphen on sub-pixel rounding inside the legacy w-56
// container). Applies app-wide so the top-bar w-48 menus
// get the same protection.
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex min-h-11 cursor-default items-center gap-2 rounded-sm px-2 py-2 text-sm whitespace-nowrap outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
className,
)}
{...props}