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

17
redesign/nimforum.scss
View file

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