scinote-web/app/assets/stylesheets/themes/menu_bar.scss
aignatov-bio 6d423ed986
Make Navbar icons bigger [SCI-3663] (#1900)
* Make Navbar icons bigger
2019-07-08 12:53:43 +02:00

85 lines
1.3 KiB
SCSS

@import "constants";
@import "mixins";
.menu-bar {
background-color: $color-white;
box-shadow: 1px 3px 6px 0 $color-alto;
height: 100%;
left: 0;
padding-bottom: 50px;
position: fixed;
width: 83px;
z-index: 1001;
.scroll-wrapper {
height: 100%;
padding-top: 16px;
width: 83px;
overflow-x: hidden;
}
ul.nav > li {
& > a,
& > span {
color: $color-silver-chalice;
display: grid;
font-size: $font-size-h6;
margin-left: auto;
margin-right: auto;
padding: 8px 0;
text-align: center;
word-break: normal;
.fas {
font-size: 18px;
}
}
&.active {
@include box-shadow(-4px 0 0 $brand-primary);
background-color: $color-gainsboro;
margin-left: 4px;
& > a {
color: $color-emperor;
}
}
&.disabled {
box-shadow: none;
cursor: not-allowed;
opacity: .65;
}
}
ul.nav-bottom {
bottom: 0;
padding-bottom: 16px;
position: fixed;
width: inherit;
}
.dropup {
.dropdown-menu {
bottom: 0;
left: 99%;
margin-bottom: 0;
}
&.open > a {
color: $color-emperor;
}
}
}
@media(max-height:510px) {
.menu-bar .nav-bottom {
position: relative;
width: auto;
}
}
.all-teams-navigation-link {
color: $color-white !important;
}