change CSS of single element from shinyWidgets in flexdashboard

Question

Related to questions here and here , I would like to change the CSS of a pickerInput menu from ShinyWidgets. I am using flexdashboard and I would like the styling to match exactly that from the selectInput menu. I realize I can do this by setting the overall theme in the YAML to bootstrap, but I'd prefer not to use a global solution.

---
title: "Testing picker styles"
output: 
  flexdashboard::flex_dashboard
runtime: shiny
---
  
```{r setup, include=F}
library(shiny)
library(flexdashboard)
library(shinyWidgets)
```

Column 
-----------------------------------------------------------------------
  
```{r}
selectInput(inputId = "id1", label = "Select input", choices = attr(UScitiesD, "Labels"))
pickerInput(inputId = "id2", label = "Picker input", choices = attr(UScitiesD, "Labels"))
```

Answer 1

pickerInput is styled like a Bootstrap button, and {flexdashboard} use Bootswatch's Cosmo theme ( https://bootswatch.com/3/cosmo/ ) that's why it appears black.

You can change the class of the button with:

options = pickerOptions(style = "btn-link")

(in pickerInput arguments)

Or you can overwrite the base style like this:

options = list("style-base" = "form-control", style = "")