mirror of
https://github.com/Syngnat/GoNavi.git
synced 2026-05-12 12:19:47 +08:00
a7bee7f3b6
- 将 AI 助手入口从侧栏工具区迁移为主内容区右侧贴边标签 - 调整打开态贴边标签锚点到面板左外沿，避免遮挡头部操作区 - 重排侧栏顶部工具布局，恢复四项按钮的稳定网格结构 - 新增 aiEntryLayout 布局辅助与回归测试，覆盖打开态附着位置
60 lines
2.1 KiB
TypeScript
60 lines
2.1 KiB
TypeScript
import type { CSSProperties } from 'react';
|
|
|
|
export const SIDEBAR_UTILITY_ITEM_KEYS = ['tools', 'proxy', 'theme', 'about'] as const;
|
|
|
|
export type AIEntryPlacement = 'content-edge';
|
|
export type AIEdgeHandleAttachment = 'content-shell' | 'panel-shell';
|
|
|
|
export interface ResolveAIEdgeHandleStyleInput {
|
|
darkMode: boolean;
|
|
aiPanelVisible: boolean;
|
|
effectiveUiScale: number;
|
|
}
|
|
|
|
export const resolveAIEntryPlacement = (): AIEntryPlacement => 'content-edge';
|
|
|
|
export const resolveAIEdgeHandleAttachment = (
|
|
aiPanelVisible: boolean,
|
|
): AIEdgeHandleAttachment => (aiPanelVisible ? 'panel-shell' : 'content-shell');
|
|
|
|
export const resolveAIEdgeHandleDockStyle = (
|
|
attachment: AIEdgeHandleAttachment,
|
|
): CSSProperties => ({
|
|
position: 'absolute',
|
|
top: 16,
|
|
right: attachment === 'panel-shell' ? '100%' : 0,
|
|
zIndex: 12,
|
|
});
|
|
|
|
export const resolveAIEdgeHandleStyle = ({
|
|
darkMode,
|
|
aiPanelVisible,
|
|
effectiveUiScale,
|
|
}: ResolveAIEdgeHandleStyleInput): CSSProperties => {
|
|
const inactiveColor = darkMode ? 'rgba(255,255,255,0.86)' : 'rgba(22,32,51,0.82)';
|
|
const inactiveBackground = darkMode ? 'rgba(255,255,255,0.04)' : 'rgba(15,23,42,0.04)';
|
|
const inactiveBorder = darkMode ? 'rgba(255,255,255,0.08)' : 'rgba(15,23,42,0.08)';
|
|
|
|
return {
|
|
height: Math.max(24, Math.round(24 * effectiveUiScale)),
|
|
paddingInline: Math.max(8, Math.round(8 * effectiveUiScale)),
|
|
borderRadius: '10px 0 0 10px',
|
|
border: `1px solid ${aiPanelVisible ? (darkMode ? 'rgba(255,214,102,0.22)' : 'rgba(24,144,255,0.18)') : inactiveBorder}`,
|
|
borderRight: 'none',
|
|
background: aiPanelVisible ? (darkMode ? 'rgba(255,214,102,0.12)' : 'rgba(24,144,255,0.10)') : inactiveBackground,
|
|
color: aiPanelVisible ? (darkMode ? '#ffd666' : '#1677ff') : inactiveColor,
|
|
display: 'inline-flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
gap: Math.max(4, Math.round(4 * effectiveUiScale)),
|
|
fontSize: Math.max(12, Math.round(12 * effectiveUiScale)),
|
|
fontWeight: 600,
|
|
lineHeight: 1,
|
|
boxShadow: 'none',
|
|
backdropFilter: 'none',
|
|
WebkitBackdropFilter: 'none',
|
|
whiteSpace: 'nowrap',
|
|
flexShrink: 0,
|
|
};
|
|
};
|