Implement M1.5 visual design foundation: tokens, IBM Plex, theme toggle, chart themes

This commit is contained in:
2026-06-05 01:29:10 +03:00
parent 547edb85e4
commit 22f0556ef8
31 changed files with 713 additions and 136 deletions
+14 -11
View File
@@ -7,25 +7,27 @@
.header {
display: flex;
align-items: center;
gap: var(--space-3);
gap: var(--space-4);
height: var(--header-height);
padding: 0 var(--space-4);
border-bottom: 1px solid var(--color-border);
background: var(--color-surface);
padding: 0 var(--space-5);
border-bottom: var(--border-width) solid var(--border);
background: var(--layer-01);
flex: 0 0 auto;
}
.title {
font-weight: 600;
font-size: 16px;
letter-spacing: 0.01em;
}
.version {
font-family: var(--font-mono);
font-size: 11px;
color: var(--color-text-muted);
border: 1px solid var(--color-border);
color: var(--text-secondary);
border: var(--border-width) solid var(--border-strong);
border-radius: var(--radius);
padding: 1px var(--space-2);
padding: var(--space-1) var(--space-3);
}
.spacer {
@@ -41,14 +43,14 @@
.pane {
flex: 1 1 0;
min-width: 0;
padding: var(--space-4);
overflow: auto;
border-right: 1px solid var(--color-border);
border-right: var(--border-width) solid var(--border);
background: var(--bg);
}
/* Library is a fixed-ish sidebar; editor + preview share the rest. */
.panes > .pane:first-child {
flex: 0 0 260px;
flex: 0 0 280px;
}
/* Editor pane: Monaco manages its own scroll/layout, so no padding. */
@@ -56,7 +58,8 @@
flex: 1 1 0;
min-width: 0;
overflow: hidden;
border-right: 1px solid var(--color-border);
border-right: var(--border-width) solid var(--border);
background: var(--bg);
}
.pane:last-child {