qdouze2-wordpress-theme/scss/components/_menus.scss

101 lines
1.6 KiB
SCSS

/* 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);
display: flex;
line-height: $lineheight;
padding: $lineheight_quarter;
margin: 0;
justify-content: space-between;
align-items: center;
word-wrap: none;
text-overflow: ellipsis;
overflow: hidden;
@include shape-style($lineheight_half);
//@include button-hover();
@include prefer-no-borders();
.badge {
margin: 0;
}
}
&.fg-light,
.fg-light & {
a {
color: $color-font-light;
&:hover,
&:active {
background-color: transparentize($color-font-light, 0.7);
}
}
}
&.fg-dark,
.fg-dark & {
a {
color: $color-font;
&:hover,
&:active {
background-color: transparentize($color-font, 0.85);
}
}
}
}
.toolbar {
flex-direction: row;
ul {
display: flex;
flex-direction: row;
flex-grow: 1;
}
li {
text-align: center;
a,
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;
}