Windy CSS styleguide

3.11 #components.menuitems .menu-items

Simple menu with icons that works well in dark-content also

<nav class="menu-items {{modifier_class}}">
    <a data-icon=",">Vzdálenost a plánování</a>
    <a data-icon="U">Widget na stránku</a>
    <a data-icon="">Sledování hurikánů</a>
</nav>

Examples

Default styling

.size-s

12px

.size-m

14px

.size-l

16px

.size-xl

18px

.size-xxl

20px

Markup

    <section class="mt-10 mb-10 bg-white rounded-box">
        <nav class="menu-items [modifier class]">
            <a data-icon=",">Vzdálenost a plánování</a>
            <a data-icon="U">Widget na stránku</a>
            <a data-icon="">Sledování hurikánů</a>
        </nav>
    </section>
    <section class="mt-10 mb-10 fg-gray-light bg-gray-dark rounded-box dark-content">
        <nav class="menu-items [modifier class]">
            <a data-icon=",">Vzdálenost a plánování</a>
            <a data-icon="U">Widget na stránku</a>
            <a data-icon="">Sledování hurikánů</a>
        </nav>
    </section>

Source: src/css/components/menu.less, line 1