Add chapter and speaker preparation templates for audiobook conversion workflow

- Created `prepare_chapters.html` to allow users to select and configure chapters for conversion, including options for voice profiles and chunk granularity.
- Developed `prepare_speakers.html` for assigning voices to detected speakers, auditioning samples, and applying saved speaker configurations.
- Implemented step indicators and navigation between chapters and speakers in the UI.
- Added error and notice handling for user feedback during the preparation process.
- Included scripts for voice catalog and language mapping to enhance user experience.
This commit is contained in:
JB
2025-10-11 09:31:49 -07:00
parent 4b0aa50da6
commit 8ed5202ab8
6 changed files with 732 additions and 729 deletions
+94
View File
@@ -515,6 +515,89 @@ body {
}
}
.wizard-page {
display: flex;
justify-content: center;
padding: 3rem 0 5rem;
}
.wizard-card {
width: min(1100px, calc(100% - 2.5rem));
margin: 0 auto;
}
.wizard-card__header {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 2rem;
}
.wizard-card__aside {
display: flex;
flex-direction: column;
gap: 1rem;
align-items: flex-end;
text-align: right;
max-width: 320px;
}
.wizard-card__links {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
justify-content: flex-end;
}
.wizard-card__filename {
font-size: 0.85rem;
color: var(--muted);
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.wizard-card__body {
display: flex;
flex-direction: column;
gap: 2rem;
}
.wizard-card__footer {
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
flex-wrap: wrap;
}
.wizard-card__footer-actions {
display: flex;
gap: 0.75rem;
align-items: center;
}
.wizard-hidden-inputs {
display: none;
}
@media (max-width: 900px) {
.wizard-card__header {
flex-direction: column;
align-items: stretch;
}
.wizard-card__aside {
align-items: flex-start;
text-align: left;
}
.wizard-card__links {
justify-content: flex-start;
}
}
.step-indicator {
display: flex;
flex-wrap: wrap;
@@ -1310,6 +1393,17 @@ body {
margin-bottom: 2rem;
align-items: start;
}
.form-section__title-row {
display: flex;
justify-content: space-between;
align-items: flex-end;
gap: 1rem;
flex-wrap: wrap;
margin-bottom: 1rem;
}
.form-section__title-row .form-section__title {
margin-bottom: 0;
}
.prepare-summary__stats dl {
margin: 0;