move the remaining light panels onto the dark tokens

The scroll-to-bottom control, the approval and queue float panels, and
the inline code chips still carried the light-theme fills (#ffffff,
rgba(255,255,255,.94/.68)) with .dark overrides pinned to old greys.
Point all of them at --bg-card and its rgb triple so the alpha layers
keep working, then drop the overrides that became identical to the base
rule.

Low-alpha white overlays are left alone — on a dark surface they read as
a lift, which is the intent.
This commit is contained in:
2026-10-19 14:41:13 +08:00
parent 189270e046
commit 2d7069bdf9
6 changed files with 11 additions and 37 deletions
@@ -301,15 +301,11 @@ defineExpose({
justify-content: center;
border-radius: 999px;
border: 1px solid rgba(var(--accent-primary-rgb), 0.24);
background: rgba(255, 255, 255, 0.94);
background: rgba(var(--bg-card-rgb), 0.94);
color: var(--accent-primary);
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
padding: 0;
cursor: pointer;
.dark & {
background: rgba(38, 38, 38, 0.94);
}
}
.scroll-bottom-button:hover {
@@ -893,15 +893,11 @@ defineExpose({
justify-content: center;
border-radius: 999px;
border: 1px solid rgba(var(--accent-primary-rgb), 0.24);
background: rgba(255, 255, 255, 0.94);
background: rgba(var(--bg-card-rgb), 0.94);
color: var(--accent-primary);
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
padding: 0;
cursor: pointer;
.dark & {
background: rgba(38, 38, 38, 0.94);
}
}
.scroll-bottom-button:hover {
@@ -920,13 +916,9 @@ defineExpose({
padding: 10px;
border: 1px solid rgba(var(--accent-info-rgb), 0.22);
border-radius: 16px;
background: #ffffff;
background: var(--bg-card);
box-shadow: 0 14px 40px rgba(0, 0, 0, 0.14);
backdrop-filter: blur(14px);
.dark & {
background: #262626;
}
}
.approval-float-panel {
@@ -990,7 +982,7 @@ defineExpose({
font-size: 11px;
line-height: 1.45;
color: $text-primary;
background: rgba(255, 255, 255, 0.68);
background: rgba(var(--bg-card-rgb), 0.68);
border: 1px solid $border-color;
border-radius: 11px;
padding: 8px 10px;
@@ -1084,7 +1076,7 @@ defineExpose({
min-height: 34px;
padding: 7px 8px;
border-radius: 11px;
background: rgba(255, 255, 255, 0.68);
background: rgba(var(--bg-card-rgb), 0.68);
color: $text-primary;
.dark & {
@@ -403,7 +403,7 @@ onUnmounted(() => {
padding: 2px;
border-radius: inherit;
object-fit: contain;
background: #fff;
background: var(--bg-card);
}
@keyframes rainbow-glow {
@@ -932,10 +932,6 @@ export default defineComponent({ components: { CreateRoomForm } })
color: $text-secondary;
background-color: $bg-card-hover;
border-radius: $radius-sm;
.dark & {
background-color: rgba(255, 255, 255, 0.06);
}
}
.context-stop-btn {
@@ -968,13 +964,9 @@ export default defineComponent({ components: { CreateRoomForm } })
padding: 10px;
border: 1px solid rgba(var(--accent-primary-rgb), 0.24);
border-radius: 16px;
background: #ffffff;
background: var(--bg-card);
box-shadow: 0 14px 40px rgba(0, 0, 0, 0.14);
backdrop-filter: blur(14px);
.dark & {
background: #262626;
}
}
.approval-float-header {
@@ -1029,14 +1021,10 @@ export default defineComponent({ components: { CreateRoomForm } })
font-size: 11px;
line-height: 1.45;
color: $text-primary;
background: rgba(255, 255, 255, 0.68);
background: rgba(var(--bg-card-rgb), 0.68);
border: 1px solid $border-color;
border-radius: 11px;
padding: 8px 10px;
.dark & {
background: rgba(255, 255, 255, 0.08);
}
}
.approval-float-actions {
@@ -185,15 +185,11 @@ defineExpose({ scrollToBottom })
justify-content: center;
border-radius: 999px;
border: 1px solid rgba(var(--accent-primary-rgb), 0.24);
background: rgba(255, 255, 255, 0.94);
background: rgba(var(--bg-card-rgb), 0.94);
color: var(--accent-primary);
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
padding: 0;
cursor: pointer;
.dark & {
background: rgba(38, 38, 38, 0.94);
}
}
.scroll-bottom-button:hover {
@@ -13,6 +13,8 @@
--bg-card: oklch(0.185 0.014 248); // 容器 / 输入区(比页面更亮,向上浮)
--bg-card-hover: oklch(0.225 0.016 246);
--bg-input: oklch(0.105 0.012 252); // 输入框,比卡片更沉,形成凹陷感
// 半透明浮层需要 rgb 三元组才能拼 alpha,OKLCH 无法直接拆。
--bg-card-rgb: 40, 44, 56;
// Borders — 发丝线分两档
--border-color: oklch(0.305 0.018 242);