This commit is contained in:
seb
2026-10-05 01:07:45 +02:00
parent b766769634
commit 4d653304cd
3 changed files with 27 additions and 7 deletions

View File

@@ -270,8 +270,8 @@ export const ASK_PROMPT_BORDER_PAIR = { light: BLUE_PANEL, dark: BLUE_BORDER };
/** Deep petrol — the app's structural dark. */
export const NAV_SURFACE = mix(DARK_6, CHROMA.PETROL.dark, 0.3);
/** Horizontal sheen across the sidebar. */
export const NAV_BACKGROUND = `linear-gradient(90deg, ${mix(NAV_SURFACE, DARK_6, 0.4)} 0%, ${mix(NAV_SURFACE, WHITE, 0.06)} 25%, ${NAV_SURFACE} 60%, ${mix(NAV_SURFACE, DARK_6, 0.3)} 100%)`;
/** Horizontal sheen across the sidebar — kept very soft, no hard banding. */
export const NAV_BACKGROUND = `linear-gradient(90deg, ${mix(NAV_SURFACE, DARK_6, 0.16)} 0%, ${mix(NAV_SURFACE, WHITE, 0.04)} 25%, ${NAV_SURFACE} 60%, ${mix(NAV_SURFACE, DARK_6, 0.12)} 100%)`;
export const NAV_ITEM = mix(WHITE, CHROMA.PETROL.dark, 0.45);
export const NAV_ITEM_HOVER = mix(DARK_5, CHROMA.PETROL.dark, 0.3);
@@ -282,6 +282,14 @@ export const NAV_ITEM_ACTIVE_TEXT = mix(CHROMA.PETROL.light, WHITE, 0.15);
/** Accent for active items and live draft badges. */
export const NAV_ITEM_ACTIVE_ACCENT = CHROMA.PETROL.light;
/**
* Sub-navigation (2nd level) sits on the light app background, not on the
* dark sidebar — so its active surface only needs a mid dip to let the light
* accent read. Well short of the fully deep `NAV_ITEM_ACTIVE`.
*/
export const NAV_SUB_ACTIVE = mix(MAIN_BACKGROUND, NAV_ITEM_ACTIVE, 0.55);
export const NAV_SUB_ACTIVE_HOVER = mix(MAIN_BACKGROUND, NAV_ITEM_ACTIVE, 0.55);
/* ────────────────────────────────────────────────────────────────────────────
* 9. CHAT / AI ASSISTANT
* -------------------------------------------------------------------------*/

View File

@@ -14,6 +14,9 @@ import { artikelQueryPath } from './article/artikelQuery';
import { defaultCategoryPath } from './category/categoryRoute';
import { navigationAutomat } from '../automats';
import {
NAV_ITEM_ACTIVE_ACCENT,
NAV_SUB_ACTIVE,
NAV_SUB_ACTIVE_HOVER,
NAV_SURFACE,
} from '../colors';
import { ChatFab, ChatDrawer } from './chat';
@@ -195,12 +198,16 @@ class AppSubNav extends PureComponent {
justifyContent: 'center',
gap: 0.5,
color: active
? theme.palette.primary.main
? theme.nav?.itemActiveAccent || NAV_ITEM_ACTIVE_ACCENT
: theme.palette.text.secondary,
bgcolor: active ? theme.palette.action.selected : 'transparent',
bgcolor: active ? theme.nav?.subActive || NAV_SUB_ACTIVE : 'transparent',
'&:hover': {
bgcolor: theme.palette.action.hover,
color: theme.palette.primary.main,
bgcolor: active
? theme.nav?.subActiveHover || NAV_SUB_ACTIVE_HOVER
: theme.palette.action.hover,
color: active
? theme.nav?.itemActiveAccent || NAV_ITEM_ACTIVE_ACCENT
: theme.palette.primary.main,
},
})}
>

View File

@@ -5,12 +5,14 @@ import {
NAV_ITEM,
NAV_ITEM_ACTIVE,
NAV_ITEM_ACTIVE_ACCENT,
NAV_ITEM_ACTIVE_TEXT,
NAV_ITEM_HOVER,
NAV_ITEM_HOVER_TEXT,
NAV_SUB_ACTIVE,
NAV_SUB_ACTIVE_HOVER,
NAV_SURFACE,
PRIMARY,
WHITE,
NAV_ITEM_ACTIVE_TEXT,
} from '../../colors';
const nav = {
@@ -21,8 +23,11 @@ const nav = {
itemHover: NAV_ITEM_HOVER,
itemHoverText: NAV_ITEM_HOVER_TEXT,
itemActive: NAV_ITEM_ACTIVE,
itemActiveHover: NAV_ITEM_ACTIVE,
itemActiveText: NAV_ITEM_ACTIVE_TEXT,
itemActiveAccent: NAV_ITEM_ACTIVE_ACCENT,
subActive: NAV_SUB_ACTIVE,
subActiveHover: NAV_SUB_ACTIVE_HOVER,
};
export const defaultThemeId = 'default';