ListDetail

Scrollable list beside a routed detail slot; stacked on phones.

framework/ui ↗

Live

Layout layers

Place the list in a kept layout layer. Render the selected page in its primary slot.

Example

ui.ListDetail(ui.ListDetailConfig{
    ListLabel: "Layout guides",
    List: ui.Stack(ui.StackConfig{Gap: ui.GapSM},
        ui.Card(ui.CardConfig{Heading: "Layouts", Href: "/docs/layouts"}),
        ui.Card(ui.CardConfig{Heading: "Reactivity", Href: "/docs/reactivity"}),
    ),
    Detail: ui.Card(ui.CardConfig{Heading: "Layout layers"},
        render.Text("Place the list in a kept layout layer. Render the selected page in its primary slot.")),
})