design.estate/dees-catalog
3
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(theme): align component styles with shared theme CSS variables

Browse Source
This commit is contained in:
Jürgen Kunz
2026-04-04 10:50:19 +00:00
parent dcef6faa66
commit ca290d1267
15 changed files with 159 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
ts_web/elements/00group-chart/dees-chart-log/dees-chart-log.ts
View File

@@ -106,7 +106,7 @@ export class DeesChartLog extends DeesElement {
display: block;
height: 400px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
color: ${cssManager.bdTheme('hsl(0 0% 3.9%)', 'hsl(0 0% 98%)')};
color: var(--dees-color-text-primary);
}
dees-tile {
@@ -124,7 +124,7 @@ export class DeesChartLog extends DeesElement {
.title {
font-weight: 500;
font-size: 14px;
color: ${cssManager.bdTheme('hsl(0 0% 9%)', 'hsl(0 0% 95%)')};
color: var(--dees-color-text-primary);
white-space: nowrap;
}
@@ -141,10 +141,10 @@ export class DeesChartLog extends DeesElement {
flex: 1;
padding: 4px 8px;
font-size: 12px;
border: 1px solid ${cssManager.bdTheme('hsl(0 0% 89.8%)', 'hsl(0 0% 14.9%)')};
border: 1px solid var(--dees-color-border-default);
border-radius: 4px;
background: ${cssManager.bdTheme('hsl(0 0% 100%)', 'hsl(0 0% 9%)')};
color: ${cssManager.bdTheme('hsl(0 0% 9%)', 'hsl(0 0% 95%)')};
background: var(--dees-color-bg-primary);
color: var(--dees-color-text-primary);
outline: none;
}
@@ -153,7 +153,7 @@ export class DeesChartLog extends DeesElement {
}
.search-box input::placeholder {
color: ${cssManager.bdTheme('hsl(0 0% 63.9%)', 'hsl(0 0% 45.1%)')};
color: var(--dees-color-text-muted);
}
.search-nav {
@@ -164,35 +164,35 @@ export class DeesChartLog extends DeesElement {
.search-nav button {
padding: 4px 6px;
font-size: 11px;
background: ${cssManager.bdTheme('hsl(0 0% 100%)', 'hsl(0 0% 14.9%)')};
border: 1px solid ${cssManager.bdTheme('hsl(0 0% 89.8%)', 'hsl(0 0% 14.9%)')};
background: var(--dees-color-bg-primary);
border: 1px solid var(--dees-color-border-default);
border-radius: 3px;
color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')};
color: var(--dees-color-text-muted);
cursor: pointer;
line-height: 1;
}
.search-nav button:hover {
background: ${cssManager.bdTheme('hsl(0 0% 95.1%)', 'hsl(0 0% 20%)')};
color: ${cssManager.bdTheme('hsl(0 0% 15%)', 'hsl(0 0% 93.9%)')};
background: var(--dees-color-hover);
color: var(--dees-color-text-primary);
}
.filter-toggle {
padding: 4px 8px;
font-size: 11px;
font-weight: 500;
background: ${cssManager.bdTheme('hsl(0 0% 100%)', 'hsl(0 0% 14.9%)')};
border: 1px solid ${cssManager.bdTheme('hsl(0 0% 89.8%)', 'hsl(0 0% 14.9%)')};
background: var(--dees-color-bg-primary);
border: 1px solid var(--dees-color-border-default);
border-radius: 4px;
color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')};
color: var(--dees-color-text-muted);
cursor: pointer;
transition: all 0.15s;
white-space: nowrap;
}
.filter-toggle:hover {
background: ${cssManager.bdTheme('hsl(0 0% 95.1%)', 'hsl(0 0% 20%)')};
color: ${cssManager.bdTheme('hsl(0 0% 15%)', 'hsl(0 0% 93.9%)')};
background: var(--dees-color-hover);
color: var(--dees-color-text-primary);
}
.filter-toggle.active {
@@ -208,11 +208,11 @@ export class DeesChartLog extends DeesElement {
}
.control-button {
background: ${cssManager.bdTheme('hsl(0 0% 100%)', 'hsl(0 0% 14.9%)')};
border: 1px solid ${cssManager.bdTheme('hsl(0 0% 89.8%)', 'hsl(0 0% 14.9%)')};
background: var(--dees-color-bg-primary);
border: 1px solid var(--dees-color-border-default);
border-radius: 4px;
padding: 4px 10px;
color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')};
color: var(--dees-color-text-muted);
cursor: pointer;
font-size: 12px;
font-weight: 500;
@@ -220,9 +220,9 @@ export class DeesChartLog extends DeesElement {
}
.control-button:hover {
background: ${cssManager.bdTheme('hsl(0 0% 95.1%)', 'hsl(0 0% 20%)')};
border-color: ${cssManager.bdTheme('hsl(0 0% 79.8%)', 'hsl(0 0% 25%)')};
color: ${cssManager.bdTheme('hsl(0 0% 15%)', 'hsl(0 0% 93.9%)')};
background: var(--dees-color-hover);
border-color: var(--dees-color-border-strong);
color: var(--dees-color-text-primary);
}
.control-button.active {
@@ -247,7 +247,7 @@ export class DeesChartLog extends DeesElement {
align-items: center;
justify-content: center;
height: 100%;
color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')};
color: var(--dees-color-text-muted);
font-style: italic;
font-size: 13px;
}
@@ -299,7 +299,7 @@ export class DeesChartLog extends DeesElement {
.metric.rate {
margin-left: auto;
color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')};
color: var(--dees-color-text-muted);
}
.metric.rate::before {