pickerInput font or background color

Question

I am using pickerInput in my shiny dashboard, which is fine except for one issue: The background color and font color are too similar, making the filter choices difficult to read.

Is there any way to change either the background or font color? I'd like to continue to use pickerInput if possible, but if there's a method with selectInput or anything else that'd be fine.

Sample of one of my pickerinputs that produces the result in the screenshot:

output$typeOutput80 <- renderUI({
  Commodity.Name <- as.vector( unique(DF2()$Commodity.Name) )
  pickerInput("typeOutput80", "Commodity:", 
     choices=Commodity.Name, Commodity.Name [1:10000], multiple=TRUE, 
     options = list(`actions-box` = TRUE, `live-search` = TRUE, 
                    `selected-text-format`= "static", title = "Commodity List")
  )
})`

Can you provide your code for at least that `pickerInput` as an example of what you're using and/or what you've tried so far? — phalteman, Jan 08 '19 at 19:24

score 8 · Accepted Answer · answered Jan 09 '19 at 18:33

This is a bit of a hacky solution, but it may work for you, or at least send you down the right path.

You can use the choicesOpt argument of pickerInput to describe formatting for individual options within the dropdown menu. Specifying the colour, background, or weight there will change the relevant elements to whatever you choose. The trick is that the arguments apply to only the first choice, so you need to replicate the style argument for as many choices as you have. I've done this with rep() and I've just stuck a value there (10) to match choices, but you will likely want to define that value programmatically based on wherever your Commodity List data is from.

library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  pickerInput("id", "Formatting changes", multiple=T, choices = sample(LETTERS, size = 10), 
              options = list(`actions-box` = TRUE, `live-search` = TRUE, 
                         `selected-text-format`= "static", title = "Commodity List"),
              choicesOpt = list(
                style = rep(("color: black; background: lightgrey; font-weight: bold;"),10)))
)

server <- function(input, output){}

shinyApp(ui, server)

How would you adapt this for a dynamic pickerInput? That is, if the pickerInput is populated after the other inputs are filled in and a count of number of things that goes into the list is made via a updatePickerInput on the server side. — Mr.CR, Jan 29 '20 at 11:05
@CheeniyilRamachandran, Good question. Maybe you can ask a new question with an example (maybe based on this one) and a description of what specific behaviour you'd like to see? — phalteman, Jan 29 '20 at 19:36
I was wary of starting a new question, since stackoverflow is strict towards duplicate question. But if you think this would not be a duplicate, I shall do that:-) — Mr.CR, Jan 30 '20 at 09:08
@phalteman: how do you change the background color of the selection box itself? Thanks! — Tung, Sep 22 '21 at 01:01

pickerInput font or background color

1 Answers1

Linked