tab/app/assets/stylesheets/menu.scss
2017-01-16 22:20:21 +01:00

72 lines
1.3 KiB
SCSS

$background-color: #f3f3f3;
$border-color: #cfcfcf;
$color: #777;
.menu {
width: 100%;
height: 70px;
background: $background-color;
border-bottom: 1px solid $border-color;
.menu-item {
display: inline-block;
vertical-align: middle;
height: 100%;
padding: 20px;
color: $color;
font-size: 1.875rem;
line-height: 1.4;
font-weight: 300;
&:hover {
text-decoration: none;
}
}
.menu-heading {
font-weight: bold;
font-size: 20px;
}
.menu-list {
display: inline-block;
border-left: 1px solid $border-color;
height: 100%;
margin: 0;
padding: 0;
&.menu-right {
float: right;
.menu-item {
&.menu-item-signout:hover {
background-color: red;
color: white;
}
&:last-child {
border-right: 0;
}
}
}
.menu-item {
border-right: 1px dotted $border-color;
.badge {
display: inline-block;
min-width: 10px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
color: white;
line-height: 1;
vertical-align: baseline;
white-space: nowrap;
text-align: center;
background-color: $color;
border-radius: 10px;
}
}
}
}