Changing background-image (or any two worded css properties) in rhandsontable - css

Question

There are a lot of examples out there that illustrate how to use a custom rendering with rhandsontables, but unfortunately they all use a single worded css properties, like color or background.
How about two worded css-properties like background-color, background-image, font-size etc.? Replacing the hyphen(-) with a dot(.) doesn't work.
And using hyphens breaks the code and throws this error:
ReferenceError: invalid assignment left-hand side
In that code example, I want to assign a linear-gradient as background-image and change the color to red, if the value is "F".
The red color happens, but no gradient appears.
How can I fix that?
library(rhandsontable)
library(shiny)
DF = data.frame(val = 1:10, bool = TRUE, big = LETTERS[1:10], stringsAsFactors = FALSE)
ui <- fluidPage(
rHandsontableOutput("tbk")
)
server <- function(input, output) {
output$tbk <- renderRHandsontable({
rhandsontable(DF, width = 550, height = 300) %>%
hot_cols(renderer = "
function (instance, td, row, col, prop, value, cellProperties) {
Handsontable.renderers.TextRenderer.apply(this, arguments);
if (value == 'F') {
td.style.background-image = 'linear-gradient(to right, transparent, green)';
td.style.color = 'red';
} else if(value == 'J') {
td.style.background = 'lightgreen';
} else if(value == 'A' | value == 'x') {
td.style.background = 'lightblue'}
}")
})
}
shinyApp(ui, server)

Answer 1

If I tried few more minutes, I wouldn't have needed to ask the question. But anyway, it might be useful for other people which are strugling with that, as I didn't find too much reference on that.
The solution is to remove the hyphen and dot and make the first letter upper-case.
So background-image becomes backgroundImage, or font-size becomes fontSize!
library(rhandsontable)
library(shiny)
DF = data.frame(val = 1:10, bool = TRUE, big = LETTERS[1:10], stringsAsFactors = FALSE)
ui <- fluidPage(
rHandsontableOutput("tbk")
)
server <- function(input, output) {
output$tbk <- renderRHandsontable({
rhandsontable(DF, width = 550, height = 300) %>%
hot_cols(renderer = "
function (instance, td, row, col, prop, value, cellProperties) {
Handsontable.renderers.TextRenderer.apply(this, arguments);
if (value == 'F') {
td.style.backgroundImage = 'linear-gradient(to right, transparent, green)';
td.style.fontSize = '25px';
td.style.color = 'red';
} else if(value == 'J') {
td.style.background = 'lightgreen';
} else if(value == 'A' | value == 'x') {
td.style.background = 'lightblue'}
}")
})
}
shinyApp(ui, server)