mirror of
https://github.com/davidkaya/aryx.git
synced 2026-08-06 03:38:44 +02:00
fix: add macOS traffic light inset to sidebar header
Position macOS traffic light buttons (trafficLightPosition) in the
BrowserWindow and add conditional left padding to the sidebar header
so the app logo and title clear the window management controls.
- Create shared platform detection utility (src/renderer/lib/platform.ts)
- Set trafficLightPosition { x: 16, y: 22 } on macOS in createMainWindow
- Apply pl-20 (80px) left padding to the sidebar header on macOS
- Consolidate navigator.platform check from keyboardShortcuts.ts
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
@@ -21,6 +21,9 @@ export function createMainWindow(): BrowserWindowType {
|
||||
}),
|
||||
backgroundColor: '#09090b',
|
||||
titleBarStyle: 'hidden',
|
||||
...(process.platform === 'darwin' && {
|
||||
trafficLightPosition: { x: 16, y: 22 },
|
||||
}),
|
||||
titleBarOverlay: {
|
||||
color: '#09090b',
|
||||
symbolColor: '#a1a1aa',
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { useEffect, useMemo, useRef, useState } from 'react';
|
||||
import appIconUrl from '../../../assets/icons/icon.png';
|
||||
import { isMac } from '@renderer/lib/platform';
|
||||
import {
|
||||
AlertTriangle,
|
||||
Archive,
|
||||
@@ -581,7 +582,7 @@ export function Sidebar({
|
||||
return (
|
||||
<div className="flex h-full flex-col">
|
||||
{/* Header — extra top padding clears the title bar overlay zone */}
|
||||
<div className="drag-region flex items-center justify-between border-b border-[var(--color-border-subtle)] px-4 pb-3 pt-3">
|
||||
<div className={`drag-region flex items-center justify-between border-b border-[var(--color-border-subtle)] pb-3 pt-3 pr-4 ${isMac ? 'pl-20' : 'pl-4'}`}>
|
||||
<div className="flex items-center gap-2.5">
|
||||
<img alt="aryx" className="size-8 rounded-xl" src={appIconUrl} />
|
||||
<div>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
const isMac = navigator.platform.startsWith('Mac');
|
||||
import { isMac } from '@renderer/lib/platform';
|
||||
|
||||
/** Platform-aware modifier key label. */
|
||||
export const MOD = isMac ? '⌘' : 'Ctrl';
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
export const isMac = navigator.platform.startsWith('Mac');
|
||||
Reference in New Issue
Block a user