Product Rating

The star rating. The stars are decorative and the rating is written out, so a screen reader says "4.5 out of 5" instead of reading five images.

Props

Prop	Type	Default	What it does
Star size	text	1rem	Any CSS length. The text beside them keeps its own size, so a bigger star does not drag the sentence with it.
Star color	text	#b45309
Show the text beside the stars	on / off	on	Off leaves the stars alone — what a product card usually wants. The sentence stays for screen readers and is the only thing that says the number: the stars themselves are hidden from them, because five images read one by one are not a rating.
Rating	text	{this.fecommerce.rating}	Comes from the product being shown. Inside a loop it follows each product by itself when the loop’s item is called «this»; with any other name, bind it to that name.
Rating label	text	{this.fecommerce.rating_label}	Comes from the product being shown. Inside a loop it follows each product by itself when the loop’s item is called «this»; with any other name, bind it to that name.

Variables of its own

Variable	Default	What it controls
--fe-woo-rating-size	1rem	How big each star is.
--fe-woo-rating-filled	#b45309	A filled star. Amber on its own account, for the same reason as the sale price.
--fe-woo-rating-empty	#d1d5db	The rest of the five.
--fe-woo-rating-text-color	var(--fe-woo-muted, #4b5563)	The «4.5 out of 5» written beside them.
--fe-woo-rating-text-size	var(--fe-woo-text-m, 0.88rem)	Its size.