jyapayne/nimforum
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve look of main buttons.

Browse source
This commit is contained in:
Dominik Picheta 2018-05-08 13:34:56 +01:00
commit d2b065de7e
2 changed files with 17 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

13
redesign/index.html
View file

@ -24,10 +24,10 @@
</section>
<section class="navbar-section">
<div class="input-group input-inline">
<input class="form-input input-sm navbar-control" type="text" placeholder="search">
<input class="form-input input-sm" 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>
<button class="btn btn-primary btn-sm">Sign up</button>
<button class="btn btn-primary btn-sm">Log in</button>
</section>
</div>
</header>
@ -35,7 +35,7 @@
<section class="navbar container grid-xl" id="main-buttons">
<section class="navbar-section">
<div class="dropdown">
<a href="#" class="btn btn-link dropdown-toggle" tabindex="0">
<a href="#" class="btn dropdown-toggle" tabindex="0">
Filter <i class="fas fa-caret-down"></i>
</a>
<ul class="menu">
@ -43,13 +43,12 @@
<li>dev</li>
</ul>
</div>
</section>
<section class="navbar-section">
<button class="btn btn-primary">Latest</button>
<button class="btn btn-link">Most Active</button>
<button class="btn btn-link">Categories</button>
</section>
<section class="navbar-section">
</section>
</section>
<section class="container grid-xl">

17
redesign/nimforum.scss
View file

@ -4,6 +4,7 @@
$primary-color: #f99c19;
// $dark-color: #3e396b;
$label-color: #7cd2ff;
$filter-color: #f1f1f1;
// Define nav bar colours.
$navbar-color: #17181f;
@ -15,8 +16,8 @@ $navbar-primary-color: #fee860;
// Global styles.
// - TODO: Make these non-global.
.btn {
margin-left: $control-padding-x;
.btn, .form-input {
margin-right: $control-padding-x;
}
table th {
@ -62,14 +63,18 @@ $logo-height: $navbar-height - 20px;
height: $logo-height;
}
.navbar-control {
margin-left: $control-padding-x;
}
// - Main buttons
#main-buttons {
margin-top: $control-padding-y;
margin-bottom: $control-padding-y;
.dropdown > .btn {
background: $filter-color;
border-color: darken($filter-color, 5%);
color: invert($filter-color);
margin-right: $control-padding-x*2;
}
}
// - Thread table