Improvements to the UI

This commit is contained in:
pricewowen
2026-05-24 08:49:37 -06:00
parent d35b4e57d9
commit ec1bfa3fbe
60 changed files with 669 additions and 391 deletions

View File

@@ -19,7 +19,7 @@ export function CharacterLayerTabs({
<div
role="tablist"
aria-label="Character customization"
className="grid grid-cols-7 gap-0.5 border-2 border-border bg-muted/30 p-0.5"
className="grid grid-cols-4 gap-1 border-2 border-border bg-muted/30 p-1 sm:grid-cols-7"
>
{CHARACTER_CUSTOMIZATION_TABS.map((tab) => (
<button
@@ -29,7 +29,7 @@ export function CharacterLayerTabs({
aria-selected={activeTabId === tab.id}
onClick={() => onTabChange(tab.id)}
className={cn(
"min-w-0 truncate border-2 px-0.5 py-1.5 text-[7px] font-medium uppercase leading-tight tracking-wide transition-colors sm:px-1 sm:text-[8px]",
"min-w-0 border-2 px-1 py-2 text-[10px] font-semibold uppercase leading-tight tracking-wide transition-colors sm:px-1.5 sm:text-xs",
activeTabId === tab.id
? "border-secondary bg-background text-foreground shadow-[var(--retro-shadow-sm)]"
: "border-transparent text-muted-foreground hover:border-border/60 hover:text-foreground",