max / goingson
- Co-Authored-By
- Claude Opus 5 (1M context) <noreply@anthropic.com>
1 file changed,
+21 insertions,
-15 deletions
| @@ -318,6 +318,12 @@ | |||
| 318 | 318 | --space-4: 1rem; | |
| 319 | 319 | --space-5: 1.25rem; | |
| 320 | 320 | --space-6: 1.5rem; | |
| 321 | + | /* The tail is coarser on purpose. Steps 1 to 6 climb by 0.25rem because | |
| 322 | + | that is the granularity UI density needs; above 1.5rem the values are | |
| 323 | + | layout gutters and page shells, where a 4px distinction is noise. | |
| 324 | + | 1.75rem and 2.5rem each had a single site and snap into this. */ | |
| 325 | + | --space-7: 2rem; | |
| 326 | + | --space-8: 3rem; | |
| 321 | 327 | ||
| 322 | 328 | --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; | |
| 323 | 329 | --font-serif: Georgia, 'Times New Roman', serif; | |
| @@ -566,7 +572,7 @@ | |||
| 566 | 572 | max-width: var(--width-container); | |
| 567 | 573 | width: 100%; | |
| 568 | 574 | margin: 0 auto; | |
| 569 | - | padding: var(--space-6) 1.75rem 2rem; | |
| 575 | + | padding: var(--space-6) var(--space-7) var(--space-7); | |
| 570 | 576 | } | |
| 571 | 577 | ||
| 572 | 578 | /* Page Header */ | |
| @@ -1404,7 +1410,7 @@ | |||
| 1404 | 1410 | ||
| 1405 | 1411 | .no-upcoming-events { | |
| 1406 | 1412 | text-align: center; | |
| 1407 | - | padding: 2rem; | |
| 1413 | + | padding: var(--space-7); | |
| 1408 | 1414 | color: var(--content-secondary); | |
| 1409 | 1415 | font-style: italic; | |
| 1410 | 1416 | } | |
| @@ -3241,17 +3247,17 @@ | |||
| 3241 | 3247 | /* 22. Empty & Error States */ | |
| 3242 | 3248 | .empty-state { | |
| 3243 | 3249 | text-align: center; | |
| 3244 | - | padding: 3rem; | |
| 3250 | + | padding: var(--space-8); | |
| 3245 | 3251 | color: var(--content-secondary); | |
| 3246 | 3252 | } | |
| 3247 | 3253 | ||
| 3248 | 3254 | .empty-state--compact { | |
| 3249 | - | padding: 2rem 1rem; | |
| 3255 | + | padding: var(--space-7) var(--space-4); | |
| 3250 | 3256 | font-size: var(--font-size-sm); | |
| 3251 | 3257 | } | |
| 3252 | 3258 | ||
| 3253 | 3259 | .empty-state--dashboard { | |
| 3254 | - | padding: 2rem 1rem; | |
| 3260 | + | padding: var(--space-7) var(--space-4); | |
| 3255 | 3261 | } | |
| 3256 | 3262 | ||
| 3257 | 3263 | .empty-state--error { | |
| @@ -3292,7 +3298,7 @@ | |||
| 3292 | 3298 | ||
| 3293 | 3299 | .error-state { | |
| 3294 | 3300 | text-align: center; | |
| 3295 | - | padding: 2rem; | |
| 3301 | + | padding: var(--space-7); | |
| 3296 | 3302 | color: var(--danger); | |
| 3297 | 3303 | background: color-mix(in srgb, var(--danger) 10%, var(--surface-raised)); | |
| 3298 | 3304 | border: var(--border-width-sm) solid var(--danger); | |
| @@ -3397,7 +3403,7 @@ | |||
| 3397 | 3403 | } | |
| 3398 | 3404 | ||
| 3399 | 3405 | .ui-mode-desktop .project-dashboard-grid { | |
| 3400 | - | gap: 2rem; | |
| 3406 | + | gap: var(--space-7); | |
| 3401 | 3407 | } | |
| 3402 | 3408 | ||
| 3403 | 3409 | .ui-mode-desktop .day-plan-sidebar { | |
| @@ -4374,7 +4380,7 @@ | |||
| 4374 | 4380 | ||
| 4375 | 4381 | .timeline-scroll-area { | |
| 4376 | 4382 | position: relative; | |
| 4377 | - | padding: 0.5rem 1rem 3rem 0.5rem; | |
| 4383 | + | padding: var(--space-2) var(--space-4) var(--space-8) var(--space-2); | |
| 4378 | 4384 | min-height: min-content; | |
| 4379 | 4385 | } | |
| 4380 | 4386 | ||
| @@ -4600,7 +4606,7 @@ | |||
| 4600 | 4606 | .empty-unscheduled { | |
| 4601 | 4607 | text-align: center; | |
| 4602 | 4608 | color: var(--content-secondary); | |
| 4603 | - | padding: 2rem 1rem; | |
| 4609 | + | padding: var(--space-7) var(--space-4); | |
| 4604 | 4610 | } | |
| 4605 | 4611 | ||
| 4606 | 4612 | /* 41. Settings */ | |
| @@ -4716,7 +4722,7 @@ | |||
| 4716 | 4722 | ||
| 4717 | 4723 | .settings-content { | |
| 4718 | 4724 | flex: 1; | |
| 4719 | - | padding: var(--space-6) 2rem; | |
| 4725 | + | padding: var(--space-6) var(--space-7); | |
| 4720 | 4726 | max-width: 640px; | |
| 4721 | 4727 | overflow-y: auto; | |
| 4722 | 4728 | } | |
| @@ -5114,7 +5120,7 @@ | |||
| 5114 | 5120 | #events-view, | |
| 5115 | 5121 | #projects-view, | |
| 5116 | 5122 | #emails-view { | |
| 5117 | - | padding-bottom: 2.5rem; | |
| 5123 | + | padding-bottom: var(--space-8); | |
| 5118 | 5124 | } | |
| 5119 | 5125 | ||
| 5120 | 5126 | /* Task view fills available height */ | |
| @@ -6990,7 +6996,7 @@ | |||
| 6990 | 6996 | ||
| 6991 | 6997 | .import-empty, | |
| 6992 | 6998 | .import-error { | |
| 6993 | - | padding: 2rem; | |
| 6999 | + | padding: var(--space-7); | |
| 6994 | 7000 | text-align: center; | |
| 6995 | 7001 | color: var(--content-muted); | |
| 6996 | 7002 | } | |
| @@ -8526,14 +8532,14 @@ | |||
| 8526 | 8532 | text-align: center; | |
| 8527 | 8533 | max-width: 400px; | |
| 8528 | 8534 | width: 100%; | |
| 8529 | - | padding: 2rem; | |
| 8535 | + | padding: var(--space-7); | |
| 8530 | 8536 | } | |
| 8531 | 8537 | ||
| 8532 | 8538 | .focus-header { | |
| 8533 | 8539 | display: flex; | |
| 8534 | 8540 | align-items: center; | |
| 8535 | 8541 | justify-content: space-between; | |
| 8536 | - | margin-bottom: 2rem; | |
| 8542 | + | margin-bottom: var(--space-7); | |
| 8537 | 8543 | } | |
| 8538 | 8544 | ||
| 8539 | 8545 | .focus-label { | |
| @@ -8578,7 +8584,7 @@ | |||
| 8578 | 8584 | ||
| 8579 | 8585 | .focus-task-name { | |
| 8580 | 8586 | color: var(--content-secondary); | |
| 8581 | - | margin-bottom: 2rem; | |
| 8587 | + | margin-bottom: var(--space-7); | |
| 8582 | 8588 | font-size: 0.9rem; | |
| 8583 | 8589 | } | |
| 8584 | 8590 |