Bolt Design System

Theme compatibility

Menu can be used in various themes.

Demo

Twig

<div class="t-bolt-dark">
  // Put the component inside a themed container
  {% include '@bolt-components-menu/menu.twig' with {
    items: [
      {
        content: 'Menu item 1',
      },
      {
        content: 'Menu item 2',
      },
      {
        content: 'Menu item 3',
      },
    ]
  } only %}
</div>

HTML

<div class="t-bolt-dark">
  // Put the component inside a themed container
  <bolt-menu>
    <bolt-menu-item>
      Menu Item 1
    </bolt-menu-item>
    <bolt-menu-item>
      Menu Item 2
    </bolt-menu-item>
    <bolt-menu-item>
      Menu Item 3
    </bolt-menu-item>
  </bolt-menu>
</div>