# `PhiaUi.Components.Layout.FixedBar`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/layout/fixed_bar.ex#L1)

Fixed-positioned bar anchored to the top or bottom of the viewport.

Spans the full width of the viewport (`inset-x-0`) and sits above page
content via a configurable z-index. Useful for mobile CTA bars, persistent
navigation, or cookie-consent banners.

## Examples

    <%!-- Fixed top navigation --%>
    <.fixed_bar position={:top} z={50}>
      <div class="max-w-screen-xl mx-auto px-4 flex items-center justify-between h-16">
        <span class="font-bold">Logo</span>
        <nav>...</nav>
      </div>
    </.fixed_bar>

    <%!-- Mobile bottom CTA --%>
    <.fixed_bar position={:bottom} class="p-4">
      <.button class="w-full">Buy now</.button>
    </.fixed_bar>

# `fixed_bar`

Renders a fixed-positioned full-width bar.
## Attributes

* `position` (`:atom`) - Viewport edge to anchor to. Defaults to `:bottom`. Must be one of `:top`, or `:bottom`.
* `z` (`:integer`) - z-index level. Defaults to `40`. Must be one of `0`, `10`, `20`, `30`, `40`, or `50`.
* `class` (`:string`) - Additional CSS classes merged via cn/1. Defaults to `nil`.
* Global attributes are accepted. HTML attributes forwarded to the root element.
## Slots

* `inner_block` (required) - Bar content.

---

*Consult [api-reference.md](api-reference.md) for complete listing*