how to add the class in the R script

[shangguandong1996]

In the demo: 2019 Women's World Cup Predictions. There are some class at the bottom, like

.spi-rating {
  width: 30px;
  height: 30px;
  border: 1px solid rgba(0, 0, 0, 0.03);
  border-radius: 50%;
  color: #000;
  font-size: 13px;
  letter-spacing: -2px;
}

But I do not know how to write these code in the R script. If I just type these code in the R script. It will give an error. I am sorry that I am not family with the js or html.

Best wishes & Happy new year!

Guandong

[glin]

Hi,

That's CSS, which you can embed in an R Markdown document like this:

```{css, echo=FALSE}
.spi-rating {
  width: 30px;
  height: 30px;
  border: 1px solid rgba(0, 0, 0, 0.03);
  border-radius: 50%;
  color: #000;
  font-size: 13px;
  letter-spacing: -2px;
}

This is how I do it in the demo:
https://github.com/glin/reactable/blob/b50c860678500eed720e1a568221ea41b3479a83/vignettes/womens-world-cup/womens-world-cup.Rmd#L162-L166

You can also add custom CSS through an external `.css` file, which could be easier to manage -- check out https://bookdown.org/yihui/rmarkdown/html-document.html#custom-css for how to do this in an HTML document.

Or if you want to add CSS to a Shiny app, you can use one of the methods described here: https://shiny.rstudio.com/articles/css.html

---

edit: this is now documented at https://glin.github.io/reactable/articles/examples.html#custom-css