Menu

A list of choices using the native <menu> element with @utility menu-* classes.

    • Usage

    menu.html
    <menu class="menu">
  <li>
    <button class="menu-item">
      <!-- Icon here -->
      Profile
      <span class="menu-shortcut">⇧⌘P</span>
    </button>
  </li>
  <li>
    <button class="menu-item">
      <!-- Icon here -->
      Settings
      <span class="menu-shortcut">⌘,</span>
    </button>
  </li>
  <li role="separator" class="menu-separator"></li>
  <li>
    <button class="menu-item menu-item-danger">
      <!-- Icon here -->
      Log out
      <span class="menu-shortcut">⌥⇧Q</span>
    </button>
  </li>
</menu>