Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Recommended Posts

Posted

Need to change the blue high lighted text from black to white.

image.png.8f87417d659783c97526d5c65273fb4f.png

 

Changing the a.btn from color: #000000;   to color: #ffffff;

Does the trick but can't locate the a.btn in w.cart

image.png.abd671ee98a86ff3af80a41334c475b9.png

Posted

Hi Ken,

Looking at the styles on the live site, there is another rule which is taking priority as it has been definded as "!important". 

Image of Live CSS from browser debug (note the a.btn rule)

image.png.b04a65cd394b6c51be90ee84e8895248.png

 

You need to change the button colour using that rule.  So there are 2 ways to do this... :)

1) You can either edit the CSS file for main, as you have been doing, and search for the style definition for "a.btn" and make the changes there...

image.thumb.png.2c7b5920d5e0b3442217d3493e858834.png

 

Or 

2) use the "customize theme styles" button at the top, expand the buttons section and then on the right hand side hover over the "transparent button" to reveal the "edit" option, then set the background and font colours in the popup window.  (You will see a preview of how your button will look on the left of the button section)

For white text, click the font tab, and in the colour dropdown choose "$font-color-reverse-2"

 

image.thumb.png.3792ee2f242db47c78f1184b5eac9fe6.png

image.png.c98d16f18d03a45406681367167dcbc9.png

 

 

 

Posted

Andy,it was simple enough using the style editor, and the button looked correct but it isn't taking on the web site.

Is the ":!important;" need added at the end of the .btn 's 

Posted

All the .btn 's start off with this

.btn-2 {
  background-color: $hunter-green;
  color: $font-color-reverse-2;.btn-2 {
 

Posted

It looks like the colour on the a.btn will trump everything, so change the font colour there

a.btn {
  color: $font-color-reverse-2!important;
}

 

Posted (edited)

 

Optionally, also be worth considering using the other green that you have defined for the header bar, for the button background-color too. 

 

image.png.170f0ea22621f81048837f216e1339e4.png

 

image.png.c86055a2e733a5dab85afd63643b3372.png

Edited by CHD-UK
Posted

That did it,  should the other .btn 's be left as changed?

Yes, that does look better.

This has sure given my old brain a work out, have to admit knocking on 80  it aint what it used to be .😄

Posted (edited)

Yes, leave them as styled for now, you can always adjust them later if you notice one not behaving.  As with the button you've just styled, you could use that same 'header' green colour for the button background - This will then sort out the button on the bottom of the  popup login form when you click the account icon.

80! You are doing amazing, I mean check you out.... where did those rounded corners come from eh?!! :)

image.png.77f4dbb2425dac6e512be6983e72fbf7.png

 

Edited by CHD-UK

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...