Change Icon Color

This topic has 8 replies, 3 voices, and was last updated 9 years by louder.

Author
June 17, 2015 at 06:27 #63363

louder
Participant

i am not a programmer but is there an easy way to change the icon and button color? it is light blue and i need it #99098A

thanks,
will

June 17, 2015 at 08:58 #63369

schadwick
Participant

I don’t work for the seventhqueen team but I can help, depends on which buttons and icons you are trying to change.

June 17, 2015 at 18:28 #63510

louder
Participant

i would like to try and change the icon color in the “feature item” widget

thanks for your help.
June 17, 2015 at 20:03 #63526

schadwick
Participant
So it looks like the “feature item widget” uses a couple different css selectors for styling.

To change the color add this to your style.css file under Appearance > Editor or in the Quick CSS section in the Theme Options.
COPY CODE
```
.feature-icon {
color: green; 
}
```
Keep in mind that those icons are actually a font so the size can be changed by adding
COPY CODE
```
.feature-icon {
font-size: 40px;
}
```
Finally by default, Kleo has set the feature item icon to have an opacity(transparent) of .1 so to change that add this
COPY CODE
```
.el-appear {
opacity: 1 !important;
}
```
Hope this helps!
June 17, 2015 at 20:46 #63539

louder
Participant

Hey there.

thank for you help. So it appears that it worked for some of my pages where i had the features set up but not all. also, do you know how i can change the color when you round over the icon feature?

thanks again,
will

June 17, 2015 at 22:55 #63562

sharmstr
Moderator

Why not use the built in way of doing it?

Theme Options > Styles

Either change the change the main or alternate sections. For featured items, make sure you set your row to use the appropriate style (main or alternate)

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

June 18, 2015 at 00:47 #63579

louder
Participant

hey there,

i actually tried doing this and it didn’t take. i basically changed the color that came with the demo content to the color i want. it show correctly in the style however it does not seem to be showing up. i cleared the cache…so that was i was question if there was another way of doing this. is the style section, what line should i be updating to change the icon (please see below).

again thank you for your help.

Text color*

Transparent
Background color
Default: #ffffff

Transparent
Background image

Upload
Border color*

Transparent
Link colorSelect your color for text elements
Default: #367bb7

Transparent
Hover link color
Default: #00b9f7

Transparent
Highlight color*

Transparent
Highlight background color
Default: #00b9f7

Transparent
Alternate background color
Default: #f7f7f7

Transparent
Alternate border color*

Transparent

June 18, 2015 at 16:20 #63655

sharmstr
Moderator

respond privately with a link a credentials

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

June 19, 2015 at 16:48 #63883

louder
Participant

Hi there,

Since i was just started with the site i actually just reinstalled with the 3.0 and did not load the demo content and it appears that i can just use the system to change the color. this was not working before. again many thanks for your help.

best,
will
Author

Posts

Viewing 9 posts - 1 through 9 (of 9 total)

The forum ‘KLEO’ is closed to new topics and replies.

Search KB

Log in with your credentials

Forgot your details?