feat(sidebar): 统一Git和终端侧边栏空状态样式
- Git空状态改为图标+大字,与终端风格一致 - 终端空状态去掉小字,文字改为当前没有开启的终端 - 统一头部栏高度为38px - 统一空状态图标颜色为var(--text-tertiary) + 整体opacity - 统一空tab文字为13px/600字重/左对齐 - 新增folder-git-2.svg图标
This commit is contained in:
parent
55097cb3fc
commit
095e0631c1
1
static/icons/folder-git-2.svg
Normal file
1
static/icons/folder-git-2.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="opacity:1;"><path d="M9 20H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H20a2 2 0 0 1 2 2v5"/><circle cx="13" cy="12" r="2"/><path d="M18 19c-2.8 0-5-2.2-5-5v8"/><circle cx="20" cy="19" r="2"/></svg>
|
||||
|
After Width: | Height: | Size: 414 B |
@ -18,7 +18,15 @@
|
||||
<div class="git-changes-panel__body">
|
||||
<div v-if="loading && !diff" class="git-changes-panel__empty">正在加载 Git 变更…</div>
|
||||
<div v-else-if="error && !files.length" class="git-changes-panel__empty git-changes-panel__empty--error">{{ error }}</div>
|
||||
<div v-else-if="!files.length" class="git-changes-panel__empty">当前没有未提交变更</div>
|
||||
<div v-else-if="!files.length" class="git-changes-panel__empty">
|
||||
<svg class="git-changes-panel__empty-svg" viewBox="0 0 24 24" fill="none" aria-hidden="true">
|
||||
<path d="M9 20H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H20a2 2 0 0 1 2 2v5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<circle cx="13" cy="12" r="2" stroke="currentColor" stroke-width="2"/>
|
||||
<path d="M18 19c-2.8 0-5-2.2-5-5v8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<circle cx="20" cy="19" r="2" stroke="currentColor" stroke-width="2"/>
|
||||
</svg>
|
||||
<span>当前没有未提交变更</span>
|
||||
</div>
|
||||
<section v-for="file in files" v-else :key="file.path" class="git-change-file">
|
||||
<div class="git-change-file__header">
|
||||
<span class="git-change-file__title">
|
||||
|
||||
@ -33,8 +33,7 @@
|
||||
<rect x="2" y="3" width="20" height="16" rx="2" stroke="currentColor" stroke-width="1.5"/>
|
||||
<path d="M6 7h12M6 10h8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
|
||||
</svg>
|
||||
<span>暂无活动终端</span>
|
||||
<span class="terminal-panel__idle-hint">AI 使用终端时将自动显示</span>
|
||||
<span>当前没有开启的终端</span>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
@ -466,9 +465,9 @@ onBeforeUnmount(() => {
|
||||
.terminal-panel__empty-tab {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 4px 10px;
|
||||
font-size: 12px;
|
||||
color: var(--text-muted);
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.terminal-panel__tab {
|
||||
@ -552,11 +551,7 @@ onBeforeUnmount(() => {
|
||||
.terminal-panel__idle-svg {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
opacity: 0.35;
|
||||
}
|
||||
|
||||
.terminal-panel__idle-hint {
|
||||
font-size: 11px;
|
||||
color: var(--text-tertiary);
|
||||
opacity: 0.55;
|
||||
}
|
||||
|
||||
|
||||
@ -77,8 +77,8 @@
|
||||
|
||||
.git-changes-panel__header {
|
||||
flex: 0 0 auto;
|
||||
min-height: 54px;
|
||||
padding: 10px 14px 8px 16px;
|
||||
min-height: 38px;
|
||||
padding: 0 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@ -182,10 +182,21 @@
|
||||
}
|
||||
|
||||
.git-changes-panel__empty {
|
||||
padding: 48px 12px;
|
||||
color: var(--claude-text-secondary);
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
gap: 8px;
|
||||
color: var(--text-muted);
|
||||
font-size: 13px;
|
||||
|
||||
&-svg {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
color: var(--text-tertiary);
|
||||
opacity: 0.55;
|
||||
}
|
||||
}
|
||||
|
||||
.git-changes-panel__empty--error {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user