fix(web): 评论输入框跟随深浅主题 - #99
Merged
Merged
Conversation
.docwall-fb-input 只定义了尺寸字体，没声明 background/color/border， 全局表单主题规则（.panel textarea 等）又覆盖不到抽屉，导致浅色主题 下评论框仍是浏览器默认白底。补上与 .panel 输入控件一致的令牌样式 （底色/边框/文字/focus 光环/placeholder），评论条目底色用 --bg-panel 与抽屉面区分层次。 另在根元素声明 color-scheme 跟随 data-theme：不声明时浏览器原生 控件（textarea、滚动条、下拉）一律按亮色渲染，暗色主题下同样露白。
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
背景
文稿视图的评论抽屉里，评论输入框在浅色主题下仍是浏览器默认白底黑字，与面板底色割裂；深色主题下更刺眼。用户实测反馈「评论输入框没有按照主题适配」。
根因
.docwall-fb-input（doc-wall.css）只定义了 resize/min-height/font，没声明background/color/border。全局表单主题规则选择器是.panel textarea这类容器限定，覆盖不到 fixed 定位的评论抽屉，于是 textarea 走了 UA 默认样式（白底）。另一个同源问题：全站从未声明
color-scheme，浏览器原生控件（textarea、滚动条、下拉箭头）一律按亮色渲染，data-theme='dark'时同样露白。方案
.docwall-fb-input补齐与.panel输入控件同源的令牌样式：--bg-raised底、--border-strong边、--fg文字、focus 光环--shadow-glow、placeholder--fg-faint；评论条目.docwall-fb-item加--bg-panel底色区分层次。html { color-scheme: dark }+html[data-theme='light'] { color-scheme: light }，原生控件跟随主题。验证
cd web && npm test：14 套全过（0 fail）sh dsh-plugins/build-web.sh：双 base 构建通过