If i change the css in the grid view, but and the css will also apply to the list view, which is i don't want it.
How can i solve that?
Thank you.
Magento Stack Exchange is a question and answer site for users of the Magento e-Commerce platform. It only takes a minute to sign up.
Sign up to join this communityIf i change the css in the grid view, but and the css will also apply to the list view, which is i don't want it.
How can i solve that?
Thank you.
You can set the nesting selectors for each different class in the same view (like the @Haim said), or just divide into two LESS files imported into your _module.less for the Catalog module and set the parent nesting with each class so you have everything in a better order & modular.
There's a parent class name that differentiates between list and grid view. For list view use .products-list
and for grid view use .products-grid
.
If you just set:
.product-item-name > a, .product.name > a {
color: red;
text-decoration: none
}
Then the item name will be red whether in grid or list view.
if you add the product-list
selector then it will only affect the list view.
.products-list .product.name a {
color: red;
text-decoration: none
}
if you add the product-grid
selector then it will only affect the grid view
.products-grid .product.name a {
color: red;
text-decoration: none
}