feat(ui): add init repository dialog
Add a modal dialog to initialize a new Git repository, replacing the previous prompt-based flow. It integrates with the app state and invokes the initialization operation then opens the repository on confirmation. Also adds styles, keyboard handling, accessibility hints, a folder browser, initial-branch input, and German/English labels with busy state. - New dialog component with folder picker, branch input, and i18n. - Wire dialog open/close and confirm handler to init and open actions. - Add CSS rules for dialog layout, controls, and error/busy states.
This commit is contained in:
+35
@@ -3878,6 +3878,13 @@
|
||||
max-height: calc(100vh - 32px);
|
||||
overflow: auto;
|
||||
}
|
||||
.init-repository-dialog {
|
||||
display: block;
|
||||
width: min(540px, calc(100vw - 32px));
|
||||
height: auto;
|
||||
max-height: calc(100vh - 32px);
|
||||
overflow: auto;
|
||||
}
|
||||
.rename-branch-dialog {
|
||||
display: block;
|
||||
width: min(520px, calc(100vw - 32px));
|
||||
@@ -4172,6 +4179,34 @@
|
||||
gap: 14px;
|
||||
padding: 16px;
|
||||
}
|
||||
.init-repository-header { padding: 16px 18px; }
|
||||
.init-repository-heading { display: flex; align-items: center; gap: 12px; }
|
||||
.init-repository-heading h2 { margin: 2px 0 0; color: var(--color-ink); font-size: 15px; line-height: 1.25; }
|
||||
.init-repository-icon {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
flex: 0 0 auto;
|
||||
border: 1px solid color-mix(in srgb, var(--color-accent) 34%, var(--color-border));
|
||||
border-radius: 9px;
|
||||
color: var(--color-accent);
|
||||
background: color-mix(in srgb, var(--color-accent) 10%, var(--color-surface-raised));
|
||||
}
|
||||
.init-repository-form { display: flex; flex-direction: column; gap: 16px; padding: 18px; }
|
||||
.init-repository-description { margin: 0; color: var(--color-ink-dim); font-size: 11.5px; line-height: 1.5; }
|
||||
.init-repository-field > span { font-size: 9.5px; }
|
||||
.init-repository-field > div { position: relative; align-items: center; }
|
||||
.init-repository-field > div > svg { position: absolute; left: 11px; z-index: 1; color: var(--color-ink-faint); pointer-events: none; }
|
||||
.init-repository-field > div > input { height: 36px; padding-left: 36px; font-family: var(--font-mono); font-size: 12px; }
|
||||
.init-repository-field small { color: var(--color-ink-faint); font-size: 9.5px; line-height: 1.4; }
|
||||
.init-repository-path-field { padding: 12px; border: 1px solid var(--color-border-subtle); border-radius: 9px; background: var(--color-surface-raised); }
|
||||
.init-repository-path-control { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
|
||||
.init-repository-path-control > input { grid-column: 1; }
|
||||
.init-repository-browse { grid-column: 2; display: inline-flex; align-items: center; gap: 6px; height: 36px; font-size: 11.5px; white-space: nowrap; }
|
||||
.init-repository-error { color: var(--color-danger, #ff6b78) !important; }
|
||||
.init-repository-actions { padding-top: 2px; }
|
||||
.init-repository-actions > button { font-size: 11.5px; }
|
||||
.rename-branch-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
Reference in New Issue
Block a user