Top bar, footer bar, letters and social media icons color change

[boschus]

I want to change (in black) color for letters and social media icons in Topbar and footer bar.
Can you tell me how?

[ruenel]

Hello David,

Thanks for writing in!

To change the background color and color of the mentioned items, please go to X > Theme Options > Ethos and use the color pickers. You may also go to X > Theme Options > Typography > Site Links for the color and hover color of the links.

Hope this helps.

[boschus]

Thank you for your answer.
I can’t find those options there. I think that for changing the color of text and social media icons in the top bar above header and under the footer, you should give me some CSS codes, wright?

Thank you

[ruenel]

Hello David,

You can the text colors by using this custom css.

.x-topbar .p-info {
    color: red;
}

.x-topbar .x-social-global a {
  color: green;
}

.x-topbar .x-social-global a:hover {
    color: grey;
}

.x-colophon.bottom .x-colophon-content {
    color: red;
}

.x-colophon.bottom .x-colophon-content a,
.x-colophon.bottom .x-social-global a,
.x-colophon.bottom .x-nav li a,
.x-colophon.bottom .x-nav li:after {
    color: red;
}

.x-colophon.bottom .x-colophon-content a:hover,
.x-colophon.bottom .x-social-global a:hover,
.x-colophon.bottom .x-nav li a:hover {
    color: grey;
}

We would love to know if this has worked for you. Thank you.

Just to manage your expectations, this isn’t specifically a theme issue, but rather, your customisation of it. So whilst I have happily provided you with some guidance above on how to get it working, we cannot provide theme customisation as a general rule, or support custom code solutions provided. Therefore, you might find it helpful to check out the following:

CSS Selector Reference
How to find the css selector in chrome

[boschus]

Great, thank you.
Everything is working fine except this clickable part of the text, it is still white (on a left side in topbar in ‘topbar content’ area). How can I change that?

Thank you.

[friech]

Hi David,

Regarding that link color in the topbar, please add this to Theme Options > CSS

.x-topbar .p-info a {
    color: black;
}

Feel free to change that black color value.

Hope it helps,
Cheers!