Dynamic Checout Buttons in Cart drawer

[JesusGomicare]

Hi guys,

I've added the dynamic buttons to my cart drawer.

The original display is like this 

I want them to look like this (note this image is photoshop)

Been trying with CSS and JS but cant seem to get it working. 

Can anyone help please?

Here's the link to my website https://gomicare.es/pages/tienda 

Thanks a lot!

[websensepro]

Hi @JesusGomicare 
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.css / based.css file and paste the code in the bottom of the file.

@media screen and (max-width: 767px) {
    .wallet-cart-grid {
        display: flex
        flex-direction: row !important;

  }
     .wallet-cart-button-container, .wallet-cart-button {
     flex-shrink: 1 !important;
   
  }

     .wallet-cart-wrapper{
     --wallet-button-width-vertical: 99% !important;
  }
        
}
@media screen and (min-width: 750px) {
    .cart__ctas {
        display: flex;
        flex-direction: column !important;
        gap: 1rem;
    }
 .wallet-cart-wrapper{
   --wallet-grid-margin-horizontal: 0 24px -2px -5px !important;

}
 .dynamic-checkout__content {
        display: block !important;
  
    }
  #CartDrawer-Checkout {
         max-width: 100% !important;
    }
   
}

Result:

If my reply is helpful, kindly click like and mark it as an accepted solution.

If you are happy with my help, you can help me buy a COFFEE

Thanks!

[websensepro]

@JesusGomicare 

I have updated the code; please try it and your problem should be solved.

[JesusGomicare]

Hi @websensepro it does work for Desktop version, but not for Mobile version (where it is more priority)

I even tried setting it up for Mobile same as you did for Desktop, but it doesnt work.

Any ideas why?

Looking forward to your reply,