improve toggle button alignment and prayer verse spacing
All checks were successful
CI / update (push) Successful in 24s
All checks were successful
CI / update (push) Successful in 24s
- Wrap rosary page toggles in centered container with left-aligned items - Reduce spacing between toggles from 2rem to 0.5rem - Simplify Toggle component styling (remove centering/margins) - Add centered wrapper for gebete page toggle - Add spacing between German verses in monolingual mode for readability
This commit is contained in:
@@ -901,6 +901,16 @@ h1 {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
/* Toggle controls container */
|
||||
.toggle-controls {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 0.5rem;
|
||||
max-width: fit-content;
|
||||
margin: 0 auto 2rem auto;
|
||||
}
|
||||
|
||||
/* Mystery selector grid */
|
||||
.mystery-selector {
|
||||
display: grid;
|
||||
@@ -1226,15 +1236,18 @@ l536 389l-209 -629zM1671 934l-370 267l150 436l-378 -271l-371 271q8 -34 15 -68q10
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<!-- Luminous Mysteries Toggle -->
|
||||
<Toggle
|
||||
bind:checked={includeLuminous}
|
||||
label="Lichtreiche Geheimnisse einbeziehen"
|
||||
on:change={handleToggleChange}
|
||||
/>
|
||||
<!-- Toggle Controls -->
|
||||
<div class="toggle-controls">
|
||||
<!-- Luminous Mysteries Toggle -->
|
||||
<Toggle
|
||||
bind:checked={includeLuminous}
|
||||
label="Lichtreiche Geheimnisse einbeziehen"
|
||||
on:change={handleToggleChange}
|
||||
/>
|
||||
|
||||
<!-- Language Toggle -->
|
||||
<LanguageToggle />
|
||||
<!-- Language Toggle -->
|
||||
<LanguageToggle />
|
||||
</div>
|
||||
|
||||
<div class="rosary-layout">
|
||||
<!-- Sidebar: Rosary Visualization -->
|
||||
|
||||
Reference in New Issue
Block a user