demo: restructure log header outside scrollable (always visible), remove sticky references, add Iced limitation note
This commit is contained in:
@@ -2,8 +2,10 @@
|
||||
// Glint — Full Feature Demonstration
|
||||
// ============================================================================
|
||||
// Showcases: @global, @singleton, !rhei:, @component, @if/@else, @each,
|
||||
// @on click, variable binding, positioning (fixed, absolute, sticky),
|
||||
// @on click, variable binding, positioning (fixed, absolute),
|
||||
// typography, box model, opacity, overflow, grid layout, style inheritance.
|
||||
// Note: true CSS position:sticky requires scroll-tracking not exposed by Iced.
|
||||
// "Always-visible header above scrollable content" pattern used instead.
|
||||
// ============================================================================
|
||||
|
||||
@version 1
|
||||
@@ -64,7 +66,7 @@
|
||||
// ── 3. Layout ────────────────────────────────────────────────────────────────
|
||||
Window(title=$title) {
|
||||
|
||||
// ── Header (stays at top, body scrolls beneath) ──────────────────────────
|
||||
// ── Header (always visible; body scrolls beneath — closest to sticky in Iced) ─
|
||||
Panel(class="header") {
|
||||
Panel(class="header-inner") {
|
||||
Icon "◇"
|
||||
@@ -197,13 +199,13 @@ Window(title=$title) {
|
||||
Text(class="gauge-label") "* Opacity depends on Iced widget support — works on containers, not on text"
|
||||
}
|
||||
|
||||
// Panel: Scroll + Sticky
|
||||
// Panel: Scrollable Log with always-visible header
|
||||
Panel(class="card") {
|
||||
Header "Scrollable Log"
|
||||
Panel(class="log-header") {
|
||||
Text "Event Log (always visible — above scrollable area)"
|
||||
}
|
||||
Panel(class="log") {
|
||||
Panel(class="log-header") {
|
||||
Text "Event Log (sticky header)"
|
||||
}
|
||||
Text "Init: system boot"
|
||||
Text "Info: all modules OK"
|
||||
Text "Warn: CPU at $cpu%"
|
||||
|
||||
@@ -379,6 +379,10 @@ Slider {
|
||||
width: fill
|
||||
}
|
||||
|
||||
// Note: position:sticky is not supported by Iced. "Always visible header above
|
||||
// scrollable content" is the working pattern.
|
||||
// ═══════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
// ── Style Inheritance ────────────────────────────────────────────────────────
|
||||
.inherit {
|
||||
background: #f0ece6
|
||||
|
||||
Reference in New Issue
Block a user