PhiaUi.Components.Layout.Section (phia_ui v0.1.17)

Semantic <section> wrapper with size-based vertical padding.

Encodes the design-system vertical rhythm so page sections stay consistent across the app without hand-picking py-N values on each template.

Size	Padding
`:sm`	`py-6`
`:md`	`py-12`
`:lg`	`py-16`
`:xl`	`py-24`

Examples

<.section size={:lg}>
  <.container>
    <h2 class="text-3xl font-bold">Features</h2>
  </.container>
</.section>

<.section size={:sm} class="bg-muted">
  <p>Compact announcement bar</p>
</.section>

Summary

Functions

section(assigns)

Renders a semantic <section> with size-based vertical padding.

Functions

section(assigns)

Renders a semantic <section> with size-based vertical padding.

Attributes

size (:atom) - Vertical padding preset. Defaults to :md. Must be one of :sm, :md, :lg, or :xl.
class (:string) - Additional CSS classes merged via cn/1. Defaults to nil.
Global attributes are accepted. HTML attributes forwarded to the <section> element.

Slots

inner_block (required) - Section content.