Change Product Review star color in Product Grid, Featured Collection

Topic summary

Goal: change product review star color on collection/featured product grids (Shopify Crave, OS 2.0) to yellow.

What worked:

  • Adding CSS in assets/component-rating.css for .rating-star::before with -webkit-text-fill-color: rgb(255,164,28) changed stars to yellow on collection pages.
  • To remove the “5.0/5.0” text, hide p.rating-text.caption via CSS (display: none).

Layout fix:

  • The rating count dropped to a new line; keeping p.rating-count.caption as display: inline-block helped, but the key fix was correcting syntax errors in component-rating.css (removing an extra closing brace in .rating-star::before and fixing “inline- block” spacing). After cleanup, alignment worked.

Alternatives/notes:

  • Another suggestion set background: #FFA41C on .rating-star::before. Code snippets were central to the solution; screenshots showed before/after visuals.

Open questions (unresolved):

  • Hiding stars when there are 0 reviews is not feasible with CSS alone (no unique selector; would also hide valid reviews).
  • A user reported all items showing 5 stars after applying code; no fix posted.
  • Request to show blank stars for 0.0 rating remains unanswered.

Status: initial color-change issue resolved; follow-up feature requests remain open.

Summarized with AI on January 8. AI used: gpt-5.

@lowowl - not able to see that text 5.0/5.0

did you remove it?