WooCommerce Basket page – increase min-width on .col-lg-5

Home Forums Gwangi – PRO Multi-Purpose Membership, Social Network & BuddyPress Community Theme Supported Plugins WooCommerce WooCommerce Basket page – increase min-width on .col-lg-5

This topic contains 4 replies, has 3 voices, and was last updated by  Manathan 1 month ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #10959

    Matt
    Participant
    • 2 Posts
    @matt

    Hi all,

    I need to amend the min-width on the .col-lg-5 column on the WooCommerce basket page so it drops below the .col-lg-7 div. See the problem in the attached image!

    In the dev tools, if I change the size of the media:
    @media (min-width: 992px) {
    .col-lg-5

    to

    @media (min-width: 1640px) {
    .col-lg-5

    this works for us. I can change this in the css file but obviously if there is an update this change will be lost. If I add it to the customiser CSS it seems to ignore it and just use the 992px one!

    Just wondering what the best way would be to make this change.

    Thanks,
    Matt

    #10961

    Jean-Pascal
    Moderator
    • 614 Posts
    @themopteryx
    Themosaurus Support

    Hi @matt,

    We are working on a big refactoring with the WooCommerce compatibility. We will take your feedback into account and will fix this issue.
    An update is expected in the coming weeks.

    So you can keep your CSS patch until the next update :).

    Thanks again for your great feedback!

    regards,

    #10962

    Matt
    Participant
    • 2 Posts
    @matt

    Ok, thank you. I’ve managed to fix it for now then. For my reference, and in case anyone else has the same issue, this is what I’ve done!

    1) Removed references to .col-lg-5 & .col-lg-7 in the main theme style.css

    2) Added this CSS within the customiser:

    /* Basket page was screwed at certain tablet sized resolutions */
    @media (min-width: 1640px) {
    .col-lg-5 {
        flex: 0 0 41.6666666667%;
        /* max-width: 41.6666666667%; */
    	  max-width: 100%;
    	}
    }
    .col-lg-5 {
    	width:100%;
    }
    @media (min-width: 1640px) {
    .col-lg-7 {
        flex: 0 0 58.3333333333%;
        /* max-width: 58.3333333333%; */
    	  max-width: 100%;
    } 
    }
    .col-lg-7 {
    	width:100%;
    }

    Thanks

    #10963

    Jean-Pascal
    Moderator
    • 614 Posts
    @themopteryx
    Themosaurus Support

    Hi @matt,

    Great! And thank you so much for sharing this with our community 🙏.

    We’ll keep you informed as soon as the update is released.

    Regards,

    #13646

    Manathan
    Keymaster
    • 399 Posts
    @themodactyl
    Themosaurus Support

    Hi @matt,

    We recently release a new version of your theme. Updating your theme, Grimlock plugins and all the other recommended plugins to the latest version should fix this issue.

    If you have correctly updated the theme and Grimlock, the problem should now be fixed. You might still be seeing the issue because your browser cache is showing you an older version of the page (browsers do that to load pages faster). So to see that the issue is resolved you will need to empty your browser cache and reload the page. If you want to read more on what browser cache is and how to clear it, here is an article that might help you:
    https://www.lifewire.com/how-to-clear-cache-2617980

    Cheers,

Hi there,

This topic has been inactive for a while now so we will be closing it to keep the forum tidy. Don't hesitate to create a new topic if you still need help and we'll be glad to help you!

Best regards,
The Themosaurus team.

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘WooCommerce Basket page – increase min-width on .col-lg-5’ is closed to new replies.