Search code examples
rshinymodal-dialogbslib

Set R shiny modal width when theme is defined by bslib

How can I set the modal width to 80% when bs_theme() is active? Is there a possibility within bs_theme()? I just can't get it right with the tags.

library(shiny)
library(bslib)
ui <- fluidPage(
    shiny::bootstrapLib(),
    theme = bs_theme(
        version = 4,
        bootswatch = "minty"),
    tags$style(".modal-dialog{width: 80% !important;}"),
    actionButton("open_modal", "open modal"),
)

server <- function(input, output) {
    observeEvent(input$open_modal, {
        showModal(
            modalDialog(
                title = "This modal isn't 80% wide")
        )
    })
} 
shinyApp(ui = ui, server = server)
Solution

  • Use tags$style(".modal-dialog {max-width: 80vw;}") instead. It makes sure your modal is always 80% of the entire window, resize automatically when you change window size.