[Resolved] Change colour

[keepcalminsane]

How do i change the black to a blue on the site please using the foundation skin please can you help i think it look better with #2b71af also how to i make the text a bit smaller on the product names as well please please can you help me thanks

 

Sorry if i posted in wrong forum 

[Dirty Butter]

Welcome to the forums, @keepcalminsane !  Look in your skin/css/foundation.css file about line 1725. It's best to make a pristine copy (with it's own name) of all your skin files before you start fiddling with edits. Then you can always back out of any customizing you do that you aren't satisfied with.

.top-bar {
  background: #333333;

I found that code section by using the Firebug extension in FireFox. When you right click on a section you want to modify you will see "Inspect element with firebug". Choosing that brings up a window at the bottom of the page. On the right you will see the code locations, and you can edit it there to see if it does what you want.

Chrome and other browsers have something similar.

Right clicking on the product title indicates the coding for the title is inherited from H3 in foundation.css. So you'll have to search within foundation.css for where the sizing of H3 is coded.

[keepcalminsane]

Thanks may i ask about the text size that i put on the image as well please

 

I have changed  it but its still showing the black i have saved it and rechecked the code and its the one that i am after 

.top-bar {
  background: #2b71af;

any advice please 

[Dirty Butter]

Sorry, I should have reminded you to clear all CC cache in Maintenance, except images. Also clear your browser cache (Ctrl/F5).

I just tried the edit, and it worked partially. It turned to blue the empty part of the nav bar to the right of the text, but not where the text is. So there's another code somewhere that needs changing, too.

There's a top-bar-section a little further down in the foundation.css code. Maybe that's it.

[keepcalminsane]

what about the text size please bud 

[Dirty Butter]

I'm off my computer now and can't check, but as I recall there is a section near the bottom of foundation.css that lists the relative sizes of h1, h2, etc.

[keepcalminsane]

@Dirty Butter thank you so much for your help i have now sorted what i been trying to do for weeks thanks bud.

[Dirty Butter]

Glad to be of help.

[keepcalminsane]

@Dirty Butter sorry to bother you  when i change the colour of the text at the bottom of the page in the footer it changes it for the rest of the site is there anyway i can stop that from happening 

 

this is the code i changing the colour on

/* Default Link Styles */
a {
  color: #ffffff;
  line-height: inherit;
  text-decoration: none; }
  a:hover, a:focus {
    color: #258faf; }
  a img {
    border: none; }

the black arrow is what i want to keep that colour and the white arrow is what i want to change to white text

Edited May 7, 2017 by keepcalminsane
Forgot image

[Dirty Butter]

There's a footer section in cubecart.css. You should be able to copy that section over to cubecart.default.css and make adjustments there. You can see how hover, etc., is dealt with for the product titles and add something similar for the footer text. Cubecart.default.css is not overwritten on upgrades. Other tweaks you make to foundation.css, etc. will be lost on upgrade and you'll have to put your edits back any time Foundation is revised.

If you plan on extensive cosmetic changes, you might prefer to purchase a skin that provides easy ways to change colors, etc.

SemperFiWebServices has a new one out with lots of flexibility that can be dealt with from within Admin, rather than via file changes.

https://www.cubecart.com/extensions/skins/custom-foundation-5-skin

And there are several other commercial skins that might provide the look you want. Havenswift Hosting has some you might like. If you go that route, be sure it is a Foundation based skin, not an old v5 skin. The v5 skins work with v6, but some functionality of v6 will not be there out of the box.

[keepcalminsane]

$20 is a bit much for just changing a little bit to make site look good also this is the part that giving the problem 

/* Default Link Styles */
a {
  color: #ffffff;
  line-height: inherit;
  text-decoration: none; }
  a:hover, a:focus {
    color: #258faf; }
  a img {
    border: none; }

this a { part is giving the problem as it looks like its linked to the products when they get added to main page 

[Dirty Butter]

OK, if you don't want extensive changes:

You're going to have to play around with that section copied over to cubecart.default.css along with the footer section.

footer {
    background-color: #000;
    color: #fff;
}
footer h3 {
    color: #fff;
}

I'm not the one to tell you how to do it, though. Sorry.

[bsandall]

If you have time but not money, I recommend you learn how to use your web browser's developer tools.

For example, in Chrome and Firefox, you can right-click on a page element, such as an image or text, and choose 'Inspect' or 'Inspect Element' from the menu that pops up. On the right side of the developer panel that comes up at the bottom of the browser window, you should see 'Styles' or 'Rules', depending on your browser, for all of the CSS that affects that element.

You can edit these directly in that panel and see the changes in real-time in your browser window. Once you make a change that you like, you'll have to find the CSS file for the rule you edited and make the same changes there.

It can be a time-consuming process in the realm of dozens of hours if not more to create a good looking skin, especially if you are not experienced. So, a question to ask is how much is your time worth?

[keepcalminsane]

Thanks @bsandall for your advice.

 

I have now managed to change the part that i needed to not the way i was hoping but i managed to do it i have been able to do every thing is set out to do that i posted on here with the help of @Dirty Butter and i was able to sort out the last part my self using a format that should not be used as it can give problems but im not bothered as i only setting it up for a friend.

 

I also have all the time the world as i and in from of my computer from 9am -1am monday- sunday.

 

Thanks for advice tho 

Problem solved Thanks all for help