diff options
| author | Martin Kagamino Lehoux <martin@lehoux.net> | 2026-08-25 13:25:35 +0200 |
|---|---|---|
| committer | Martin Kagamino Lehoux <martin@lehoux.net> | 2026-08-25 13:25:35 +0200 |
| commit | d5de3a6fefbc57bccfb1fe688f9c190ccf87d58d (patch) | |
| tree | 4a368e1331e04348353a9d65b94a07f4e94ee6bf /web/static | |
| parent | 87e29e1eb5a113fbb40d452a193219a40780c302 (diff) | |
analytics grouping
Diffstat (limited to 'web/static')
| -rw-r--r-- | web/static/style.css | 16 |
1 files changed, 16 insertions, 0 deletions
diff --git a/web/static/style.css b/web/static/style.css index 5442ea8..3c9c05b 100644 --- a/web/static/style.css +++ b/web/static/style.css @@ -47,6 +47,14 @@ --color-profile-3-6: oklch(58% 0.17 255deg); --color-profile-6-9: oklch(58% 0.2 25deg); --color-profile-9-plus: oklch(0% 0 0deg); + --color-category-1: oklch(65% 0.16 15deg); + --color-category-2: oklch(65% 0.16 60deg); + --color-category-3: oklch(65% 0.16 105deg); + --color-category-4: oklch(65% 0.16 150deg); + --color-category-5: oklch(65% 0.16 195deg); + --color-category-6: oklch(65% 0.16 240deg); + --color-category-7: oklch(65% 0.16 285deg); + --color-category-8: oklch(65% 0.16 330deg); } * { box-sizing: border-box; } @@ -137,6 +145,14 @@ select { border: 1px solid var(--color-input-border); border-radius: .55rem; pad .analytics-chart canvas { display: block; width: 100%; height: 26rem; border-radius: .65rem; background: var(--color-plot-surface); outline: none; } .analytics-chart canvas:focus-visible { box-shadow: 0 0 0 .2rem var(--color-focus); } .analytics-hover { display: block; min-height: 1.4rem; margin: .7rem 0 0; color: var(--color-muted); font-size: .9rem; } +.analytics-colorby-panel { margin-top: 1.25rem; } +.analytics-colorby-panel .section-heading { flex-wrap: wrap; } +.analytics-colorby-label { display: flex; flex-direction: column; gap: .35rem; font-size: .9rem; font-weight: 650; color: var(--color-forest); } +.analytics-colorby-label select { margin-top: .25rem; font-weight: 500; color: var(--color-foreground); } +.analytics-legend { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin: 0; padding: 0; list-style: none; } +.analytics-legend[hidden] { display: none; } +.analytics-legend-item { display: flex; align-items: center; gap: .4rem; font-size: .9rem; color: var(--color-foreground); } +.analytics-legend-swatch { width: .75rem; height: .75rem; border-radius: .2rem; background: currentcolor; } .section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; } .section-heading .eyebrow { margin-bottom: .2rem; } .section-heading h2 { margin: 0; font-size: 1.2rem; } |