feat(DimensionFilter): dark/light theme via CSS variables and dimension-filter class

This commit is contained in:
yumoqing 2026-07-31 11:55:39 +08:00
parent 1034b53341
commit c726b95714
2 changed files with 14 additions and 0 deletions

View File

@ -978,3 +978,16 @@ hr {
background-color: var(--sage-brand, #6366f1) !important; background-color: var(--sage-brand, #6366f1) !important;
color: #fff !important; color: #fff !important;
} }
[data-theme="dark"] .dimension-btn-active {
background-color: var(--sage-brand, #818cf8) !important;
}
/* DimensionFilter base */
.dimension-filter {
background: var(--sage-bg, #fff);
color: var(--sage-text, #333);
}
[data-theme="dark"] .dimension-filter {
background: var(--sage-bg-dark, #1e1e2e);
color: var(--sage-text-dark, #e0e0e0);
}

View File

@ -19,6 +19,7 @@ bricks.DimensionFilter = class extends bricks.VBox {
super(opts); super(opts);
this.dom_element.style.display = 'flex'; this.dom_element.style.display = 'flex';
this.dom_element.style.flexDirection = 'column'; this.dom_element.style.flexDirection = 'column';
this.set_css('dimension-filter');
this.selected_h_id = 'all'; this.selected_h_id = 'all';
this.selected_v_id = 'all'; this.selected_v_id = 'all';
this.search_keyword = ''; this.search_keyword = '';