// // Primary navigation sidebar //
.wc-sidebar {
@include media-breakpoint-up(md) { @supports (position: sticky) { position: sticky; top: 0; z-index: 1000; height: 100vh; } } border-right: 1px solid rgba(0, 0, 0, .1); border-bottom: 1px solid rgba(0, 0, 0, .1); order: 0; @include media-breakpoint-up(xl) { flex: 0 1 320px; }
}
.wc-docsearch {
padding: 1rem 1rem; margin-right: -15px; margin-left: -15px; border-bottom: 1px solid rgba(0, 0, 0, .05);
}
.wc-sidebar-block {
padding: 1rem 1.5rem; margin-right: -15px; margin-left: -15px; border-bottom: 1px solid rgba(0, 0, 0, .05);
}
.wc-brand {
color: rgba(0, 0, 0, 0.65); font-weight: 700; font-size: 1.25rem; &:hover { color: rgba(0, 0, 0, 0.65); text-decoration: none; }
}
.wc-links {
padding-top: 1rem; padding-bottom: 1rem; margin-right: -15px; margin-left: -15px; @include media-breakpoint-up(md) { @supports (position: sticky) { max-height: subtract(100vh, 9rem); overflow-y: auto; } } // Override collapse behaviors @include media-breakpoint-up(md) { display: block !important; }
}
.wc-sidenav {
display: none;
}
.wc-sidebar-link {
display: block; padding: .25rem 1.5rem; font-weight: 600; color: rgba(0, 0, 0, .65); &:hover { color: rgba(0, 0, 0, .85); text-decoration: none; }
}
.wc-sidebar-item {
&.active { border-left: solid 4px $primary; // margin-bottom: 0.5rem; background-color: rgba(0, 0, 0, .025); &:not(:first-child) { // margin-top: 0.5rem; } > .wc-sidebar-link { color: rgba(0, 0, 0, .85); &:hover { background-color: transparent; } } > .wc-sidenav { display: block; } }
}
// All levels of nav .wc-sidebar .nav > li > a {
display: block; padding: .25rem 1.5rem; @include font-size(90%); color: rgba(0, 0, 0, .65);
}
.wc-sidebar .nav > li > a:hover {
color: rgba(0, 0, 0, .85); text-decoration: none; background-color: transparent;
}
.wc-sidebar .nav > .active > a, .wc-sidebar .nav > .active:hover > a {
font-weight: 600; //color: rgba(0, 0, 0, .85); color: $primary; background-color: transparent;
}