style(collapse): 为 ghost 模式表头添加下边框分隔

- 添加 border-bottom: 1px solid var(--bim-border-subtle)
- 修复 setTheme 中的 CSS 变量命名,使用标准名称
- 折叠的多个面板现在有明显的视觉分隔
This commit is contained in:
yuding
2026-01-28 16:03:07 +08:00
parent c66e34422f
commit ff0ca20e96
2 changed files with 6 additions and 7 deletions

View File

@@ -19,6 +19,7 @@
background-color: var(--bim-component-bg);
padding-left: 12px;
padding-right: 0;
border-bottom: 1px solid var(--bim-border-subtle);
}
.bim-collapse.is-ghost .bim-collapse-header:hover {

View File

@@ -213,13 +213,11 @@ export class BimCollapse implements IBimComponent {
public setTheme(theme: ThemeConfig): void {
const style = this.element.style;
style.setProperty('--bim-bg-color', theme.bgElevated);
style.setProperty('--bim-border-color', theme.borderDefault);
style.setProperty('--bim-text-color', theme.textPrimary);
style.setProperty('--bim-disabled-color', theme.textDisabled);
style.setProperty('--bim-content-bg-color', theme.bgElevated);
// 添加标准的 component 变量,供 CSS 使用
style.setProperty('--bim-bg-elevated', theme.bgElevated);
style.setProperty('--bim-border-default', theme.borderDefault);
style.setProperty('--bim-border-subtle', theme.borderSubtle);
style.setProperty('--bim-text-primary', theme.textPrimary);
style.setProperty('--bim-text-disabled', theme.textDisabled);
style.setProperty('--bim-component-bg', theme.componentBg);
style.setProperty('--bim-component-bg-hover', theme.componentBgHover);
style.setProperty('--bim-component-bg-active', theme.componentBgActive);