Topbar style

Support
#1

Hi. We are working on this page test.blommenhofutbildning.se
I would like the social media icons in the topbar to be a little bit more clear and not so transparent. I would also like the topbar to be a little bit transparent like: http://blommenhofutbildning.se

Is that possible?

Tomas

#2

Hi There,

It could be achieved with the custom CSS, please add this custom CSS under Theme Options > CSS:

.x-topbar {
    background-color: rgba(131, 185, 65, 0.7);
}

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

.home .masthead {
    position: absolute;
    width: 100%;
}

Hope that helps and thank you for understanding.

#3

Another question. Is there a way to do the same thing but for the footer on this page: www.test.blommenhofutbildning.se
The text in the footer is a little vague

#4

Hi There,

Thanks for writing in!

I can see the social icons are 100% solid, there no transparency in the color.
You can use a little bigger icon or different solid icon for a better look.

Regarding the bar transparency, I can see you have already use a transparent CSS color. You can decrease the opacity value for more transparent.

You can replace with this.

.x-topbar {
    background-color: rgba(131,185,65,0.5);
}

Hope this helps!

#5

Hi.
Ok. But is the latest code for the footer? I would like the text and social icons in the footer to be a little bit more clear

#6

Hi There @TomasJarvling

To fine tune it more, please try adding the following CSS rules also into your X -> Theme Options -> CSS area and change the color values accordingly to your preference.

footer.x-colophon.bottom .x-nav li a {
    color: white;
}
footer.x-colophon.bottom .x-nav li a:hover {
    color: red;
}

.x-colophon.bottom .x-social-global a {
    color: white;
}

.x-colophon.bottom .x-social-global a:hover {
    color: red;
}

Hope that helps.

#7

Thanks. Exactly what I wanted.
Thanks for the splendid support.
Tomas

#8

You’re most welcome Tomas :wink:

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.