// nav-sidebar { // .white { // border: solid white; // border-width: 0 2px 2px 0; // display: inline-block; // padding: 3px; // } // .black { // border: solid $blue-grey; // border-width: 0 2px 2px 0; // display: inline-block; // padding: 3px; // } // .right { // transform: rotate(-45deg); // -webkit-transform: rotate(-45deg); // } // .left { // transform: rotate(135deg); // -webkit-transform: rotate(135deg); // } // .up { // transform: rotate(-135deg); // -webkit-transform: rotate(-135deg); // } // .down { // transform: rotate(45deg); // -webkit-transform: rotate(45deg); // } // a.bg-primary:focus, a.bg-primary:hover, button.bg-primary:focus, button.bg-primary:hover { // background-color: transparent !important; // } // .navchild-active { // @extend .bl-5; // font-weight: 700; // } // .category-active { // font-weight: 700; // font-size: 1.1rem; // } // .category-inactive { // font-weight: 500; // font-size: 1.1rem; // color: $blue-grey; // } // .collapse { // span { // color: $blue-grey; // } // } // } // Sidebar
.sidebar {
background-color: $white; box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15); margin-bottom: 1rem;
} // Main category
.main-category__item {
> a { font-size: 16px; font-weight: 600; letter-spacing: -0.2px; line-height: 1.75; padding: 20px; display: block; position: relative; text-transform: uppercase; &:after { content: "\e905"; font-size: 12px; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); font-family: 'icomoon' !important; } } & + .main-category__item { border-top: solid 1px #dee2e3; } > a.collapsed { position: relative; &:after { content: "\e904"; } } > a.directed { position: relative; &:after { content: "\e900"; } }
} // Secondary category
.secondary-category {
position: relative; .list-group-item { border: 0; } &:not(.active) { position: relative; margin-top: -1px; [data-toggle="collapse"] { &:after { color: theme-color("secondary"); } } &:before { border-top: solid 1px #dee2e3; content: ""; display: block; position: absolute; right: 0; left: 0; top: 0; z-index: 10; @include media-breakpoint-up(lg) { right: 20px; left: 20px; } } }
}
.secondary-category__item {
color: $blue-grey; display: block; font-size: 16px; font-weight: 600; letter-spacing: -0.2px; line-height: 1.75; padding: 20px 25px; text-transform: capitalize; @include media-breakpoint-up(lg) { font-size: 16px; padding: 28px 40px; } &[data-toggle="collapse"] { position: relative; &:after { content: "\e903"; font-size: 12px; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); font-family: 'icomoon' !important; } &.collapsed { position: relative; &:after { content: "\e902"; } } }
}
.secondary-category__item—active {
background-color: theme-color("primary"); color: $white;
} // Subcategory
.sub-category {
padding: 20px 0; .sub-category__item { border: none; border: 0; color: theme-color("secondary"); font-weight: 500; font-size: 14px; line-height: 1.5; padding: 11px 40px; text-transform: capitalize; display: block; @include media-breakpoint-up(lg) { color: $blue-grey; font-size: 16px; padding: 11px 60px; } &.sub-category__item-active { color: theme-color("secondary"); position: relative; &:before { background-color: theme-color("primary"); bottom: 5px; content: ""; display: block; left: 0; position: absolute; top: 5px; width: 5px; } } }
}