fix(dashboard): Planning panes fill to bottom; Goals card layout; Automations/Goals header margin
- Planning: .modal max-height:80vh capped the embedded panel ~49px short; .planning-view .planning-modal--embedded { max-height:none } (higher specificity) lets sidebar + detail fill to the view bottom.
- Goals: .goals-card-main had no flex so a long description grew to content width and starved the equal-weight Linked Missions column to ~13px; flex:1 + min-width:0 rebalances them.
- Small margin below the Automations + Goals headers so content clears the divider.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -21,6 +21,9 @@ The title row now comes from the shared .view-header (which supplies the --space
|
||||
/*
|
||||
FNXC:ViewHeader 2026-06-23-04:15:
|
||||
Body inset must equal the shared ViewHeader's horizontal padding (var(--space-xl)) so Goals cards align flush under the header title instead of sitting 8px to its left — the prior var(--space-lg) inset left the main pane visibly misaligned with the header. Add a top inset so the first card clears the header divider; flex:1 lets the content fill the scroll viewport so short lists don't leave the pane looking truncated.
|
||||
|
||||
FNXC:Goals 2026-06-23-04:45:
|
||||
Bump the top padding from var(--space-lg) to var(--space-xl) so the first card/warning gets clear breathing room below the header divider instead of reading flush against it (matches the small top-margin breathing room added to the embedded Automations body below its edge-to-edge header).
|
||||
*/
|
||||
.goals-view__content {
|
||||
display: flex;
|
||||
@@ -29,7 +32,7 @@ Body inset must equal the shared ViewHeader's horizontal padding (var(--space-xl
|
||||
gap: var(--space-lg);
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
padding: var(--space-lg) var(--space-xl) var(--space-xl);
|
||||
padding: var(--space-xl) var(--space-xl) var(--space-xl);
|
||||
}
|
||||
|
||||
.goals-count {
|
||||
@@ -124,7 +127,12 @@ FN-6828 keeps Goals action controls and linked-mission panels at intrinsic heigh
|
||||
border-color: color-mix(in srgb, var(--text-muted) 25%, transparent);
|
||||
}
|
||||
|
||||
/*
|
||||
FNXC:Goals 2026-06-23-04:45:
|
||||
The goal card is a 3-column flex row: .goals-card-main | .goals-card-actions | .goals-linked-missions. .goals-card-main previously had only min-width:0 (no flex), so it defaulted to flex:0 1 auto and sized to its content. A long markdown description made main grow to its full intrinsic width (measured 819px in a 1024px card), starving the equal-weight .goals-linked-missions (flex:1) down to ~13px — the linked-missions column collapsed and read as "messed up". Give main flex:1 so it shares row width with the linked-missions column (each ~50%) and both stay legible regardless of description length. min-width:0 keeps the markdown body from forcing overflow.
|
||||
*/
|
||||
.goals-card-main {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
|
||||
@@ -91,6 +91,11 @@ Embedded planning must blend into the main content like Command Center: no panel
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
background: transparent;
|
||||
/*
|
||||
FNXC:Planning 2026-06-23-04:45:
|
||||
The base .modal sets max-height:80vh; that wins over the equal-specificity .planning-modal--embedded { max-height:none } by source order, so the embedded panel was capped at 80vh (≈576px) and stopped ~49px short of the .planning-view bottom (measured: embedded bottom 635 vs view bottom 684). Re-assert max-height:none here at higher specificity (.planning-view .planning-modal--embedded) so the embedded shell — and therefore the sidebar list+footer and the detail pane below it — fills the full main-content height with no bottom gap, in both the initial (no-session) and active-session states.
|
||||
*/
|
||||
max-height: none;
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
@@ -1251,6 +1251,14 @@ Bring the embedded Automations header to the canonical ViewHeader treatment: edg
|
||||
margin-inline: var(--space-xl);
|
||||
}
|
||||
|
||||
/*
|
||||
FNXC:Automations 2026-06-23-04:45:
|
||||
With the header now edge-to-edge (its own border-bottom divider), the first body row sat too close to the divider. Add a small top margin on the first non-header child so the body content gets breathing room below the divider instead of reading flush against it. Scoped to the first body row only (the flex gap handles spacing between subsequent rows).
|
||||
*/
|
||||
.automations-embedded-header + :not(.automations-embedded-header) {
|
||||
margin-top: var(--space-sm);
|
||||
}
|
||||
|
||||
.automations-embedded-view > :last-child:not(.automations-embedded-header) {
|
||||
margin-bottom: var(--space-lg);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user