cochize1 40 Posted January 8, 2021 Share Posted January 8, 2021 So, I have changed my OSD button colors with this code: /*change OSD play colors*/ button.videoOsd-btnPause {color: #52b54b; background-color: rgba(255,0,0,0.2);} button.btnOsdFastForward {color: #D4AF37} button.btnRewind {color: #D4AF37} div.videoOsdVolumeControls {color: #1E6EA5} button.btnNextTrack {color: #E0B0E8} and as you see I tried to change background circle color to RED to check if it works. It does, but it seems that there are more states to these: when left alone, when clicked, when OSD disappears and reappears (maybe more). What I want to achieve is to have the colors set for the buttons as it is in my code but have them stayed with that color after clicking etc (well, always) with corresponding background circle color whenever it should appear. How to go about that? Link to comment Share on other sites More sharing options...
Solution Happy2Play 8281 Posted January 8, 2021 Solution Share Posted January 8, 2021 You need to add :focus and :active for that element. button.videoOsd-btnPause:focus, button.videoOsd-btnPause:active {color: #52b54b; background-color: rgba(255,0,0,0.2);} Link to comment Share on other sites More sharing options...
cochize1 40 Posted January 8, 2021 Author Share Posted January 8, 2021 ok, so I finished with this code button.videoOsd-btnPause, button.videoOsd-btnPause:focus, button.videoOsd-btnPause:active {color: #52b54b; background-color: rgba(82, 181, 75, 0.2);} button.btnOsdFastForward, button.btnOsdFastForward:focus, button.btnOsdFastForward:active {color: #D4AF37; background-color: rgba(212, 175, 55, 0.2);} button.btnRewind, button.btnRewind:focus, button.btnRewind:active {color: #D4AF37; background-color: rgba(212, 175, 55, 0.2);} and it seems ok with one exception: now, the background circle is always on, not just when clicked on with just your code the buttons stay white and change colors only when clicked on how to make them the circle disappear when there is no interaction with the buttons? Link to comment Share on other sites More sharing options...
cochize1 40 Posted January 8, 2021 Author Share Posted January 8, 2021 scratch that, this solved the problem: button.videoOsd-btnPause {color: #52b54b} button.videoOsd-btnPause:focus, button.videoOsd-btnPause:active {color: #52b54b; background-color: rgba(82, 181, 75, 0.2);} button.btnOsdFastForward {color: #D4AF37} button.btnOsdFastForward:focus, button.btnOsdFastForward:active {color: #D4AF37; background-color: rgba(212, 175, 55, 0.2);} button.btnRewind {color: #D4AF37} button.btnRewind:focus, button.btnRewind:active {color: #D4AF37; background-color: rgba(212, 175, 55, 0.2);} thank you again 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now