Change table-striped color in formattable in Rmarkdown

Question

This is a follow up question from the good answer provided here:

Stripe effect in formattable(), shadow in light gray every other row. R

is there any way to change the default light gray background for the striped zebra grayish rows? lets say to change them to red or to blue? where should I include this instruction?

library("htmltools")
library("webshot")  
library(formattable)
DF <- data.frame(Ticker=c("", "", "", "IBM", "AAPL", "MSFT"),
                 Name=c("Dow Jones", "S&P 500", "Technology", 
                        "IBM", "Apple", "Microsoft"),
                 Value=accounting(c(15988.08, 1880.33, 50, 
                                    130.00, 97.05, 50.99)),
                 Change=percent(c(-0.0239, -0.0216, 0.021, 
                                  -0.0219, -0.0248, -0.0399)))

################################## FUNCTIONS ##################################
unit.scale = function(x) (x - min(x)) / (max(x) - min(x))
export_formattable <- function(f, file, width = "100%", height = NULL, 
                               background = "white", delay = 0.2)
    {
      w <- as.htmlwidget(f, width = width, height = height)
      #Remove row height!
      w <- htmlwidgets::prependContent(w, tags$style("td { padding: 0px  !Important;}"))
      path <- html_print(w, background = background, viewer = NULL)
      url <- paste0("file:///", gsub("\\\\", "/", normalizePath(path)))
      webshot(url,
              file = file,
              selector = ".formattable_widget",
              delay = delay)
    }
###############################################################################

FT <- formattable(DF, align =c("l","c","r","c"), list(
  Name=formatter("span", 
                 style = x ~ ifelse(x == "Technology", style(font.weight = "bold"), NA)), #NOT APPLIED when we output to PNG with the function!
  #Value = color_tile("white", "orange"),
  Value = color_bar("orange" , fun = unit.scale
                    ),
  Change = formatter("span", 
                     style = x ~ style(color = ifelse(x < 0 , "red", "green"), "font.size" = "18px"), 
                     x ~ icontext(ifelse(x < 0, "arrow-down", "arrow-up"), x)
                     )),
  table.attr = 'class=\"table table-striped\" style="font-size: 18px; font-family: Calibri"')

FT
#OUTPUT the table in the document as an image!
export_formattable(FT,"/outputpath/FT.png")

Thanks!

Answer 1

You can add css to color odd or even rows:

library("htmltools")
library("webshot")  
library(formattable)
library(htmlwidgets)
DF <- data.frame(Ticker=c("", "", "", "IBM", "AAPL", "MSFT"),
                 Name=c("Dow Jones", "S&P 500", "Technology", 
                        "IBM", "Apple", "Microsoft"),
                 Value=accounting(c(15988.08, 1880.33, 50, 
                                    130.00, 97.05, 50.99)),
                 Change=percent(c(-0.0239, -0.0216, 0.021, 
                                  -0.0219, -0.0248, -0.0399)))

################################## FUNCTIONS ##################################
unit.scale = function(x) (x - min(x)) / (max(x) - min(x))
export_formattable <- function(f, file, width = "100%", height = NULL, 
                               background = "white", delay = 0.2)
{
  w <- as.htmlwidget(f, width = width, height = height)
  #Remove row height!
  w <- htmlwidgets::prependContent(w, tags$style("td { padding: 0px  !Important;}"))
  path <- html_print(w, background = background, viewer = NULL)
  url <- paste0("file:///", gsub("\\\\", "/", normalizePath(path)))
  webshot(url,
          file = file,
          selector = ".formattable_widget",
          delay = delay)
}
###############################################################################

FT <- formattable(DF, align =c("l","c","r","c"), list(
  Name=formatter("span", 
                 style = x ~ ifelse(x == "Technology", style(font.weight = "bold"), NA)), #NOT APPLIED when we output to PNG with the function!
  #Value = color_tile("white", "orange"),
  Value = color_bar("orange" , fun = unit.scale
  ),
  Change = formatter("span", 
                     style = x ~ style(color = ifelse(x < 0 , "red", "green"), "font.size" = "18px"), 
                     x ~ icontext(ifelse(x < 0, "arrow-down", "arrow-up"), x)
  )),
  table.attr = 'class=\"table table-striped\" style="font-size: 18px; font-family: Calibri"')

FT %>%
  formattable() %>%
  as.htmlwidget() %>%
  prependContent(tags$style("tr:nth-child(odd) {background-color: red !important;}")) %>%
  prependContent(tags$style("tr:nth-child(even) {background-color: blue !important;}"))