feat(theme): 重构主题系统,新增 glass-pill 按钮样式
- ThemeConfig 接口扩展至 60+ 语义化属性 - 新增深浅主题预设 (glassPill overrides) - button-group 支持 glass-pill 样式变体 - 默认主题改为浅色 - 移除 toolbar 容器硬编码定位 - 统一组件 CSS 变量命名规范 - 暂时隐藏下拉箭头
This commit is contained in:
@@ -1,16 +1,16 @@
|
||||
.bim-menu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: var(--bim-ui_bg_color, #2b2d30);
|
||||
background: var(--bim-bg-elevated);
|
||||
border-radius: 4px;
|
||||
padding: 4px 0;
|
||||
margin: 0; /* 移除默认外边距 */
|
||||
list-style: none; /* 移除列表小圆点 */
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
min-width: 160px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: var(--bim-shadow-lg);
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
||||
user-select: none;
|
||||
color: var(--bim-ui_text_primary, #ffffff);
|
||||
color: var(--bim-text-primary);
|
||||
}
|
||||
|
||||
.bim-menu-group {
|
||||
@@ -20,7 +20,7 @@
|
||||
|
||||
.bim-menu-divider {
|
||||
height: 1px;
|
||||
background-color: var(--bim-ui_border_color, #3e4145);
|
||||
background-color: var(--bim-divider);
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
@@ -32,11 +32,11 @@
|
||||
transition: background-color 0.2s;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
color: var(--bim-ui_text_primary, #ffffff);
|
||||
color: var(--bim-text-primary);
|
||||
}
|
||||
|
||||
.bim-menu-item:hover {
|
||||
background-color: var(--bim-ui_bg_hover, #3e4145);
|
||||
background-color: var(--bim-component-bg-hover);
|
||||
}
|
||||
|
||||
.bim-menu-item.disabled {
|
||||
|
||||
@@ -49,10 +49,11 @@ export class BimMenu implements IBimComponent {
|
||||
*/
|
||||
public setTheme(theme: ThemeConfig) {
|
||||
const style = this.element.style;
|
||||
style.setProperty('--bim-ui_bg_color', theme.panelBackground);
|
||||
style.setProperty('--bim-ui_text_primary', theme.textPrimary);
|
||||
style.setProperty('--bim-ui_border_color', theme.border);
|
||||
style.setProperty('--bim-ui_bg_hover', theme.componentHover);
|
||||
style.setProperty('--bim-bg-elevated', theme.bgElevated);
|
||||
style.setProperty('--bim-text-primary', theme.textPrimary);
|
||||
style.setProperty('--bim-divider', theme.divider);
|
||||
style.setProperty('--bim-component-bg-hover', theme.componentBgHover);
|
||||
style.setProperty('--bim-shadow-lg', theme.shadowLg);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user