ros/automaker
1
0
Fork 0
mirror of https://github.com/AutoMaker-Org/automaker.git synced 2026-02-01 20:23:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): Adjust sidebar padding for macOS Electron compatibility

Browse Source 
Updated the sidebar header and navigation components to increase top padding for macOS Electron users from 10px to 38px, ensuring better layout and avoiding overlap with the traffic light controls. This change enhances the user experience on macOS platforms.
This commit is contained in:
Kacper
2026-01-30 20:36:33 +01:00
parent 1a460c301a
commit 7d7d152d4e
2 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/ui/src/components/layout/sidebar/components/sidebar-header.tsx
View File

@@ -89,7 +89,7 @@ export function SidebarHeader({
<div
className={cn(
'shrink-0 flex flex-col items-center relative px-2 pt-3 pb-2',
isMac && isElectron() && 'pt-[10px]'
isMac && isElectron() && 'pt-[38px]'
)}
>
<Tooltip>
@@ -240,7 +240,7 @@ export function SidebarHeader({
<div
className={cn(
'shrink-0 flex flex-col relative px-3 pt-3 pb-2',
isMac && isElectron() && 'pt-[10px]'
isMac && isElectron() && 'pt-[38px]'
)}
>
{/* Header with logo and project dropdown */}

6
apps/ui/src/components/layout/sidebar/components/sidebar-navigation.tsx
View File

@@ -3,7 +3,8 @@ import type { NavigateOptions } from '@tanstack/react-router';
import { ChevronDown, Wrench, Github, Folder } from 'lucide-react';
import * as LucideIcons from 'lucide-react';
import type { LucideIcon } from 'lucide-react';
import { cn } from '@/lib/utils';
import { cn, isMac } from '@/lib/utils';
import { isElectron } from '@/lib/electron';
import { formatShortcut, useAppStore } from '@/store/app-store';
import { getAuthenticatedImageUrl } from '@/lib/api-fetch';
import type { NavSection } from '../types';
@@ -117,7 +118,8 @@ export function SidebarNavigation({
className={cn(
'flex-1 overflow-y-auto scrollbar-hide px-3 pb-2',
// Add top padding in discord mode since there's no header
sidebarStyle === 'discord' ? 'pt-3' : 'mt-1'
// Extra padding for macOS Electron to avoid traffic light overlap
sidebarStyle === 'discord' ? (isMac && isElectron() ? 'pt-[38px]' : 'pt-3') : 'mt-1'
)}
>
{/* Project name display for classic/discord mode */}