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

update fonts

Browse Source
This commit is contained in:
Juergen Kunz
2025-06-27 17:32:01 +00:00
parent 669f12e822
commit 3d7f5253e8
11 changed files with 54 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
ts_web/elements/dees-statsgrid.ts
View File

@ -1,5 +1,6 @@
import { demoFunc } from './dees-statsgrid.demo.js';
import * as plugins from './00plugins.js';
import { cssGeistFontFamily } from './00fonts.js';
import {
customElement,
html,
@ -79,6 +80,7 @@ export class DeesStatsGrid extends DeesElement {
:host {
display: block;
width: 100%;
font-family: ${cssGeistFontFamily};
}
/* CSS Variables for consistent spacing and sizing */
@ -194,7 +196,7 @@ export class DeesStatsGrid extends DeesElement {
font-size: var(--value-font-size);
font-weight: 600;
color: ${cssManager.bdTheme('hsl(215.3 25% 8.8%)', 'hsl(210 40% 98%)')};
line-height: 1;
line-height: 1.1;
display: flex;
align-items: baseline;
gap: 4px;
@ -251,10 +253,10 @@ export class DeesStatsGrid extends DeesElement {
.gauge-text {
fill: ${cssManager.bdTheme('hsl(215.3 25% 8.8%)', 'hsl(210 40% 98%)')};
font-family: ${cssGeistFontFamily};
font-size: var(--value-font-size);
font-weight: 600;
text-anchor: middle;
dominant-baseline: alphabetic;
letter-spacing: -0.025em;
}
@ -262,6 +264,7 @@ export class DeesStatsGrid extends DeesElement {
font-size: var(--unit-font-size);
fill: ${cssManager.bdTheme('hsl(215.4 16.3% 46.9%)', 'hsl(215 20.2% 65.1%)')};
font-weight: 400;
font-family: ${cssGeistFontFamily};
}
/* Percentage Styles */
@ -274,6 +277,7 @@ export class DeesStatsGrid extends DeesElement {
font-size: var(--value-font-size);
font-weight: 600;
color: ${cssManager.bdTheme('hsl(215.3 25% 8.8%)', 'hsl(210 40% 98%)')};
line-height: 1.1;
letter-spacing: -0.025em;
margin-bottom: 8px;
}
@ -311,6 +315,7 @@ export class DeesStatsGrid extends DeesElement {
font-size: var(--value-font-size);
font-weight: 600;
color: ${cssManager.bdTheme('hsl(215.3 25% 8.8%)', 'hsl(210 40% 98%)')};
line-height: 1.1;
letter-spacing: -0.025em;
}
@ -358,6 +363,7 @@ export class DeesStatsGrid extends DeesElement {
font-size: var(--value-font-size);
font-weight: 600;
color: ${cssManager.bdTheme('hsl(215.3 25% 8.8%)', 'hsl(210 40% 98%)')};
line-height: 1.1;
letter-spacing: -0.025em;
}
@ -401,7 +407,7 @@ export class DeesStatsGrid extends DeesElement {
<dees-contextmenu
.x=${this.contextMenuPosition.x}
.y=${this.contextMenuPosition.y}
.menuItems=${this.contextMenuActions}
.menuItems=${this.contextMenuActions as any}
@clicked=${() => this.contextMenuVisible = false}
></dees-contextmenu>
` : ''}
@ -521,8 +527,8 @@ export class DeesStatsGrid extends DeesElement {
stroke-dashoffset="${strokeDashoffset}"
/>
<!-- Value text -->
<text class="gauge-text" x="${centerX}" y="${centerY}">
<tspan>${value}</tspan>${tile.unit ? html`<tspan class="gauge-unit" dx="4">${tile.unit}</tspan>` : ''}
<text class="gauge-text" x="${centerX}" y="${centerY - 8}" dominant-baseline="middle">
<tspan>${value}</tspan>${tile.unit ? html`<tspan class="gauge-unit" dx="2" dy="0">${tile.unit}</tspan>` : ''}
</text>
</svg>
</div>