feat(web): redesign spawn dialog advanced area (#205)
ci / web (push) Successful in 40s
ci / flake (push) Successful in 3m51s
ci / rust (push) Successful in 6m26s

This commit was merged in pull request #205.
This commit is contained in:
2026-09-07 10:50:44 +01:00
parent 17a57269f7
commit ac8a1b319d
2 changed files with 61 additions and 49 deletions
+27 -17
View File
@@ -3443,14 +3443,9 @@ input.leaf-rename:focus {
overflow-y: visible;
}
/* Rides the bottom of the scroll box: reachable at any scroll position, and
`margin-top: auto` keeps it at the screen's foot when the form is short. */
.spawn-modal .form-actions {
position: sticky;
bottom: 0;
margin-top: auto;
padding: var(--sp-2) 0 calc(var(--sp-2) + env(safe-area-inset-bottom, 0px));
background: var(--surface);
padding-bottom: calc(var(--sp-2) + env(safe-area-inset-bottom, 0px));
box-shadow: 0 -8px 12px -8px oklch(0 0 0 / 0.5);
}
@@ -3532,20 +3527,16 @@ input.leaf-rename:focus {
flex: 0 0 auto;
}
.worktree {
border: 1px solid var(--border);
border-radius: var(--r-2);
padding: 0 var(--sp-3);
margin: 0;
.advanced {
display: flex;
flex-direction: column;
background: color-mix(in oklab, var(--surface-2) 50%, transparent);
}
.worktree .wt-toggle {
margin: 0 calc(var(--sp-3) * -1);
padding-left: var(--sp-3);
width: calc(100% + var(--sp-3) * 2);
.advanced .wt-toggle {
border-top: 1px solid var(--border);
border-radius: 0;
padding-top: var(--sp-2);
padding-bottom: var(--sp-2);
}
.wt-summary {
@@ -3557,13 +3548,27 @@ input.leaf-rename:focus {
display: flex;
flex-direction: column;
gap: var(--sp-3);
padding-bottom: var(--sp-3);
padding: var(--sp-2) 0 var(--sp-1);
}
.wt-collapsible[hidden] {
display: none;
}
/* Worktree sub-group: left accent border when expanded, visually nested. */
.adv-group {
display: flex;
flex-direction: column;
gap: var(--sp-3);
padding-left: var(--sp-3);
border-left: 2px solid var(--border);
margin-top: var(--sp-1);
}
.adv-group:has(input[name="worktree_enabled"]:checked) {
border-left-color: var(--accent);
}
.form-error {
color: var(--danger);
margin: 0;
@@ -3881,6 +3886,11 @@ input.leaf-rename:focus {
gap: var(--sp-2);
justify-content: flex-end;
margin-top: var(--sp-2);
position: sticky;
bottom: 0;
padding: var(--sp-2) 0;
background: var(--surface);
z-index: 1;
}
.reroll {