Feature: embedded layout mode and schedule improvements

- Add layout-embedded class for nested entity selectors
- Simplified styling for embedded widgets (less padding, borders)
- Schedule toggle row with summary badges
- Summary badges show datetime range, weekly schedule, holiday count
- Flag fallback styling for countries without valid ISO codes
- Section hint margin after embedded entity selector
- Holiday countries group without modifiers section

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-02-04 10:52:13 +01:00
parent 7d4d1ec618
commit 4eeb8d85ae
12 changed files with 12458 additions and 49 deletions

View File

@@ -306,3 +306,64 @@
border-radius: $es-radius-lg;
}
}
// Schedule toggle row (form-content layout)
.schedule-toggle-row {
display: flex;
align-items: center;
background: $es-slate-100;
border: 1px solid $es-border-color;
border-radius: $es-radius-lg;
.schedule-toggle-switch {
padding: $es-spacing-sm $es-spacing-md;
}
.schedule-toggle-actions {
padding: $es-spacing-sm $es-spacing-md;
border-left: 1px solid $es-border-color;
cursor: pointer;
transition: background-color $es-transition-fast;
&:hover {
background: $es-slate-200;
}
.material-icons {
color: $es-slate-400;
font-size: 20px;
}
}
}
// Schedule summary badges (read-only indicators in header)
.schedule-summary-badges {
display: flex;
align-items: center;
gap: 0.5rem;
margin-left: auto;
padding: 0 $es-spacing-sm;
}
.schedule-badge {
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.25rem 0.5rem;
background: $es-slate-200;
color: $es-slate-600;
font-size: $es-font-size-xs;
font-weight: $es-font-weight-medium;
border-radius: $es-radius-full;
white-space: nowrap;
.material-icons {
font-size: 14px;
opacity: 0.7;
}
}
// Section hint after embedded entity selector - add margin
.schedule-holidays .section-hint {
margin-top: $es-spacing-md;
}