Fix header to show background across whole page.

This commit is contained in:
Dominik Picheta 2018-05-08 13:19:56 +01:00
commit a26964b158
2 changed files with 20 additions and 15 deletions

View file

@ -14,20 +14,22 @@
</head>
<body>
<header class="navbar container grid-xl" id="main-navbar">
<section class="navbar-section">
<a href="#">
<img src="images/crown.png"
id="img-logo"/>
</a>
</section>
<section class="navbar-section">
<div class="input-group input-inline">
<input class="form-input input-sm navbar-control" type="text" placeholder="search">
</div>
<button class="btn btn-primary btn-sm navbar-control">Sign up</button>
<button class="btn btn-primary btn-sm navbar-control">Log in</button>
</section>
<header id="main-navbar">
<div class="navbar container grid-xl">
<section class="navbar-section">
<a href="#">
<img src="images/crown.png"
id="img-logo"/>
</a>
</section>
<section class="navbar-section">
<div class="input-group input-inline">
<input class="form-input input-sm navbar-control" type="text" placeholder="search">
</div>
<button class="btn btn-primary btn-sm navbar-control">Sign up</button>
<button class="btn btn-primary btn-sm navbar-control">Log in</button>
</section>
</div>
</header>
<section class="navbar container grid-xl" id="main-buttons">

View file

@ -36,7 +36,10 @@ $logo-height: $navbar-height - 20px;
#main-navbar {
background-color: $navbar-color;
height: $navbar-height;
.navbar {
height: $navbar-height;
}
// Unfortunately we must colour the controls in the navbar manually.
.form-input, .btn {