Keyword
Please note that official support for commercial extensions & templates is provided in the Subscriber Help Desk.
Support requests should ONLY be directed there and require an active subscription plan.
This forum board is to be used for archive purposes and knowledge exchange ONLY.

Modifying primary color only

  • Kevin Kosbab
  • Kevin Kosbab's Avatar Topic Author
  • Offline
  • New Member
More
5 years 3 months ago #138924 by Kevin Kosbab
Kevin Kosbab created the topic: Modifying primary color only
Hi,

I'd like to keep the colors on my site as they are in the demo and change only the primary color--i.e., make what's yellow in the demo orange while maintaining all the greys. I can't seem to do this through the Colour Variations in the template options; whatever I put in for the other colors (as best I can figure from Firebug and _variables.scss) seems to break something else. For example, I tried these colors...

Background colour: #313840
Primary colour: #ff9e1f
Base colour: #313840
Light colour: #e9e9e9
Dark colour: #292929
Body text: #FFFFFF

That renders the text in the "Services" section of the front page in #e9e9e9, not rgba(49, 56, 64, 0.6) as in the demo. But if I put #313840 (i.e., rgb 49, 56, 64) in for the Light Colour instead, then Item Body backgrounds are the same color as the text. Setting Body Text as #FFFFFF doesn't give the right shades everywhere either--it seems like the hex colors input in Colour Variations don't inherit the rgba transparencies the way the built-in colors do.

Is there a set of values we can put into Colour Variations to replicate the demo default colors? If not, would it be feasible to edit the Sass files, or is there a simple way to do it in custom.css? (I'm fairly comfortable with CSS but new to Sass.)

Running Joomla 2.5.14, Archetype 1.0.5, and K2 2.6.8; behaviour replicated in a Quickstart install on a local server. Loving the simplicity of your templates; there's probably a simple fix I'm just not thinking of!

Please Log in or Create an account to join the conversation.

More
5 years 3 months ago #138925 by Krikor Boghossian
Krikor Boghossian replied the topic: Modifying primary color only
Hello Kevin,

First of all, you should update to Joomla! 2.5.22, there have been some security updates so you should update asap.

CSS and SASS are pretty much the same. You can edit both and get the same result.
If you want a quick solution I suggest you do a simple search/ replace in the template.css file.

SASS gives you the opportunity to drastically change all of your site's colours and no need to remember complex rgba values but have a small learning curve. For devs is a huge, huge time saver.
I would recommend using SASS only if you want to dig into web development and you have already mastered CSS.

In the end you can search for #f7ed05 (primary yellow colour ) and 247, 237, 5 and replace them with the colour you want to.

IMPORTANT: Please search the forum before posting a question!

JoomlaWorks Support Team Member

---
JoomlaWorks
www.joomlaworks.net/

Please Log in or Create an account to join the conversation.

  • Kevin Kosbab
  • Kevin Kosbab's Avatar Topic Author
  • Offline
  • New Member
More
5 years 2 months ago #138926 by Kevin Kosbab
Kevin Kosbab replied the topic: Modifying primary color only
Thanks for the quick reply (and sorry for the delay in mine!). Your solution sounds easy enough--I'll do that.

Thanks also for the security reminder--I thought my production system had been updated, but on inspection it's out of date too, so I'm updating now.

Please Log in or Create an account to join the conversation.

More
5 years 2 months ago #138927 by Krikor Boghossian
Krikor Boghossian replied the topic: Modifying primary color only
You 're welcome Kevin.

IMPORTANT: Please search the forum before posting a question!

JoomlaWorks Support Team Member

---
JoomlaWorks
www.joomlaworks.net/

Please Log in or Create an account to join the conversation.


Powered by Kunena Forum