Site URL: https://www.rando.report
@tuan, I hoped this might be easy...
I installed universal filter plugin. I'm using it to sort with tags. i have the tags looking similar to other buttons on my site. Hover color is correct, and the tags should be working with multiples enabled. But I can't figure out how to keep the hover color visible when the button is active, going back to regular background color when it is clicked a second time to deactivate.
I also wanted this to apply to the tag buttons that show up on mobile in the filter overlay.
https://www.rando.report/all-the-stuff
Believe this is the css code I have shaping the tag filter buttons. I guess they are a customized version of my site's medium buttons, though maybe that was not really the proper way to do it. In any case, the hover color is defined here — can the active state be added in, or is this the wrong place for that?
.medium-buttons {
/* font size */
font-size: 12px !important;
/* Button Text Color */
color: #fff !important;
/* Glass tint/colour */
background-color: rgba(255,255,255,.1) !important;
/* Corner rounding */
border-radius: 20px !important;
/* Dropshadow */
box-shadow: 0px 5px 10px rgba(0,0,0,.6)!important;
/* Hover transition speed */
transition: all 0.5s !important;
&:hover {
/* Glass tint/colour on hover */
opacity: 1 !important;
background-color: rgba(222,0,255,.8) !important;
/*button font color*/
color: #ffffff !important;
/* border */
border-width: 0 !important
}
}
Thanks for any help you may have,
-daria