Reduce the font size of the text within a sidebarPanel-CodePudding

I have the following snippet of code:

sidebarPanel(
    selectizeInput(
        "s1",
        "Select s1",
        choices = c('A', 'B'),
        multiple = FALSE
    ),
    radioButtons(
        "r1",
        "Select r1",
        choices = c("A", "B", "C")
    ),
    radioButtons(
        "r2",
        "Select r2",
        choices = c("P", "R")
    ),
    selectizeInput(
        "s3",
        "Select s3",
        choices = c('C', 'D'),
        multiple = FALSE
    ),
    selectizeInput(
        "s4",
        "Select s4",
        choices = c('A', 'B'),
        multiple = TRUE
    ),
    actionButton(
        "b1",
        "Enter"
    )
)

Is there a way to reduce the font size, say by 20%, of all the text contained in this sidebarPanel? Alternatively, can I change the font size in each of the selectizeInput or radioButtons?

CodePudding user response：

You can maybe wrap it in a div and style it with style = "font-size:75%;". For selectizeInput you will need to do the same as its a different object you can either do it by id or overall with .selectize-input { font-size: 75%;}:

library(shiny)

ui <- fluidPage(
  tags$style(type='text/css', ".selectize-input { font-size: 75%;} .selectize-dropdown { font-size: 75%; }"),
  div(style = "font-size:75%;",
      sidebarPanel(
        selectizeInput(
          "s1",
          "Select s1",
          choices = c('A', 'B'),
          multiple = FALSE
        ),
        radioButtons(
          "r1",
          "Select r1",
          choices = c("A", "B", "C")
        ),
        radioButtons(
          "r2",
          "Select r2",
          choices = c("P", "R")
        ),
        selectizeInput(
          "s3",
          "Select s3",
          choices = c('C', 'D'),
          multiple = FALSE
        ),
        selectizeInput(
          "s4",
          "Select s4",
          choices = c('A', 'B'),
          multiple = TRUE
        ),
        actionButton(
          "b1",
          "Enter"
        )
      )
  )
)

server <- function(input, output, session){
  
}

shinyApp(ui, server)