Simple navbar. Will need to fix colours later.
This commit is contained in:
parent
86a7280585
commit
c10d5f4e44
2 changed files with 36 additions and 1 deletions
|
|
@ -13,6 +13,21 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<header class="navbar container grid-xl" id="main-navbar">
|
||||
<section class="navbar-section">
|
||||
<a href="#">
|
||||
<img src="http://via.placeholder.com/60x60"
|
||||
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>
|
||||
|
||||
</body>
|
||||
|
||||
|
|
|
|||
|
|
@ -5,4 +5,24 @@ $primary-color: #2e5bec;
|
|||
$dark-color: #3e396b;
|
||||
|
||||
// Import full Spectre source code
|
||||
@import "spectre/src/spectre";
|
||||
@import "spectre/src/spectre";
|
||||
|
||||
// Custom styles.
|
||||
// - Navigation bar.
|
||||
$navbar-height: 60px;
|
||||
$logo-height: $navbar-height - 20px;
|
||||
|
||||
#main-navbar {
|
||||
background-color: #17181f;
|
||||
height: $navbar-height;
|
||||
}
|
||||
|
||||
#img-logo {
|
||||
vertical-align: middle;
|
||||
height: $logo-height;
|
||||
}
|
||||
|
||||
.navbar-control {
|
||||
margin-left: $control-padding-x;
|
||||
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue