简体   繁体   中英

How to change font size of the input in airDatepicker from shinywidgets package?

I'm using airDatepicker from the shinyWidgets package. Here's my code:

airDatepickerInput(inputId = "choosedate", label = "month range", range = TRUE, placeholder = "choose month range", dateFormat = "M yy", view = "months", minView = "months", clearButton = TRUE,
autoClose = TRUE, update_on = "close", inline = FALSE, monthsField = "monthsShort", separator = " - ",
width = "161px", value = c("2010-01-01", "2019-12-31"), addon = "right")

I also use tags$style to put all of my CSS code. Currently the font of airDatepicker (the input, not the label) is way too large for the rest of my dashboard. Here's the parts which fonts I want to make smaller :

Here

How do I do it? Thank you.

You'll have to find the correct selectors (eg with your browser):

library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  tags$head(tags$style(HTML('
                            #choosedate {font-size: 75%}
                            #datepickers-container > div > nav {font-size: 75%;}
                            #datepickers-container > div > div.datepicker--content {font-size: 75%;}
                            #datepickers-container > div > div.datepicker--buttons > span {font-size: 75%;}
                            '))),
  airDatepickerInput(inputId = "choosedate", label = "month range", range = TRUE, placeholder = "choose month range", dateFormat = "M yy", view = "months", minView = "months", clearButton = TRUE,
                     autoClose = TRUE, update_on = "close", inline = FALSE, monthsField = "monthsShort", separator = " - ",
                     width = "161px", value = c("2010-01-01", "2019-12-31"), addon = "right")
)

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

shinyApp(ui, server)

前 后

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM