Tutorial 07b · Components

Navbar — Mega & Search

Mega menu, search field and user dropdown — all wired by lucUI.js.

10 minIntermediatelucUI 2 · v2.1.3

Objectives

  • Build mega grid with .luc-navbar-mega.
  • Add search and avatar dropdown.

Steps

Mega

mega.html
<div class="luc-navbar-mega">
  <button class="luc-navbar-mega-trigger">Products</button>
  <div class="luc-navbar-mega-content">
    <div class="luc-navbar-mega-grid">…</div>
  </div>
</div>

Search

⌕
← Previous Next →