sidebar button color

This commit is contained in:
Astralof 2018-09-17 15:22:11 +02:00
parent ab1ecd938a
commit defd493325
6 changed files with 23 additions and 8 deletions

View file

@ -1,11 +1,11 @@
<div id="floating-button"> <div id="floating-button">
<button class="circular ui icon button sidebar-toggle"> <button class="circular ui icon button sidebar-toggle safing-full">
<i class="sidebar icon"></i> <i class="sidebar icon"></i>
</button> </button>
{% if include.download %} {% if include.download %}
<div class="spacer"></div> <div class="spacer"></div>
<a href="{{ site.download_url }}"> <a href="{{ site.download_url }}">
<button class="circular ui icon button"> <button class="circular ui icon button safing-full">
<i class="download icon"></i> <i class="download icon"></i>
</button> </button>
</a> </a>

View file

@ -33,7 +33,7 @@
</div> </div>
<div class='right menu' id="menubar-mobile"> <div class='right menu' id="menubar-mobile">
<a class='item sidebar-toggle'> <a class='item sidebar-toggle sidebar-icon'>
<i class='sidebar icon'></i> <i class='sidebar icon'></i>
</a> </a>
</div> </div>

View file

@ -17,7 +17,17 @@
background-color: $fill_medium; background-color: $fill_medium;
color: $white; color: $white;
} }
.ui.button.safing-full {
color: $fill_lighter;
background-color: $white;
}
.ui.button.safing-full:hover {
background-color: $fill_lighter;
color: $white;
}

View file

@ -2,8 +2,8 @@
position: fixed; position: fixed;
right: 25px; right: 25px;
top: 25px; top: 25px;
box-shadow: 1px 2px 3px 1px #718399;
background-color: $white; background-color: $discreet;
// width: 64px; DEFINED BELOW! // width: 64px; DEFINED BELOW!
padding: 5px; padding: 5px;
border-radius: 32px; border-radius: 32px;

View file

@ -1,7 +1,11 @@
.sidebar-icon {
color: $white !important;
}
#menubar { #menubar {
width: 100%; width: 100%;
background-color: #38465c; background-color: $fill_medium;
margin: 0; margin: 0;
border-radius: 0; border-radius: 0;
z-index: 1; z-index: 1;
@ -21,7 +25,7 @@
// no js version // no js version
@media only screen and (max-width: 767px) { @media only screen and (max-width: 767px) {
#menubar.home { #menubar.home {
background-color: #38465c !important; background-color: $fill_medium !important;
position: relative; position: relative;
} }
#menubar .right.menu a.item { #menubar .right.menu a.item {

View file

@ -9,6 +9,7 @@ $fill_dark: #222a37 !default;
$background_main: #e0e1e2 !default; $background_main: #e0e1e2 !default;
$fill_lighter: #788294 !default; $fill_lighter: #788294 !default;
$secondary: $fill_medium; $secondary: $fill_medium;
$discreet: #F7F7F7;
// other colors // other colors
$color_mine_shaft_approx: #333 !default; $color_mine_shaft_approx: #333 !default;