I’m using a dark theme right now and the social login buttons can barely be read because the text is also dark, is there a css thing I can do to change the text white?
Right now I’m trying
.ember1170 .login-buttons { color: white; }
However its not working, any help is appreciated!
Did you change colors via Admin, Customize, Colors?
If that isn’t working for the basics of a dark theme in this particular area (login), it’s a bug and we should fix it.
I changed the color for the value that would be for the social buttons but it in fact changes the entire background color and everything for it and kinda ruining the style that was going on
Seems pretty easy to me?
<button data-ember-action="1256" class="btn btn-social facebook">with Facebook</button>
just target button .btn-social there?
Yes, most likely.
You don’t want to use the “ember number” values.
They are temporary numbers created when assets are compiled and are subject to being different.
I hate bringing back old threads like this, but I am having the same problem and didn’t see a solution posted anywhere.
I have many older users who have been asking me to “turn down the brightness” of the site for a while now because it was causing eye strain. These guys live on the site and spend many hours there going back and forth. They all seem to like the dark theme but are now complaining about some of the color choices (that’s easy) the biggest complaint has been about the social login boxes “looking crappy”. I tried making some adjustments to the color codes, but that didn’t do anything.
I searched but didn’t find another thread on this - although my taxonomy may not be employing technical terms. Apologies for the necropost in advance.
You will need to learn CSS and how to use Right Click > Inspect Element to alter the social buttons, those are not controlled by the Color Scheme.
That much I figured out. The guidance above seemed to be conflicting. Just was looking for a point in the right direction. Not sure that I have got that. I’ll just jam a bunch of stuff in and see what happens. Thanks for the help!
<button class="btn btn-social facebook" data-ember-action="" data-ember-action-1196="1196">with Facebook</button>
@sam will be working on user selectable color themes (starting with dark and light) next week or the week after.
So in that case you want to use CSS to target
.btn-social.facebook {
background-color: your_bg_color_here;
color: your_font_color_here;
}
Thanks and I didn’t want to create any work for anyone. I’m happy to try to figure things out myself and work my way through it. This helps a lot.
More than half of my users are between 60-70 years old and many have visual impairments. I just try to make things a little easier for them. I appreciate the time you took to help. Thanks @codinghorror I’ll be sure to pass the word!
No worries, and the CSS rule for the yahoo one will be similar just replace facebook with yahoo when you copy and paste that code block.
