refactor(dialogs): add unified dialog header chrome and opt-in markup
Introduce a shared dialog header style (.unified-dialog-header) in app.css and opt dialog components into the new chrome by updating their header markup. Headers now use unified-dialog-icon and unified-dialog-text elements (and import the matching Lucide icons where needed), which standardizes icon placement, title/eyebrow layout, close button styling and responsive behavior. The Command Palette layout was adjusted to include the new header and its grid rows. The CSS is explicitly opt-in (so page/section headers remain unchanged) and includes hover/focus styles and a theme-sensitive close color variable. This commit is a UI refactor only — no API or behavior logic changes.
This commit is contained in:
@@ -1932,10 +1932,10 @@
|
||||
|
||||
<div class="help-backdrop" role="presentation" onclick={handleBackdropClick}>
|
||||
<div class="help-overlay" role="dialog" aria-modal="true" aria-labelledby="help-title">
|
||||
<header class="help-header">
|
||||
<div class="help-title-wrap">
|
||||
<span class="help-mark"><CircleHelp size={19} aria-hidden="true" /></span>
|
||||
<div>
|
||||
<header class="help-header unified-dialog-header">
|
||||
<div class="help-title-wrap unified-dialog-heading">
|
||||
<span class="help-mark unified-dialog-icon"><CircleHelp size={19} aria-hidden="true" /></span>
|
||||
<div class="unified-dialog-text">
|
||||
<h2 id="help-title">{isGerman ? "Gitty Hilfe" : "Gitty Help"}</h2>
|
||||
<p>{isGerman ? "App-Anleitung und Git-Wissen an einem Ort" : "App guidance and Git knowledge in one place"}</p>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user