/* Menu handling */
.menu {
display: flex;
flex-direction: column;
padding: $lineheight/4;
ul,
li {
list-style: none;
padding: 0;
margin: 0;
}
a,
a:visited {
@include shape-style($lineheight_half);
line-height: $lineheight;
padding: $lineheight_quarter;
justify-content: space-between;
align-items: center;
text-decoration: none;
word-wrap: none;
text-overflow: ellipsis;
overflow: hidden;
//@include button-hover();
@include prefer-no-borders();
.badge {
&.fg-light,
.fg-light & {
a {
color: $color-font-light;
outline-color: $color-font-light;
&:hover,
&:active {
background-color: transparentize($color-font-light, 0.7);
input {
&.fg-dark,
.fg-dark & {
color: $color-font;
outline-color: $color-font;
background-color: transparentize($color-font, 0.85);
.toolbar {
flex-direction: row;
ul {
flex-grow: 1;
text-align: center;
span,
em,
strong,
&.toolbar-element {
display: block;
padding: $lineheight/3;
padding-left: $lineheight/2;
padding-right: $lineheight/2;
.menu-divider {
position: relative;
left: -$lineheight_quarter;
font-weight: $fontweight_hyper;
padding-top: $lineheight_quarter;
padding-bottom: $lineheight_quarter;
.menu-label {
@include shape-style($button_small);
@include button-hover();
padding-left: $button_small;
padding-right: $button_small;