This topic has 8 replies, 3 voices, and was last updated 9 years, 4 months ago ago by Eva Kemp
Hi
I was wondering how to change the number of columns on a row in the responsive view
I want it to only show 1 column pr. row when the screen goes below 980px (where there is a breakpoint today)
How is that possible?
Hello,
Do you mean columns on Shop page?
Please show a screenshot what you want to achieve.
Thank you.
Best regards,
Jack Richardson.
I figured it out with css and media quiry
Another thing. How to make the animated shopping icon stay white when you scroll.
It goes black when you scroll on the site?
Hello,
Please use this code in 8Theme Options > Typography > Custom CSS > Global Custom CSS:
.fixNav-enabled .fixed-active .cart-design-2.design-white .cart-bag:before, .fixNav-enabled .fixed-active .cart-design-2.design-white .cart-bag .badge-number {
border-color: white;
}
.fixNav-enabled .fixed-active .cart-design-2.design-white .cart-bag .badge-number:before {
box-shadow: 0px 0px 0px 35px #FFF inset !important;
}
.fixNav-enabled .fixed-active .cart-design-2.design-white .cart-bag .badge-number {
color: #3D3D3D !important;
}
Regards,
Eva Kemp.
Thx Eva
But the icon is still dark in the mobile version (when the burger menu appears) – how to also make that white?
Hello,
Use this code in Custom CSS:
@media (max-width: 992px) {.cart-design-2 .shopping-cart-widget .cart-bag::before {
border: 2px solid white;
}
.cart-design-2 .shopping-cart-widget .cart-bag .badge-number::before {
box-shadow: 0px 0px 0px 35px white inset;}
.cart-design-2 .shopping-cart-widget .cart-bag .badge-number {
background-color: #FFF;
color: #3D3D3D;
}}
Regards,
Eva Kemp.
Great – thx
BTW on chrome the mobile menu works fine, but in firefox it looks like there is a layer on top so you cant click the logo/menu/cart
Can you check for me please?
Jan
Hello,
As I see you’ve added this code in child style.css:
.content.main-products-loop.col-md-12 {
margin-top: -120px !important;
}
Remove it or edit it to
@media (max-width: 1200px) {.content.main-products-loop.col-md-12 {
margin-top: -120px !important;
}}
and check the site then.
Regards,
Eva Kemp.
Tagged: columns, layout, number, responsive, themes, woocommerce, wordpress
You must be logged in to reply to this topic.Log in/Sign up