I understand. I set the color by yourself, but I want to use them in child themes. An example :
.xo10-product-categories-list-holder > ul > li {
background: #a52a2a;
}
but the child theme I’m working this code
in what shape it comes to child themes?
It might not be bad even add a choice between a flat white or gray variant;) in widget setting that people have a choice. Can I send my CSS code ideas as to look like a white version
Sure, I can take a look at your CSS ideas.
If you have a flat black version, it will be great also.
CSS code does not work in child themes. Please confirms a pattern of CSS code to childthemes take to change color send me exemple thx
/* -----------------------------------------------------------------------------
*
* How to override widget CSS styles in your theme or custom stylesheet
*
* 1. Add ".widget" class before the ".xo10-product-categories-list-holder" class.
* 2. Add "!important" rule if required.
*
* -------------------------------------------------------------------------- */
/*
* Example 1: change background colors.
*/
.widget .xo10-product-categories-list-holder > ul > li,
.widget .xo10-product-categories-list-holder > ul > li > a {
background: white; /* 1st level */
}
.widget .xo10-product-categories-list-holder > ul > li > ul > li {
background: white; /* 2nd-level */
}
.widget .xo10-product-categories-list-holder > ul > li > ul > li > ul > li {
background: white; /* 3rd-level */
}
/*
* Example 2: change 2nd-level hyperlink colors.
*/
.widget .xo10-product-categories-list-holder ul > li li a {
color: magenta !important;
}
Ok here it is the white version :
.widget .xo10-product-categories-list-holder > ul > li {
background: #FFFFFF;
}
.widget .xo10-product-categories-list-holder > ul > li > ul > li {
background: #FFFFFF;
}
.widget .xo10-product-categories-list-holder ul > li li a {
color: #4A4A4A !important;
}
.widget .xo10-product-categories-list-holder > ul > li > a {
font-size: 14px;
line-height: 20px;
padding: 14px 22px;
background: #FFFFFF;
color: #4A4A4A !important;
}
.widget .xo10-product-categories-list-holder > ul > li:not(:last-child) > a, .xo10-product-categories-list-holder > ul > li:not(:last-child) > .accordion-btn-wrap {
border-bottom: 1px solid #FFFFFF !important;
}
.widget .xo10-product-categories-list-holder > ul > li > ul > li > a, .xo10-product-categories-list-holder > ul > li > ul > li > .accordion-btn-wrap {
border-bottom: 1px solid #FFFFFF !important;
}
.widget .xo10-product-categories-list-holder > ul > li:not(:last-child) > .accordion-btn-wrap {
border-bottom: 0px solid #FFFFFF !important;
}
Can not add cell surface to click at the category which has subcategories? example here
http://screenshot.cz/HQ/HQUYC/cek.png
And one more thing. Can not do with that when you click on a category and subcategory that it does not close but will remain even after the redirect is still open?
I found myself one mistake, if the long name category, so that category name under the picture
Sorry for the long absence.
I’ve taken a look at your stylesheet and it works. However, it’s only for 2-levels instead of the 4-levels. It’s my fault for making things so complicated in order to support so many different scenarios.
I’ve taken some time to re-think and re-code the plugin to use a different approach which should mean less CSS customisation for you.
So re-download the plugin again.
This time choose “Plain – Accordion” from the “Look – Effects” field.
If you need to customise the accordion. The CSS class has been changed from “xo10-product-categories-list-holder” to “xo10-accordion-list-holder”.
I don’t quite understand what you mean by “cannot add cell surface to click”.
Maybe you can try adding headersOnly=true to the Effects options (optional) field. Save the widget. Refresh the widget and see if its what you want?
