Styling buttons

[sittingprettyclothing]

Hi there

I need some help with styling of a few buttons. (I’ll add some pictures to show what I mean)

Gift voucher: ( http://www.sittingpretty.co.za/shop/gift-voucher/ )
The buttons should be the same as the other product pages. Just simple with just a white background. example:
The text on the left “choose amount” should also be like the other product pages.

Waiting list:
I have a waiting list for when a product is out of stock. As soon as it comes up its a dark grey and the text is in bold.

So the styling should be the same here. Just like the “Add to shopping bag” button.

Could someone assist with this please? 🙂

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Try adding this to Theme Options => Custom CSS

select#gift_amounts {
    width: 100%!important;
    vertical-align: top;
    z-index: 2;
    outline: none;
    display: inline-block;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    appearance: none;
    cursor: pointer;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    padding: 14px 35px 12px 15px;
    line-height: 16px;
    height: 42px;
    background-image: url(images/[email protected]);
    background-repeat: no-repeat;
    background-position: 90% center;
    background-size: 9px 6px;
    margin-left: 13px !important;
    border-color: #e5e5e5 !important;
    border-top: 1px solid #e5e5e5 !important;
    border-bottom: 1px solid #e5e5e5 !important;
    border-left: 1px solid #e5e5e5 !important;
    border-right: 1px solid #e5e5e5 !important;
    color: #000 !important;
    background-color: #fff !important;
    text-align: centre !important;
    font-size: 10.5px !important;
    font-family: Helvetica !important;
    text-transform: uppercase !important;
}

.gift-cards-list label {
    background: none;
    line-height: 40px;
    padding-right: 10px;
    text-shadow: none;
    color: #222;
}

Can you link me to a waiting list product?

[sittingprettyclothing]

Hi David

Definitely looks better, but the ‘choose amount’ on the left is still grey and not in bold. And the button on the left has ‘choose amount’ written in it and not like how it was before with just an amount. You’ll see in the picture I added it had an amount in. Button looks good, thanks so much 🙂
Here is the link to the gift card: http://www.sittingpretty.co.za/shop/gift-voucher/

Then for the waiting list: http://www.sittingpretty.co.za/shop/sipi-shirred-shorts-twill/

Just select a colour and size and it’ll come up. I would like both blocks to look the same.

Thanks.

[sittingprettyclothing]

David, can you please respond?

[David Martin – Support]

Hi,

Please do not thread bump, it pushes you back to the end of the support list!

1) To change the grey label, please use this. The actual text is set within the 3rd party plugin you are using and not the theme.

.gift-cards-list .label, 
.gift-cards-list label {
    background: none!important;
    line-height: 40px;
    padding-right: 10px;
    text-shadow: none;
    color: #222;
  font-weight: bold!important;
}

2) For that, this should do it.

button.single_add_to_cart_button.button.btn.btn-primary.ct-waitlist-add-button {
    background-color: transparent !important;
    font-weight: 400 !important;
}

[sittingprettyclothing]

The only reason for it was so I can get a response or at least get someone else to help.

Anyway, thanks a lot. Everything is as it should be.

[Rui Guerreiro – SUPPORT]

Great. Glad it’s sorted.

-Rui