Add stars CSS

This function adds the appropriate CSS to your page for star ratings.

use_fivestars(
  star_size = "larger",
  star_color = "#fc0",
  star_background = "#999"
)

Arguments

star_size	CSS font size for your stars, default is "larger"
star_color	CSS colour for star, default is #fc0
star_background	CSS colour for star background, default is #999

Value

HTML that inserts CSS into the page head

Examples

use_fivestars()
#> <style>:root {
#>   --star-size: larger;
#>   --star-background: #999;
#>   --star-color: #fc0;
#> }
#>         
#> .fivestars {
#>   --percent: calc(var(--rating)/5 * 100%);
#>   /* display: inline-block; */
#>   font-size: var(--star-size);
#>   line-height: 1;
#> }
#> 
#> .fivestars::before {
#>   content: '\2605\2605\2605\2605\2605';
#>   background: linear-gradient(90deg, var(--star-color) var(--percent), 
#>                               var(--star-background) var(--percent));
#>   -webkit-background-clip: text;
#>   -webkit-text-fill-color: transparent;
#> }</style>