.widget_product_categories,
.widget_layered_nav {
li {
position: relative;
margin-bottom: 10px;
a {
position: relative;
display: block;
font-size: 13px;
line-height: 1.6;
padding-left: 22px;
text-transform: capitalize;
&:before {
content: '';
position: absolute;
top: 50%;
left: 0;
margin-top: -7px;
width: 14px;
height: 14px;
border: 1px solid rgba(0,0,0,0.15);
}
}
a:hover ~ .count {
background-color: transparent;
color: $color-5;
border-color: $color-5;
}
}
.count {
background-color: rgba(84,84,84,0.05);
position: absolute;
top: 0;
right: 0;
font-size: 12px;
line-height: 18px;
padding: 0 10px;
text-align: center;
min-width: 10px;
border: 1px solid transparent;
border-radius: 10px;
@include transition( all 0.3s ease-in-out );
}
}
.woocommerce .widget_product_categories {
li {
a:before {
@include border-radius( 50% );
}
&.current-cat > {
a {
font-weight: bold;
&:before {
background-color: $color-5;
border-color: $color-5;
}
}
a ~ .count {
background-color: $color-5;
color: $color-1;
border-color: $color-5;
}
}
ul {
&.children {
margin: 8px 0 0 30px;
li {
font-size: 12px;
line-height: 1.3;
margin-bottom: 5px;
a {
padding-left: 0;
&:before {
display: none;
}
}
}
.count {
line-height: 18px;
}
}
a {
font-weight: 400;
text-transform: none;
border-bottom: 0;
}
}
}
}
.woocommerce .widget_layered_nav {
li {
a:before {
@include border-radius( 2px );
}
&.chosen {
a {
font-weight: bold;
&:before {
background-color: $color-5;
border-color: $color-5;
text-align: center;
content: '\f00c';
color: #fff;
font: normal normal 900 14px/1 'Font Awesome 5 free';
font-size: 10px;
line-height: 10px;
text-rendering: auto;
}
&:hover:before {
content: '\f00d';
}
}
a ~ .count {
background-color: $color-5;
color: $color-1;
border-color: $color-5;
}
}
}
}
/* Dropdown style */
.woo-dropdown-cat .widget_product_categories {
li {
position: relative;
a {
display: block;
font-size: 12px;
line-height: 1.6;
font-weight: 600;
text-transform: uppercase;
padding: 10px 22px 10px 0;
border-bottom: 1px solid #eaeaea;
&:before {
display: none;
}
}
.open-this {
position: absolute;
left: 0;
width: 40px;
height: 40px;
line-height: 40px;
font-size: 14px;
text-align: center;
cursor: pointer;
z-index: 10;
}
&.cat-parent .open-this {
left: auto;
right: 0;
}
ul.children {
display: none;
margin: 0 0 0 16px;
}
&.current-cat-parent > ul.children {
display: block;
}
ul a {
font-weight: 400;
text-transform: none;
border-bottom: 0;
}
}
.count {
position: absolute;
top: 0;
right: 40px;
border: 0;
padding: 10px 0 0;
z-index: 10;
}
.count,
li.current-cat > a ~ .count {
background-color: transparent !important;
color: #999;
}
} |