Navbar

Displays a sticky top navigation header with brand, links, and actions.

Installation

bun add elia

@import "tailwindcss";
@import "@aile.sh/elia/styles/elia.css";
@source "../node_modules/@aile.sh/elia";

Usage

import { Button, Navbar, NavLink } from "@aile.sh/elia";

export function Example() {
  return (
    <Navbar
      className="static!"
      brand={<span className="text-[14px] font-semibold text-ink">AILE.SH</span>}
      actions={
        <Button variant="secondary" size="sm">
          Sign in
        </Button>
      }
    >
      <NavLink href="#" active>
        Models
      </NavLink>
      <NavLink href="#">Keys</NavLink>
      <NavLink href="#">Usage</NavLink>
    </Navbar>
  );
}

— elia design system · MIT · base · https://github.com/aile-sh/elia