<div class="nav-container">
<nav class="navigation">
<a class="navigation__link" href="#">Hoofdcategorie</a>
<a class="navigation__link" href="#">Hoofdcategorie</a>
<a class="navigation__link" href="#">Hoofdcategorie</a>
<div class="navigation__search-container">
<form action="/action_page.php">
<input class="navigation__search-container--search-bar" type="text" placeholder="Search.." name="search" />
<button class="navigation__search-container--button" type="submit"><i class="fa fa-search"></i></button>
</form>
</div>
</nav>
</div>
<div class="nav-container">
<nav class="navigation">
<a class="navigation__link" href="#">Hoofdcategorie</a>
<a class="navigation__link" href="#">Hoofdcategorie</a>
<a class="navigation__link" href="#">Hoofdcategorie</a>
<div class="navigation__search-container">
<form action="/action_page.php">
<input class="navigation__search-container--search-bar" type="text" placeholder="Search.." name="search" />
<button class="navigation__search-container--button" type="submit"><i class="fa fa-search"></i></button>
</form>
</div>
</nav>
</div>
{
"class": "",
"ariaLabel": "Homepage",
"imageAlt": "Alpaca Logo",
"imageAttributes": "",
"imageClass": "",
"imageSrc": "/images/logo/logo.svg",
"href": "#"
}
// klopt niet
//.nav-container {
// width: 75%;
// margin-right: auto;
// margin-left: auto;
// background: linear-gradient(to right, $color-primary 65%, $color-tertiary 65% 100%);
// border-radius: 4px 4px 0 0;
//}
//
//.navigation {
// &__link {
// float: left;
// display: block;
// color: $color-tertiary;
// text-align: center;
// padding: 14px 16px;
// text-decoration: none;
// font-size: 17px;
//
// &:hover {
// font-weight: bold;
// color: $color-tertiary;
// }
// }
//
// &__search-container {
// float: right;
//
// &--search-bar {
// padding: 6px;
// width: 400px;
// margin-top: 8px;
// font-size: 17px;
// border: none;
// }
//
// &--button {
// float: right;
// padding: 6px 10px;
// margin-top: 8px;
// margin-right: 16px;
// background: #ddd;
// font-size: 17px;
// border: none;
// cursor: pointer;
// }
// }
//}
There are no notes for this item.