<template>
<div>
    <u-navbar :class="$style.navbar" alignment="center" :router="false">
        <u-navbar-item>Home</u-navbar-item>
        <u-navbar-item>Guides</u-navbar-item>
        <u-navbar-item>Features</u-navbar-item>
        <u-navbar-item>Downloads</u-navbar-item>
        <u-navbar-item>About</u-navbar-item>
    </u-navbar>
    <u-navbar-1 :class="$style.navbar" alignment="center" :router="false" style="background: #eaeef5;">
        <u-navbar-1-item>Home</u-navbar-1-item>
        <u-navbar-1-item>Guides</u-navbar-1-item>
        <u-navbar-1-item>Features</u-navbar-1-item>
        <u-navbar-1-item>Downloads</u-navbar-1-item>
        <u-navbar-1-item>About</u-navbar-1-item>
    </u-navbar-1>
    <u-navbar-2 :class="$style.navbar" alignment="center" :router="false">
        <u-navbar-2-item>Home</u-navbar-2-item>
        <u-navbar-2-item>Guides</u-navbar-2-item>
        <u-navbar-2-item>Features</u-navbar-2-item>
        <u-navbar-2-item>Downloads</u-navbar-2-item>
        <u-navbar-2-item>About</u-navbar-2-item>
    </u-navbar-2>
    <u-navbar-3 :class="$style.navbar" alignment="center" :router="false" style="background: #eaeef5;">
        <u-navbar-3-item>Home</u-navbar-3-item>
        <u-navbar-3-item>Guides</u-navbar-3-item>
        <u-navbar-3-item>Features</u-navbar-3-item>
        <u-navbar-3-item>Downloads</u-navbar-3-item>
        <u-navbar-3-item>About</u-navbar-3-item>
    </u-navbar-3>
    <u-navbar-4 :class="$style.navbar" alignment="center" :router="false">
        <u-navbar-4-item>Home</u-navbar-4-item>
        <u-navbar-4-item>Guides</u-navbar-4-item>
        <u-navbar-4-item>Features</u-navbar-4-item>
        <u-navbar-4-item>Downloads</u-navbar-4-item>
        <u-navbar-4-item>About</u-navbar-4-item>
    </u-navbar-4>
    <u-navbar-6 :class="$style.navbar" alignment="center" :router="false" color="inverse" style="background: #f19f0f;">
        <u-navbar-6-item>Home</u-navbar-6-item>
        <u-navbar-6-item>Guides</u-navbar-6-item>
        <u-navbar-6-item>Features</u-navbar-6-item>
        <u-navbar-6-item>Downloads</u-navbar-6-item>
        <u-navbar-6-item>About</u-navbar-6-item>
    </u-navbar-6>
    <u-navbar-7 :class="$style.navbar" alignment="center" :router="false" color="inverse" style="background: #3fa46a;">
        <u-navbar-7-item>Home</u-navbar-7-item>
        <u-navbar-7-item>Guides</u-navbar-7-item>
        <u-navbar-7-item>Features</u-navbar-7-item>
        <u-navbar-7-item>Downloads</u-navbar-7-item>
        <u-navbar-7-item>About</u-navbar-7-item>
    </u-navbar-7>
    <u-navbar-8 :class="$style.navbar" alignment="center" :router="false" color="inverse" style="background: #3fa46a; font-weight: bold;">
        <u-navbar-8-item>Home</u-navbar-8-item>
        <u-navbar-8-item>Guides</u-navbar-8-item>
        <u-navbar-8-item>Features</u-navbar-8-item>
        <u-navbar-8-item>Downloads</u-navbar-8-item>
        <u-navbar-8-item>About</u-navbar-8-item>
    </u-navbar-8>
    <u-navbar-9 :class="$style.navbar" alignment="center" :router="false" style="background: #ecf0f1; font-weight: bold;">
        <u-navbar-9-item>Home</u-navbar-9-item>
        <u-navbar-9-item>Guides</u-navbar-9-item>
        <u-navbar-9-item>Features</u-navbar-9-item>
        <u-navbar-9-item>Downloads</u-navbar-9-item>
        <u-navbar-9-item>About</u-navbar-9-item>
    </u-navbar-9>
    <u-navbar-10 :class="$style.navbar" alignment="center" :router="false" color="inverse" style="background: #f19f0f;">
        <u-navbar-10-item>Home</u-navbar-10-item>
        <u-navbar-10-item>Guides</u-navbar-10-item>
        <u-navbar-10-item>Features</u-navbar-10-item>
        <u-navbar-10-item>Downloads</u-navbar-10-item>
        <u-navbar-10-item>About</u-navbar-10-item>
    </u-navbar-10>
    <u-navbar-11 :class="$style.navbar" alignment="center" :router="false" color="inverse" style="background: #435a6b;">
        <u-navbar-11-item>Home</u-navbar-11-item>
        <u-navbar-11-item>Guides</u-navbar-11-item>
        <u-navbar-11-item>Features</u-navbar-11-item>
        <u-navbar-11-item>Downloads</u-navbar-11-item>
        <u-navbar-11-item>About</u-navbar-11-item>
    </u-navbar-11>
</div>
</template>

<style module>
.navbar[class] {
    padding: 80px 0;
    height: auto;
}
</style>
