Dynamic payment buttons: Change more payment options link into a button

When using Dynamic payment buttons, the more payment options link can be styled to look more like a button with this style code modification. 

Example:

Before:

Here's how to add that button style to the More payment options link:

Code to use:

/* -- Additional payment methods styles -- */
.shopify-payment-button__more-options {
  border:1px solid $colorSplash !important; 
  padding: 10px;
  border-radius:2px;
  font-family:  $accentFontStack;
  text-transform: uppercase;
  background-color: $colorSplash;
  font-size: 14px;
  font-weight: normal;
  letter-spacing: 1px;
  @include prefix('user-select', 'none');
  -webkit-appearance: none;
  -moz-appearance: none;
  &:hover:not([disabled]){
    background-color: darken($colorSplash, 12%);
  }
  &:hover,
  &:active,
  &:focus {
    background-color: darken($colorSplash, 10%);
    outline: none;
    text-decoration:none !important;
  }  
}
/* - end - */

Where do I add the code?

Use this link to learn where exactly to add this code snippet:

Where to add your CSS style code

Still need help? Contact Us Contact Us