cameleer/design-system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: enforce 12px minimum font size across all components
All checks were successful
Build & Publish / publish (push) Successful in 1m2s
Details
SonarQube Analysis / sonarqube (push) Successful in 2m25s
Details

Browse Source 
Add --font-size-min: 12px token to tokens.css. Replace all 10px and 11px
font-size declarations with 12px across 54 CSS module files for improved
readability.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-04-08 12:13:17 +02:00
parent 7e545140a2
commit 433d0926e6
54 changed files with 141 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/design-system/composites/AreaChart/AreaChart.module.css
View File

@@ -72,7 +72,7 @@
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
box-shadow: var(--shadow-md); box-shadow: var(--shadow-md);
padding: 6px 10px; padding: 6px 10px;
font-size: 11px; font-size: 12px;
pointer-events: none; pointer-events: none;
z-index: 10; z-index: 10;
white-space: nowrap; white-space: nowrap;
@@ -118,7 +118,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
} }
@@ -130,12 +130,12 @@
} }
.legendLabel { .legendLabel {
font-size: 11px; font-size: 12px;
} }
/* Axis labels */ /* Axis labels */
.yLabel { .yLabel {
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
writing-mode: vertical-lr; writing-mode: vertical-lr;
transform: rotate(180deg); transform: rotate(180deg);
@@ -151,7 +151,7 @@
.xLabel { .xLabel {
text-align: center; text-align: center;
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
padding-left: 48px; padding-left: 48px;
} }

2
src/design-system/composites/AvatarGroup/AvatarGroup.module.css
View File

@@ -32,7 +32,7 @@
background-color: var(--bg-inset); background-color: var(--bg-inset);
color: var(--text-secondary); color: var(--text-secondary);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
flex-shrink: 0; flex-shrink: 0;
margin-left: -8px; margin-left: -8px;

12
src/design-system/composites/BarChart/BarChart.module.css
View File

@@ -53,7 +53,7 @@
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
box-shadow: var(--shadow-md); box-shadow: var(--shadow-md);
padding: 6px 10px; padding: 6px 10px;
font-size: 11px; font-size: 12px;
pointer-events: none; pointer-events: none;
z-index: 10; z-index: 10;
white-space: nowrap; white-space: nowrap;
@@ -63,7 +63,7 @@
font-weight: 600; font-weight: 600;
color: var(--text-primary); color: var(--text-primary);
margin-bottom: 4px; margin-bottom: 4px;
font-size: 11px; font-size: 12px;
} }
.tooltipRow { .tooltipRow {
@@ -105,7 +105,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
} }
@@ -117,11 +117,11 @@
} }
.legendLabel { .legendLabel {
font-size: 11px; font-size: 12px;
} }
.yLabel { .yLabel {
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
writing-mode: vertical-lr; writing-mode: vertical-lr;
transform: rotate(180deg); transform: rotate(180deg);
@@ -137,7 +137,7 @@
.xLabel { .xLabel {
text-align: center; text-align: center;
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
padding-left: 48px; padding-left: 48px;
} }

2
src/design-system/composites/Breadcrumb/Breadcrumb.module.css
View File

@@ -16,7 +16,7 @@
.sep { .sep {
color: var(--text-faint); color: var(--text-faint);
font-size: 11px; font-size: 12px;
} }
.link { .link {

16
src/design-system/composites/CommandPalette/CommandPalette.module.css
View File

@@ -63,7 +63,7 @@
border: 1px solid var(--amber-light); border: 1px solid var(--amber-light);
border-radius: 4px; border-radius: 4px;
padding: 1px 6px; padding: 1px 6px;
font-size: 11px; font-size: 12px;
flex-shrink: 0; flex-shrink: 0;
} }
@@ -133,7 +133,7 @@
background: var(--bg-inset); background: var(--bg-inset);
border-radius: 10px; border-radius: 10px;
padding: 0 6px; padding: 0 6px;
font-size: 10px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
color: var(--text-muted); color: var(--text-muted);
} }
@@ -227,7 +227,7 @@
display: inline-flex; display: inline-flex;
padding: 1px 7px; padding: 1px 7px;
border-radius: 10px; border-radius: 10px;
font-size: 10px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
font-weight: 600; font-weight: 600;
background: var(--bg-inset); background: var(--bg-inset);
@@ -239,13 +239,13 @@
.itemTime { .itemTime {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
color: var(--text-faint); color: var(--text-faint);
margin-left: auto; margin-left: auto;
} }
.itemMeta { .itemMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
margin-top: 2px; margin-top: 2px;
@@ -259,7 +259,7 @@
border: none; border: none;
color: var(--text-muted); color: var(--text-muted);
cursor: pointer; cursor: pointer;
font-size: 10px; font-size: 12px;
padding: 2px 6px; padding: 2px 6px;
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
flex-shrink: 0; flex-shrink: 0;
@@ -279,7 +279,7 @@
/* Match context snippet */ /* Match context snippet */
.matchContext { .matchContext {
font-size: 11px; font-size: 12px;
color: var(--text-faint); color: var(--text-faint);
font-family: var(--font-mono); font-family: var(--font-mono);
margin-top: 3px; margin-top: 3px;
@@ -316,6 +316,6 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
} }

8
src/design-system/composites/DataTable/DataTable.module.css
View File

@@ -42,7 +42,7 @@
.th { .th {
padding: 9px 14px; padding: 9px 14px;
text-align: left; text-align: left;
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.8px; letter-spacing: 0.8px;
@@ -147,7 +147,7 @@
.rangeInfo { .rangeInfo {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 12px;
} }
.paginationRight { .paginationRight {
@@ -157,7 +157,7 @@
} }
.pageSizeLabel { .pageSizeLabel {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
} }
@@ -173,7 +173,7 @@
.pageNum { .pageNum {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
min-width: 40px; min-width: 40px;
text-align: center; text-align: center;

8
src/design-system/composites/EventFeed/EventFeed.module.css
View File

@@ -29,7 +29,7 @@
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
background: var(--bg-surface); background: var(--bg-surface);
font-size: 11px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
color: var(--text-primary); color: var(--text-primary);
outline: none; outline: none;
@@ -81,7 +81,7 @@
background: none; background: none;
border: none; border: none;
color: var(--text-muted); color: var(--text-muted);
font-size: 11px; font-size: 12px;
cursor: pointer; cursor: pointer;
padding: 2px 6px; padding: 2px 6px;
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
@@ -165,7 +165,7 @@
} }
.time { .time {
font-size: 10px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
color: var(--text-muted); color: var(--text-muted);
margin-top: 1px; margin-top: 1px;
@@ -215,7 +215,7 @@
border: 1px solid var(--amber-light); border: 1px solid var(--amber-light);
border-radius: 0; border-radius: 0;
color: var(--amber-deep); color: var(--amber-deep);
font-size: 11px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
cursor: pointer; cursor: pointer;
text-align: center; text-align: center;

2
src/design-system/composites/FilterBar/FilterBar.module.css
View File

@@ -43,7 +43,7 @@
} }
.clearAll { .clearAll {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
cursor: pointer; cursor: pointer;
padding: 3px 6px; padding: 3px 6px;

2
src/design-system/composites/GroupCard/GroupCard.module.css
View File

@@ -63,7 +63,7 @@
gap: 16px; gap: 16px;
padding: 8px 16px; padding: 8px 16px;
border-bottom: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle);
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
background: var(--bg-surface); background: var(--bg-surface);
} }

6
src/design-system/composites/KpiStrip/KpiStrip.module.css
View File

@@ -30,7 +30,7 @@
} }
.label { .label {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.6px; letter-spacing: 0.6px;
@@ -55,7 +55,7 @@
.trend { .trend {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 12px;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 2px; gap: 2px;
@@ -68,7 +68,7 @@
.trendMuted { color: var(--text-muted); } .trendMuted { color: var(--text-muted); }
.subtitle { .subtitle {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
margin-top: 2px; margin-top: 2px;
} }

10
src/design-system/composites/LineChart/LineChart.module.css
View File

@@ -63,7 +63,7 @@
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
box-shadow: var(--shadow-md); box-shadow: var(--shadow-md);
padding: 6px 10px; padding: 6px 10px;
font-size: 11px; font-size: 12px;
pointer-events: none; pointer-events: none;
z-index: 10; z-index: 10;
white-space: nowrap; white-space: nowrap;
@@ -108,7 +108,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
} }
@@ -120,11 +120,11 @@
} }
.legendLabel { .legendLabel {
font-size: 11px; font-size: 12px;
} }
.yLabel { .yLabel {
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
writing-mode: vertical-lr; writing-mode: vertical-lr;
transform: rotate(180deg); transform: rotate(180deg);
@@ -140,7 +140,7 @@
.xLabel { .xLabel {
text-align: center; text-align: center;
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
padding-left: 48px; padding-left: 48px;
} }

2
src/design-system/composites/LogViewer/LogViewer.module.css
View File

@@ -18,7 +18,7 @@
.timestamp { .timestamp {
flex-shrink: 0; flex-shrink: 0;
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
min-width: 56px; min-width: 56px;
} }

4
src/design-system/composites/LoginForm/LoginForm.module.css
View File

@@ -51,7 +51,7 @@
.dividerText { .dividerText {
color: var(--text-muted); color: var(--text-muted);
font-size: 11px; font-size: 12px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.5px; letter-spacing: 0.5px;
font-weight: 500; font-weight: 500;
@@ -71,7 +71,7 @@
} }
.forgotLink { .forgotLink {
font-size: 11px; font-size: 12px;
color: var(--amber); color: var(--amber);
font-weight: 500; font-weight: 500;
background: none; background: none;

4
src/design-system/composites/MenuItem/MenuItem.module.css
View File

@@ -45,7 +45,7 @@
} }
.meta { .meta {
font-size: 11px; font-size: 12px;
color: var(--sidebar-muted); color: var(--sidebar-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
white-space: nowrap; white-space: nowrap;
@@ -59,7 +59,7 @@
.count { .count {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 12px;
color: var(--sidebar-muted); color: var(--sidebar-muted);
background: rgba(255, 255, 255, 0.06); background: rgba(255, 255, 255, 0.06);
padding: 1px 6px; padding: 1px 6px;

2
src/design-system/composites/MultiSelect/MultiSelect.module.css
View File

@@ -46,7 +46,7 @@
.chevron { .chevron {
color: var(--text-faint); color: var(--text-faint);
font-size: 11px; font-size: 12px;
flex-shrink: 0; flex-shrink: 0;
} }

6
src/design-system/composites/ProcessorTimeline/ProcessorTimeline.module.css
View File

@@ -8,7 +8,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 8px; gap: 8px;
font-size: 11px; font-size: 12px;
} }
.row.clickable { .row.clickable {
@@ -32,7 +32,7 @@
text-align: right; text-align: right;
color: var(--text-secondary); color: var(--text-secondary);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@@ -83,7 +83,7 @@
.dur { .dur {
width: 42px; width: 42px;
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
flex-shrink: 0; flex-shrink: 0;
text-align: right; text-align: right;

6
src/design-system/composites/RouteFlow/RouteFlow.module.css
View File

@@ -52,7 +52,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 10px; font-size: 12px;
flex-shrink: 0; flex-shrink: 0;
} }
@@ -97,7 +97,7 @@
.label { .label {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
color: var(--text-primary); color: var(--text-primary);
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
@@ -112,7 +112,7 @@
.duration { .duration {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
} }

2
src/design-system/composites/SegmentedTabs/SegmentedTabs.module.css
View File

@@ -57,7 +57,7 @@
.count { .count {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
background: var(--bg-hover); background: var(--bg-hover);
color: var(--text-muted); color: var(--text-muted);

2
src/design-system/composites/ShortcutsBar/ShortcutsBar.module.css
View File

@@ -17,7 +17,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
background: var(--bg-surface); background: var(--bg-surface);
border: 1px solid var(--border-subtle); border: 1px solid var(--border-subtle);

2
src/design-system/composites/Tabs/Tabs.module.css
View File

@@ -38,7 +38,7 @@
.count { .count {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
background: var(--bg-inset); background: var(--bg-inset);
color: var(--text-muted); color: var(--text-muted);
padding: 1px 5px; padding: 1px 5px;

4
src/design-system/composites/TreeView/TreeView.module.css
View File

@@ -59,7 +59,7 @@
} }
.chevron { .chevron {
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
line-height: 1; line-height: 1;
} }
@@ -85,7 +85,7 @@
.meta { .meta {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
margin-left: auto; margin-left: auto;
padding-left: 8px; padding-left: 8px;

8
src/design-system/layout/Sidebar/Sidebar.module.css
View File

@@ -70,7 +70,7 @@
.version { .version {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
color: var(--sidebar-muted); color: var(--sidebar-muted);
margin-left: 4px; margin-left: 4px;
} }
@@ -238,7 +238,7 @@
} }
.treeSectionLabel { .treeSectionLabel {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
@@ -313,7 +313,7 @@
padding: 0; padding: 0;
margin: 0; margin: 0;
color: var(--sidebar-muted); color: var(--sidebar-muted);
font-size: 11px; font-size: 12px;
cursor: pointer; cursor: pointer;
line-height: 1; line-height: 1;
display: flex; display: flex;
@@ -345,7 +345,7 @@
/* Badge */ /* Badge */
.treeBadge { .treeBadge {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
color: var(--sidebar-muted); color: var(--sidebar-muted);
background: rgba(255, 255, 255, 0.06); background: rgba(255, 255, 255, 0.06);
padding: 1px 6px; padding: 1px 6px;

6
src/design-system/layout/TopBar/TopBar.module.css
View File

@@ -62,7 +62,7 @@
.kbd { .kbd {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
background: var(--bg-surface); background: var(--bg-surface);
border: 1px solid var(--border); border: 1px solid var(--border);
padding: 0 4px; padding: 0 4px;
@@ -91,7 +91,7 @@
background: var(--bg-raised); background: var(--bg-raised);
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
letter-spacing: 0.5px; letter-spacing: 0.5px;
cursor: pointer; cursor: pointer;
@@ -162,7 +162,7 @@
background: var(--bg-raised); background: var(--bg-raised);
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.5px; letter-spacing: 0.5px;

2
src/design-system/primitives/Avatar/Avatar.module.css
View File

@@ -8,5 +8,5 @@
flex-shrink: 0; flex-shrink: 0;
} }
.sm { width: 24px; height: 24px; font-size: 9px; } .sm { width: 24px; height: 24px; font-size: 9px; }
.md { width: 28px; height: 28px; font-size: 11px; } .md { width: 28px; height: 28px; font-size: 12px; }
.lg { width: 40px; height: 40px; font-size: 14px; } .lg { width: 40px; height: 40px; font-size: 14px; }

2
src/design-system/primitives/Badge/Badge.module.css
View File

@@ -5,7 +5,7 @@
padding: 1px 8px; padding: 1px 8px;
border-radius: 10px; border-radius: 10px;
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
white-space: nowrap; white-space: nowrap;
border: 1px solid transparent; border: 1px solid transparent;

2
src/design-system/primitives/Button/Button.module.css
View File

@@ -13,7 +13,7 @@
.btn:disabled { opacity: 0.6; cursor: not-allowed; } .btn:disabled { opacity: 0.6; cursor: not-allowed; }
.sm { padding: 4px 10px; font-size: 11px; } .sm { padding: 4px 10px; font-size: 12px; }
.md { padding: 6px 14px; font-size: 12px; } .md { padding: 6px 14px; font-size: 12px; }
.primary { .primary {

2
src/design-system/primitives/Card/Card.module.css
View File

@@ -18,7 +18,7 @@
} }
.titleText { .titleText {
font-size: 11px; font-size: 12px;
text-transform: uppercase; text-transform: uppercase;
font-family: var(--font-mono); font-family: var(--font-mono);
font-weight: 600; font-weight: 600;

4
src/design-system/primitives/CodeBlock/CodeBlock.module.css
View File

@@ -26,7 +26,7 @@
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
cursor: pointer; cursor: pointer;
transition: all 0.15s; transition: all 0.15s;
@@ -49,5 +49,5 @@
user-select: none; user-select: none;
text-align: right; text-align: right;
margin-right: 12px; margin-right: 12px;
font-size: 11px; font-size: 12px;
} }

10
src/design-system/primitives/DateTimePicker/DateTimePicker.module.css
View File

@@ -5,7 +5,7 @@
} }
.label { .label {
font-size: 11px; font-size: 12px;
font-weight: 500; font-weight: 500;
color: var(--text-muted); color: var(--text-muted);
text-transform: uppercase; text-transform: uppercase;
@@ -18,7 +18,7 @@
background: transparent; background: transparent;
color: var(--text-primary); color: var(--text-primary);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 12px;
text-align: left; text-align: left;
cursor: pointer; cursor: pointer;
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
@@ -72,7 +72,7 @@
border: none; border: none;
background: none; background: none;
color: var(--text-muted); color: var(--text-muted);
font-size: 10px; font-size: 12px;
cursor: pointer; cursor: pointer;
padding: 4px 8px; padding: 4px 8px;
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
@@ -93,7 +93,7 @@
} }
.dayHeader { .dayHeader {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
color: var(--text-faint); color: var(--text-faint);
text-align: center; text-align: center;
@@ -151,7 +151,7 @@
} }
.timeLabel { .timeLabel {
font-size: 11px; font-size: 12px;
font-weight: 500; font-weight: 500;
color: var(--text-muted); color: var(--text-muted);
margin-right: auto; margin-right: auto;

4
src/design-system/primitives/FilterPill/FilterPill.module.css
View File

@@ -8,7 +8,7 @@
background: var(--bg-raised); background: var(--bg-raised);
color: var(--text-secondary); color: var(--text-secondary);
font-family: var(--font-body); font-family: var(--font-body);
font-size: 11px; font-size: 12px;
font-weight: 500; font-weight: 500;
cursor: pointer; cursor: pointer;
transition: all 0.15s; transition: all 0.15s;
@@ -49,7 +49,7 @@
.count { .count {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
background: var(--bg-inset); background: var(--bg-inset);
border-radius: 8px; border-radius: 8px;

4
src/design-system/primitives/FormField/FormField.module.css
View File

@@ -6,13 +6,13 @@
} }
.hint { .hint {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
margin-top: 4px; margin-top: 4px;
} }
.error { .error {
font-size: 11px; font-size: 12px;
color: var(--error); color: var(--error);
margin-top: 4px; margin-top: 4px;
} }

2
src/design-system/primitives/KeyboardHint/KeyboardHint.module.css
View File

@@ -1,6 +1,6 @@
.kbd { .kbd {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
background: var(--bg-raised); background: var(--bg-raised);
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 3px; border-radius: 3px;

4
src/design-system/primitives/MonoText/MonoText.module.css
View File

@@ -1,4 +1,4 @@
.mono { font-family: var(--font-mono); } .mono { font-family: var(--font-mono); }
.xs { font-size: 10px; } .xs { font-size: 12px; }
.sm { font-size: 11px; } .sm { font-size: 12px; }
.md { font-size: 13px; } .md { font-size: 13px; }

2
src/design-system/primitives/ProgressBar/ProgressBar.module.css
View File

@@ -7,7 +7,7 @@
.label { .label {
font-family: var(--font-body); font-family: var(--font-body);
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
line-height: 1; line-height: 1;
} }

2
src/design-system/primitives/SectionHeader/SectionHeader.module.css
View File

@@ -5,7 +5,7 @@
} }
.label { .label {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1.2px; letter-spacing: 1.2px;

2
src/design-system/primitives/Select/Select.module.css
View File

@@ -35,6 +35,6 @@
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
color: var(--text-faint); color: var(--text-faint);
font-size: 11px; font-size: 12px;
pointer-events: none; pointer-events: none;
} }

6
src/design-system/primitives/StatCard/StatCard.module.css
View File

@@ -21,7 +21,7 @@
} }
.label { .label {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1.2px; letter-spacing: 1.2px;
@@ -47,7 +47,7 @@
} }
.trend { .trend {
font-size: 11px; font-size: 12px;
font-weight: 500; font-weight: 500;
} }
@@ -56,7 +56,7 @@
.trend.neutral { color: var(--text-muted); } .trend.neutral { color: var(--text-muted); }
.detail { .detail {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
margin-top: 6px; margin-top: 6px;
} }

2
src/design-system/primitives/Tag/Tag.module.css
View File

@@ -5,7 +5,7 @@
padding: 3px 10px; padding: 3px 10px;
border: 1px solid; border: 1px solid;
border-radius: 20px; border-radius: 20px;
font-size: 11px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
} }

2
src/design-system/primitives/Tooltip/Tooltip.module.css
View File

@@ -10,7 +10,7 @@
padding: 5px 9px; padding: 5px 9px;
background: var(--text-primary); background: var(--text-primary);
color: var(--bg-surface); color: var(--bg-surface);
font-size: 11px; font-size: 12px;
font-family: var(--font-body); font-family: var(--font-body);
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
white-space: nowrap; white-space: nowrap;

1
src/design-system/tokens.css
View File

@@ -46,6 +46,7 @@
/* Typography */ /* Typography */
--font-body: 'DM Sans', system-ui, -apple-system, sans-serif; --font-body: 'DM Sans', system-ui, -apple-system, sans-serif;
--font-mono: 'JetBrains Mono', 'Fira Code', monospace; --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
--font-size-min: 12px;
/* Spacing & Radii */ /* Spacing & Radii */
--radius-sm: 5px; --radius-sm: 5px;

4
src/pages/Admin/AuditLog/AuditLog.module.css
View File

@@ -42,7 +42,7 @@
} }
.tableMeta { .tableMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
} }
@@ -72,7 +72,7 @@
} }
.detailLabel { .detailLabel {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.8px; letter-spacing: 0.8px;

2
src/pages/Admin/OidcConfig/OidcConfig.module.css
View File

@@ -24,7 +24,7 @@
} }
.hint { .hint {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-body); font-family: var(--font-body);
} }

4
src/pages/Admin/UserManagement/UserManagement.module.css
View File

@@ -11,7 +11,7 @@
} }
.entityMeta { .entityMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-body); font-family: var(--font-body);
margin-top: 2px; margin-top: 2px;
@@ -101,7 +101,7 @@
} }
.inheritedNote { .inheritedNote {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-style: italic; font-style: italic;
font-family: var(--font-body); font-family: var(--font-body);

12
src/pages/AgentHealth/AgentHealth.module.css
View File

@@ -19,7 +19,7 @@
.breakdown { .breakdown {
display: flex; display: flex;
gap: 8px; gap: 8px;
font-size: 11px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
} }
@@ -52,7 +52,7 @@
.scopeSep { .scopeSep {
color: var(--text-muted); color: var(--text-muted);
font-size: 10px; font-size: 12px;
} }
.scopeCurrent { .scopeCurrent {
@@ -76,7 +76,7 @@
} }
.sectionMeta { .sectionMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
} }
@@ -101,7 +101,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 16px; gap: 16px;
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
} }
@@ -118,7 +118,7 @@
gap: 8px; gap: 8px;
padding: 8px 16px; padding: 8px 16px;
background: var(--error-bg); background: var(--error-bg);
font-size: 11px; font-size: 12px;
color: var(--error); color: var(--error);
font-weight: 500; font-weight: 500;
} }
@@ -192,7 +192,7 @@
} }
.chartTitle { .chartTitle {
font-size: 11px; font-size: 12px;
font-weight: 600; font-weight: 600;
color: var(--text-secondary); color: var(--text-secondary);
text-transform: uppercase; text-transform: uppercase;

4
src/pages/AgentInstance/AgentInstance.module.css
View File

@@ -42,7 +42,7 @@
.scopeSep { .scopeSep {
color: var(--text-muted); color: var(--text-muted);
font-size: 10px; font-size: 12px;
} }
.scopeCurrent { .scopeCurrent {
@@ -82,7 +82,7 @@
} }
.chartMeta { .chartMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
} }

18
src/pages/Dashboard/Dashboard.module.css
View File

@@ -49,7 +49,7 @@
} }
.tableMeta { .tableMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
} }
@@ -97,7 +97,7 @@
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
} }
@@ -128,14 +128,14 @@
} }
.inlineErrorText { .inlineErrorText {
font-size: 11px; font-size: 12px;
color: var(--error); color: var(--error);
font-family: var(--font-mono); font-family: var(--font-mono);
line-height: 1.4; line-height: 1.4;
} }
.inlineErrorHint { .inlineErrorHint {
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
margin-top: 3px; margin-top: 3px;
} }
@@ -154,7 +154,7 @@
} }
.panelSectionTitle { .panelSectionTitle {
font-size: 11px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.5px; letter-spacing: 0.5px;
@@ -168,7 +168,7 @@
.panelSectionMeta { .panelSectionMeta {
margin-left: auto; margin-left: auto;
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 500; font-weight: 500;
text-transform: none; text-transform: none;
letter-spacing: 0; letter-spacing: 0;
@@ -189,7 +189,7 @@
} }
.overviewLabel { .overviewLabel {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.6px; letter-spacing: 0.6px;
@@ -209,14 +209,14 @@
.errorClass { .errorClass {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
color: var(--error); color: var(--error);
margin-bottom: 4px; margin-bottom: 4px;
} }
.errorMessage { .errorMessage {
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
line-height: 1.5; line-height: 1.5;
font-family: var(--font-mono); font-family: var(--font-mono);

24
src/pages/ExchangeDetail/ExchangeDetail.module.css
View File

@@ -75,7 +75,7 @@
} }
.headerStatLabel { .headerStatLabel {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.6px; letter-spacing: 0.6px;
@@ -105,7 +105,7 @@
} }
.chainLabel { .chainLabel {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.5px; letter-spacing: 0.5px;
@@ -120,7 +120,7 @@
padding: 4px 10px; padding: 4px 10px;
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
border: 1px solid var(--border-subtle); border: 1px solid var(--border-subtle);
font-size: 11px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
cursor: pointer; cursor: pointer;
background: var(--bg-surface); background: var(--bg-surface);
@@ -187,7 +187,7 @@
.procCount { .procCount {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 500; font-weight: 500;
padding: 1px 8px; padding: 1px 8px;
border-radius: 10px; border-radius: 10px;
@@ -205,7 +205,7 @@
.toggleBtn { .toggleBtn {
padding: 4px 12px; padding: 4px 12px;
font-size: 11px; font-size: 12px;
font-family: var(--font-body); font-family: var(--font-body);
border: none; border: none;
background: transparent; background: transparent;
@@ -297,7 +297,7 @@
.panelTag { .panelTag {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
padding: 1px 6px; padding: 1px 6px;
border-radius: 8px; border-radius: 8px;
background: var(--bg-inset); background: var(--bg-inset);
@@ -326,7 +326,7 @@
grid-template-columns: 140px 1fr; grid-template-columns: 140px 1fr;
padding: 4px 0; padding: 4px 0;
border-bottom: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle);
font-size: 11px; font-size: 12px;
} }
.headerKvRow:last-child { .headerKvRow:last-child {
@@ -356,7 +356,7 @@
} }
.sectionLabel { .sectionLabel {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.6px; letter-spacing: 0.6px;
@@ -369,7 +369,7 @@
.count { .count {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
padding: 0 5px; padding: 0 5px;
border-radius: 8px; border-radius: 8px;
background: var(--bg-inset); background: var(--bg-inset);
@@ -389,7 +389,7 @@
padding: 2px 8px; padding: 2px 8px;
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
background: var(--error-bg); background: var(--error-bg);
color: var(--error); color: var(--error);
@@ -398,7 +398,7 @@
.errorMessageBox { .errorMessageBox {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
background: var(--error-bg); background: var(--error-bg);
padding: 10px 12px; padding: 10px 12px;
@@ -414,7 +414,7 @@
display: grid; display: grid;
grid-template-columns: 120px 1fr; grid-template-columns: 120px 1fr;
gap: 4px 12px; gap: 4px 12px;
font-size: 11px; font-size: 12px;
} }
.errorDetailLabel { .errorDetailLabel {

2
src/pages/Inventory/Inventory.module.css
View File

@@ -57,7 +57,7 @@
} }
.navLabel { .navLabel {
font-size: 11px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;

2
src/pages/Inventory/sections/BrandAssetsSection.module.css
View File

@@ -76,7 +76,7 @@
} }
.logoExport { .logoExport {
font-size: 10px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
color: var(--text-muted); color: var(--text-muted);
background: var(--bg-body); background: var(--bg-body);

2
src/pages/Inventory/sections/CompositesSection.module.css
View File

@@ -56,7 +56,7 @@
} }
.demoLabel { .demoLabel {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-weight: 500; font-weight: 500;
} }

4
src/pages/Inventory/sections/LayoutSection.module.css
View File

@@ -56,7 +56,7 @@
} }
.demoLabel { .demoLabel {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-weight: 500; font-weight: 500;
} }
@@ -80,7 +80,7 @@
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
overflow: hidden; overflow: hidden;
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
} }

2
src/pages/Inventory/sections/PrimitivesSection.module.css
View File

@@ -56,7 +56,7 @@
} }
.demoLabel { .demoLabel {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-weight: 500; font-weight: 500;
} }

18
src/pages/RouteDetail/RouteDetail.module.css
View File

@@ -45,7 +45,7 @@
} }
.routeGroup { .routeGroup {
font-size: 11px; font-size: 12px;
font-family: var(--font-mono); font-family: var(--font-mono);
color: var(--text-muted); color: var(--text-muted);
background: var(--bg-inset); background: var(--bg-inset);
@@ -78,7 +78,7 @@
} }
.kpiLabel { .kpiLabel {
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.6px; letter-spacing: 0.6px;
@@ -124,7 +124,7 @@
} }
.sectionMeta { .sectionMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
} }
@@ -167,7 +167,7 @@
} }
.tableMeta { .tableMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
} }
@@ -196,7 +196,7 @@
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
} }
@@ -228,14 +228,14 @@
.errorClass { .errorClass {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 10px; font-size: 12px;
font-weight: 600; font-weight: 600;
color: var(--error); color: var(--error);
margin-bottom: 4px; margin-bottom: 4px;
} }
.errorText { .errorText {
font-size: 11px; font-size: 12px;
color: var(--error); color: var(--error);
font-family: var(--font-mono); font-family: var(--font-mono);
line-height: 1.4; line-height: 1.4;
@@ -264,7 +264,7 @@
} }
.errorPatternMessage { .errorPatternMessage {
font-size: 11px; font-size: 12px;
color: var(--text-secondary); color: var(--text-secondary);
font-family: var(--font-mono); font-family: var(--font-mono);
line-height: 1.5; line-height: 1.5;
@@ -274,7 +274,7 @@
} }
.errorPatternTime { .errorPatternTime {
font-size: 10px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
} }

4
src/pages/Routes/Routes.module.css
View File

@@ -30,7 +30,7 @@
} }
.refreshText { .refreshText {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
} }
@@ -66,7 +66,7 @@
} }
.tableMeta { .tableMeta {
font-size: 11px; font-size: 12px;
color: var(--text-muted); color: var(--text-muted);
font-family: var(--font-mono); font-family: var(--font-mono);
} }