ui: adjust toolbar heights and icon sizes, remove duplicate AI icon

- TopBar: h-16 → h-[58px] (10% lower), icons w-5 → w-4
- PluginToolbar: min-h-[36px] → min-h-[43px] (20% higher), icons w-3.5 → w-4
- Remove duplicate AI computer icon from TopBar (AISidebar collapsed icon remains)
- Clean up unused imports (toggleAISidebar, aiSidebarCollapsed)
This commit is contained in:
Agent Zero
2026-07-19 00:09:17 +02:00
parent ad41771b10
commit ef6d011e16
3 changed files with 7 additions and 22 deletions
+1 -1
View File
@@ -41,7 +41,7 @@ export function AISidebar() {
aria-label="KI Assistent öffnen" aria-label="KI Assistent öffnen"
title="KI Assistent" title="KI Assistent"
> >
<svg className="w-5 h-5 text-secondary-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"> <svg className="w-4 h-4 text-secondary-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
</svg> </svg>
</button> </button>
@@ -14,7 +14,7 @@ function ToolbarButton({ item }: { item: ToolbarItem }) {
`} `}
title={item.label} title={item.label}
> >
{item.icon && <span className="w-3.5 h-3.5 flex-shrink-0">{item.icon}</span>} {item.icon && <span className="w-4 h-4 flex-shrink-0">{item.icon}</span>}
<span className="hidden sm:inline">{item.label}</span> <span className="hidden sm:inline">{item.label}</span>
</button> </button>
); );
@@ -66,7 +66,7 @@ export function PluginToolbar() {
return ( return (
<div <div
className="flex items-center gap-1 px-2 sm:px-3 py-1 bg-white border-b border-secondary-200 min-h-[36px] overflow-x-auto" className="flex items-center gap-1 px-2 sm:px-3 py-1.5 bg-white border-b border-secondary-200 min-h-[43px] overflow-x-auto"
data-testid="plugin-toolbar" data-testid="plugin-toolbar"
> >
{groupNames.map((groupName, gi) => ( {groupNames.map((groupName, gi) => (
+4 -19
View File
@@ -15,7 +15,7 @@ export function TopBar() {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate(); const navigate = useNavigate();
const { user } = useAuthStore(); const { user } = useAuthStore();
const { toggleSidebar, toggleAISidebar, openAISidebarProactive, aiSidebarCollapsed } = useUIStore(); const { toggleSidebar, openAISidebarProactive } = useUIStore();
const { currentTenant, availableTenants, switchTenant, isSwitching } = useTenant(); const { currentTenant, availableTenants, switchTenant, isSwitching } = useTenant();
const logoutMutation = useLogout(); const logoutMutation = useLogout();
@@ -54,7 +54,7 @@ export function TopBar() {
return ( return (
<header <header
className="h-16 bg-white border-b border-secondary-200 flex items-center justify-between px-4 sticky top-0 z-20" className="h-[58px] bg-white border-b border-secondary-200 flex items-center justify-between px-4 sticky top-0 z-20"
role="banner" role="banner"
data-testid="topbar" data-testid="topbar"
> >
@@ -65,26 +65,11 @@ export function TopBar() {
aria-label="Seitenleiste ein-/ausklappen" aria-label="Seitenleiste ein-/ausklappen"
aria-expanded={true} aria-expanded={true}
> >
<svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"> <svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
</svg> </svg>
</button> </button>
{/* AI Assistant toggle */}
<button
onClick={toggleAISidebar}
className={clsx(
'p-2 rounded-md min-h-touch min-w-touch flex items-center justify-center focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500',
aiSidebarCollapsed ? 'hover:bg-secondary-100' : 'bg-primary-50 text-primary-600 hover:bg-primary-100',
)}
aria-label="KI Assistent"
title="KI Assistent"
>
<svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
</svg>
</button>
{/* Tenant switcher */} {/* Tenant switcher */}
<div ref={tenantRef} className="relative"> <div ref={tenantRef} className="relative">
<button <button
@@ -153,7 +138,7 @@ export function TopBar() {
aria-label={t('topbar.notifications')} aria-label={t('topbar.notifications')}
aria-expanded={notifOpen} aria-expanded={notifOpen}
> >
<svg className="w-5 h-5 text-secondary-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"> <svg className="w-4 h-4 text-secondary-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" />
</svg> </svg>
<Badge variant="danger" className="absolute -top-1 -right-1 px-1.5 py-0">3</Badge> <Badge variant="danger" className="absolute -top-1 -right-1 px-1.5 py-0">3</Badge>