Okay
  Public Ticket #1993043
View Cart button
Closed

Comments

  •  5
    JeffGreene started the conversation
    April 29, 2019 at 10:23pm

    Hi there! I'm hoping you can help me out with an aesthetic fix- when I add an item to the cart on our site, at the top of the page the 'X ITEM has been added to your cart / VIEW CART' message appears. Our product names are long, so on mobile the text comes really close to the 'VIEW CART' button , is it possible to give it a bit more space or put them in two different columns so they don't touch? On desktop it is OK because there is enough space. Please see screenshots. 

    Thanks so much for your help!

    Best,


    Jeff

    {"wp":{"use":false,"adminUrl":"nomadcph.com/wp-admin","username":"","password":""},"ftp":{"use":false,"url":"","port":"","user":"","password":"","path":""}}
  •  1,559
    Laborator replied
    April 30, 2019 at 7:33am

    Hi Jeff,

    Add this CSS to Custom CSS > Responsive > Extra Small (XS) field:

    .woocommerce-Message .button:only-child, .woocommerce-error .button:only-child, .woocommerce-info .button:only-child, .woocommerce-message .button:only-child, .woocommerce-notice .button:only-child{
    margin-top: 0;
    margin-bottom: 10px;
    top: 0;
    float: none;
}

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  •  5
    JeffGreene replied
    April 30, 2019 at 10:46pm

    Thanks Art! That looks better- is it possible though to switch the text to the top and the button to the bottom of the box?


    Thanks for you help, best,


    Jeff

  •  1,559
    Laborator replied
    May 2, 2019 at 7:07am

    Hi Jeff,

    That's not possible through Custom CSS as the button is placed before the text and it cannot be moved down using CSS.

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  •  5
    JeffGreene replied
    May 8, 2019 at 8:32am

    Thanks Art, one more thing, on desktop now the button is very long, spanning the width of the page- on mobile it looks alright but on desktop it looks odd- is there a CSS workaround for that? 


    Thanks for your help

  •  1,559
    Laborator replied
    May 9, 2019 at 8:34am

    Hi Jeff,

    That's because you have not correctly followed my instructions:

    medium
    (view large version)

    Anyway I have made the changes, here you can see the video I recorded:

    https://d.pr/v/gtiTsH

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  •  5
    JeffGreene replied
    May 10, 2019 at 10:49pm

    Thank you very much Art! You are correct, I missed that.


    Thanks,


    Jeff