Cleanup nav-stacked .active state styles, remove unnecessary nesting

This commit is contained in:
minusfive 2017-08-30 11:01:01 -04:00 committed by Robin Ward
parent 8781c6bfcb
commit 5fd4970602
4 changed files with 32 additions and 36 deletions

View File

@ -375,11 +375,6 @@ td.flaggers td {
width: 18.018%;
position: relative;
li a.active {
color: $secondary;
background-color: $quaternary;
}
// The admin-nav becomes a slide-out menu at the mobile-nav breakpoint
@media (max-width: $mobile-breakpoint) {
position: absolute;

View File

@ -7,7 +7,7 @@
right: 0 !important;
}
// This is used to flip the .d-icon-caret-right
// This is used to flip the .d-icon-caret-right
@mixin rotate( $degrees ) {
-webkit-transform: rotate(#{$degrees}deg);
-moz-transform: rotate(#{$degrees}deg);
@ -27,7 +27,7 @@
// Changes the triangle arrow direction in .nav-stacked .active
// The 'left' and 'right' in these selectors is not being flipped by r2.
.rtl .nav-stacked .active > a::after {
.rtl .nav-stacked a.active::after {
border-left-color: transparent !important;
border-right-color: $secondary !important;
}
@ -38,8 +38,8 @@
.rtl .pull-left {
float: right !important;
}
.rtl .autocomplete {
left: 27px;
.rtl .autocomplete {
left: 27px;
}
.rtl .customize .current-style .toggle-mobile {

View File

@ -76,29 +76,28 @@
&.indent {
padding-left: 15px;
}
a {
margin: 0;
padding: 13px;
font-size: 1.143em;
line-height: 20px;
cursor: pointer;
color: $primary;
}
}
.active > a,
li > a.active {
color: $secondary;
background-color: $quaternary;
a {
margin: 0;
padding: 13px;
font-size: 1.143em;
line-height: 20px;
cursor: pointer;
color: $primary;
&:after {
left: 90%;
top: 33%;
content: " ";
position: absolute;
border: 8px solid transparent;
border-left-color: $secondary;
&.active {
color: $secondary;
background-color: $quaternary;
&::after {
left: 90%;
top: 33%;
content: " ";
position: absolute;
border: 8px solid transparent;
border-left-color: $secondary;
}
}
}

View File

@ -113,25 +113,27 @@
.nav-stacked {
background-color: transparent;
li {
border-bottom: none;
a {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%));
&.archive {
padding-left: 15px;
}
}
a.active {
a {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%));
&.active {
color: $primary;
font-weight: bold;
background-color: transparent;
&:after {
display: none;
display: none;
}
}
&.archive {
padding-left: 15px;
}
}
}
}