Missing a class for ratings mouse-over effect

  • Resolved Timofey Drozhzhin

    (@drtimofey)


    7 years, 5 months ago

    The comment star rating is missing a class for Hover Effect.

    Currently, each star has a class “wprm-rating-star”. Each filled star has an additional class “rated”. However, there is no class “mouse-over” whenever a mouse hovers over the star. For example, when the mouse hover over star #4, stars 1-4 are expected to have a class “mouse-over”. This way, in my CSS I can say .wprm-rating-star.mouse-over polygon { fill: yellow }

    Hope it makes sense.

    The issue can be demonstrated on WPRM demo site:
    https://demo.wprecipemaker.com/amazing-vegetable-pizza/

    Thanks!
    Tim

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Brecht

    (@brechtvds)

    7 years, 5 months ago

    Hi Tim,

    It actually works fine on our demo site for me. What browser are you using?

    We don’t add a class but use JavaScript to change the color to the one set on the WP Recipe Maker > Settings page. Just CSS wouldn’t work because you need the previous stars to change color as well, not just the one you’re hovering over.

    • This reply was modified 7 years, 5 months ago by Brecht.
    Thread Starter Timofey Drozhzhin

    (@drtimofey)

    7 years, 5 months ago

    That’s exactly what I’m saying 🙂 There is no way to override the Hover color via CSS file.

    We control all of our styles through the template’s CSS file.

    • We set the color of an empty star – .wprm-rating-star svg g polygon { fill: #fff }
    • We set the color of a solid star – .wprm-rating-star.rated svg g polygon { fill: #333 }
    • But there is no way to override the hover color, because no class is added on hover – .wprm-rating-star.????? svg g polygon { fill: #333 }

    It would be very beneficial to have the JS insert the class name for the stars that are being hovered, so that we can control the color via CSS files.

    Hope this makes sense.

    Thanks,
    Tim

    Plugin Author Brecht

    (@brechtvds)

    7 years, 5 months ago

    Well sure. Will look into adding that later.
    But the easiest is just using the setting for star color. Any reason why that doesn’t work for you?

    Thread Starter Timofey Drozhzhin

    (@drtimofey)

    7 years, 5 months ago

    But the easiest is just using the setting for star color. Any reason why that doesn’t work for you?

    There are no issues with the settings functionality itself 🙂

    It’s just we need to be able to control these styles via CSS file.

    Thanks for doing this! I’ll keep an eye out for it.

    Plugin Author Brecht

    (@brechtvds)

    7 years, 4 months ago

    Hi again,
    ​
    ​I wanted to let you know that we released WP Recipe Maker 4.2.0 which now adds one of these classes when hovering over the stars:

    wprm-rating-star-selecting-filled
    wprm-rating-star-selecting-empty

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Missing a class for ratings mouse-over effect’ is closed to new replies.