@dabapps/roe
Version:
A collection of React components, styles, mixins, and atomic CSS classes to aid with the development of web applications.
58 lines (46 loc) • 918 B
text/less
.nav {
.spaced-group();
list-style: none;
margin: 0;
padding: 0;
.nav-item {
display: inline-block;
padding: 0;
margin-top: 0;
margin-bottom: 0;
transition: ease-in-out 0.1s background-color;
&:hover:not(.disabled):not([disabled]):not(.active) a {
background-color: @nav-item-background-hover;
}
&.active a {
background-color: @nav-item-background-active;
}
a {
display: inline-block;
padding: @padding-base / 2 @padding-base;
}
}
}
.side-bar .nav {
margin: @margin-base auto;
.nav-item {
display: block;
margin: 0;
&.button,
& button {
margin: @margin-base 0;
}
&:not(.button):not(button) {
border-bottom: @border-base;
&:last-of-type {
border-bottom: @border-none;
}
a {
padding: @padding-base;
}
}
a {
display: block;
}
}
}