mirror of
https://github.com/Syngnat/GoNavi.git
synced 2026-08-08 23:53:30 +08:00
🐛 fix(theme): 提升连接状态与 SQL 关键字辨识度
- 为亮暗主题和内置预设增加独立连接状态语义色 - 强化 Host、数据库状态点及双行页签字段对比度 - 为 Monaco SQL 关键字补充高对比加粗规则 - 增加基础主题与内置预设的对比度回归测试
This commit is contained in:
@@ -43,16 +43,17 @@ body[data-ui-version="v2"][data-theme="light"] {
|
||||
--gn-br-2: rgba(15, 23, 42, 0.12);
|
||||
--gn-br-3: rgba(15, 23, 42, 0.18);
|
||||
|
||||
--gn-accent: #16a34a;
|
||||
--gn-accent-2: #15803d;
|
||||
--gn-accent: #15803d;
|
||||
--gn-accent-2: #166534;
|
||||
--gn-accent-soft: #dcfce7;
|
||||
--gn-info: #0284c7;
|
||||
--gn-info: #0369a1;
|
||||
--gn-info-soft: #e0f2fe;
|
||||
--gn-warn: #d97706;
|
||||
--gn-warn-soft: rgba(245, 158, 11, 0.14);
|
||||
--gn-danger: #dc2626;
|
||||
--gn-danger-strong: #dc2626;
|
||||
--gn-danger-strong-hover: #b91c1c;
|
||||
--gn-status-connected: #15803d;
|
||||
|
||||
--gn-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
|
||||
--gn-shadow-md: 0 4px 14px rgba(15, 23, 42, 0.08);
|
||||
@@ -97,6 +98,7 @@ body[data-ui-version="v2"][data-theme="dark"] {
|
||||
--gn-danger: #f87171;
|
||||
--gn-danger-strong: #dc2626;
|
||||
--gn-danger-strong-hover: #b91c1c;
|
||||
--gn-status-connected: #4ade80;
|
||||
|
||||
--gn-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
|
||||
--gn-shadow-md: 0 4px 14px rgba(0, 0, 0, 0.45);
|
||||
@@ -2073,7 +2075,7 @@ body[data-ui-version="v2"] .gn-v2-rail-status {
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-rail-status.is-live {
|
||||
background: var(--gn-accent);
|
||||
background: var(--gn-status-connected);
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-rail-status.is-error {
|
||||
@@ -2150,16 +2152,19 @@ body[data-ui-version="v2"] .gn-v2-active-connection-trigger {
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-live-dot {
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
box-sizing: border-box;
|
||||
border: 1.5px solid var(--gn-fg-4);
|
||||
border-radius: 50%;
|
||||
flex-shrink: 0;
|
||||
background: var(--gn-fg-5);
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-live-dot.is-live {
|
||||
background: #22c55e;
|
||||
box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18);
|
||||
border: 0;
|
||||
background: var(--gn-status-connected);
|
||||
box-shadow: 0 0 0 3px color-mix(in srgb, var(--gn-status-connected) 22%, transparent);
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-live-dot.is-loading {
|
||||
@@ -2172,7 +2177,9 @@ body[data-ui-version="v2"] .gn-v2-live-dot.is-loading {
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-live-dot.is-error {
|
||||
border: 0;
|
||||
background: var(--gn-danger);
|
||||
box-shadow: 0 0 0 3px color-mix(in srgb, var(--gn-danger) 20%, transparent);
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-active-connection-copy {
|
||||
@@ -2856,16 +2863,19 @@ body[data-ui-version="v2"] .gn-v2-tree-status {
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tree-status::before {
|
||||
content: '';
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
box-sizing: border-box;
|
||||
border: 1.5px solid var(--gn-fg-4);
|
||||
border-radius: 50%;
|
||||
flex: 0 0 7px;
|
||||
background: #b8c0cc;
|
||||
flex: 0 0 9px;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tree-status.is-success::before {
|
||||
background: #22c55e;
|
||||
box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
|
||||
border: 0;
|
||||
background: var(--gn-status-connected);
|
||||
box-shadow: 0 0 0 3px color-mix(in srgb, var(--gn-status-connected) 22%, transparent);
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tree-status.is-loading::before {
|
||||
@@ -2880,8 +2890,9 @@ body[data-ui-version="v2"] .gn-v2-tree-status.is-loading::before {
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tree-status.is-error::before {
|
||||
border: 0;
|
||||
background: var(--gn-danger);
|
||||
box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.16);
|
||||
box-shadow: 0 0 0 3px color-mix(in srgb, var(--gn-danger) 20%, transparent);
|
||||
}
|
||||
|
||||
@keyframes gn-v2-tree-status-spin {
|
||||
@@ -3586,9 +3597,11 @@ body[data-ui-version="v2"] .gn-v2-tab-label-main {
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tab-label-secondary {
|
||||
min-width: 0;
|
||||
display: block;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
overflow: hidden;
|
||||
color: var(--gn-fg-5);
|
||||
color: var(--gn-fg-4);
|
||||
font-family: var(--gn-font-mono);
|
||||
font-size: 10px;
|
||||
font-weight: 650;
|
||||
@@ -3626,6 +3639,19 @@ body[data-ui-version="v2"] .gn-v2-tab-label-part-schema {
|
||||
max-width: 112px;
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tab-label-part-host {
|
||||
color: var(--gn-info);
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tab-label-part-database {
|
||||
color: var(--gn-accent);
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tab-label-separator {
|
||||
flex: 0 0 auto;
|
||||
color: var(--gn-fg-5);
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-tab-kind-icon {
|
||||
display: inline-flex;
|
||||
color: var(--gn-accent);
|
||||
|
||||
Reference in New Issue
Block a user