fix(样式): 修复暗黑主题下评论组件边框显示问题

修复评论组件在暗黑主题下边框显示异常的问题:
- 移除评论头部的固定底部边框,改由主题变量控制
- 修正主题变量作用域,确保变量在容器内生效
- 优化主题初始化逻辑,默认使用亮色主题
- 添加主题切换监听,支持动态切换亮色/暗黑主题
This commit is contained in:
anghunk
2026-01-27 11:31:02 +08:00
parent 1be4438598
commit 34072b33d0
4 changed files with 23 additions and 6 deletions

View File

@@ -126,9 +126,8 @@ export class CWDComments {
this.mountPoint = document.createElement('div');
this.mountPoint.className = 'cwd-comments-container';
this.shadowRoot.appendChild(this.mountPoint);
if (this.config.theme) {
this.mountPoint.setAttribute('data-theme', this.config.theme);
}
const theme = this.config.theme || 'light';
this.mountPoint.setAttribute('data-theme', theme);
this._applyCustomCss();
}

View File

@@ -41,7 +41,6 @@
.cwd-comments-header {
padding: 16px 0;
border-bottom: 1px solid var(--cwd-border);
}
.cwd-comments-count {

View File

@@ -3,7 +3,7 @@
* 支持主题切换
*/
:root,
.cwd-comments-container,
[data-theme="light"] {
/* 主色调 */
--cwd-primary: #0969da;