Klaviyo Star Rating Button Style on Boost Theme

[Taiku]

So I have recently added the Klaviyo Star Rating widget onto my product page.  All is great except that my theme (Boost) is considering the star rating to be a Primary Button.  This is causing it to have a strange looking pink border around the widget.

Is there any way for me to make the widget not be under the Primary Button rules dictated by my theme?  Or at least to change it to be considered as a secondary button?  Thank you. Here is a link to a product where this can be seen: https://taiku.shop/products/fish-tail-cat-plush-toy

[Moeed · Accepted solution]

Hey @Taiku 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
button.kl_reviews__star_rating_widget {
    box-shadow: none !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Taiku]

Thank you!

[Moeed]

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

[Made4uo-Ribe]

Hi @Taiku 

Check this one if it works. 

1. From you Admin page, go to Online Store > Themes

1. Select the theme you want to edit
2. Under the Asset folder, open the main.css(base.css, style.css or theme.css)
3. Then place the code below at the very bottom of the file.

button.kl_reviews__star_rating_widget {
    --button-border-color: none !important;
}

• And Save 
• Result:
• 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!