Add Match Terminal Background sidebar setting (#2293)

* Add "Match Terminal Background" sidebar setting

Adds a toggle in Settings > Sidebar Appearance that makes the sidebar
use the same background color and transparency as the terminal area.

Uses layer-level opacity on a fully opaque background color (the same
technique as TitlebarLayerBackground) with effective opacity formula
`1 - (1-alpha)^2` to account for the terminal's two stacked
semi-transparent layers (Bonsplit chrome + Ghostty Metal surface).

Also adds a 1px trailing border derived from the terminal chrome color,
matching the bonsplit tab bar separator logic.

* Fix sidebar border color not updating on theme change

Add @State + .onReceive(.ghosttyDefaultBackgroundDidChange) to
SidebarTrailingBorder so the separator color recomputes when the
Ghostty theme changes, matching the pattern used in SidebarBackdrop.

* Address review comments: localize debug toggle, fix separator refresh

- Localize the debug panel toggle label (Codex P1)
- Add .onAppear to SidebarTrailingBorder for initial color (Cubic P2)
- Fix stale doc comment on SidebarTerminalBackgroundView (Cubic P3)

---------

Co-authored-by: Lawrence Chen <lawrencecchen@users.noreply.github.com>
This commit is contained in:
Lawrence Chen 2026-03-28 04:36:20 -07:00 committed by GitHub
parent e9afc22353
commit 550d98ca4f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 165 additions and 22 deletions

View file

@ -83198,6 +83198,40 @@
}
}
},
"settings.sidebarAppearance.matchTerminalBackground": {
"extractionState": "manual",
"localizations": {
"en": {
"stringUnit": {
"state": "translated",
"value": "Match Terminal Background"
}
},
"ja": {
"stringUnit": {
"state": "translated",
"value": "ターミナルの背景に合わせる"
}
}
}
},
"settings.sidebarAppearance.matchTerminalBackground.subtitle": {
"extractionState": "manual",
"localizations": {
"en": {
"stringUnit": {
"state": "translated",
"value": "Use the same background color and transparency as the terminal."
}
},
"ja": {
"stringUnit": {
"state": "translated",
"value": "ターミナルと同じ背景色と透明度を使用します。"
}
}
}
},
"settings.sidebarAppearance.tintColorLight": {
"extractionState": "manual",
"localizations": {