rstudio / bslib

Tools for theming Shiny and R Markdown via Bootstrap 3, 4, or 5.
https://rstudio.github.io/bslib/
Other
443 stars 52 forks source link

run_with_themer() style depends on browser #954

Open royfrancis opened 6 months ago

royfrancis commented 6 months ago

I have tried bslib::run_with_themer() in chrome, firefox and safari.

The bootstrap and shiny themes are examples where they are very similar, but not identical.

bootstrap

shiny

The cosmo theme is an example where they are wildly different.

cosmo

The chrome version is the closest to reality because that's what I see in all browsers if I actually run the app with a theme (bs_theme(preset = "cosmo")).

R version 4.3.0 (2023-04-21)
Platform: aarch64-apple-darwin20.0.0 (64-bit)
Running under: macOS Ventura 13.6.2
bslib_0.6.1.9000
royfrancis commented 6 months ago

Also, it seems to hijack my submit button. Here is my app:

library(shiny)
library(bslib)
library(bsicons)
library(DT)

# ui
ui=page_fluid(
  card(style="margin-top:1em;",
    card_header(
      h2("bslib test"),
      h4("Testing UI components")
    ),
    layout_sidebar(
      sidebar = sidebar(
        fileInput("file-input","fileInput"),
        selectInput("select-input",label="selectInput",choices=c("A","B","C")),
        numericInput("numeric-input",label="numericInput",value=5,min=1,max=10),
        sliderInput("slider-input",label="sliderInput",value=5,min=1,max=10),
        textInput("text-input",label="textInput"),
        textAreaInput("text-area-input",label="textAreaInput"),
        dateInput("date-input",label="dateInput"),
        dateRangeInput("date-range-input",label="dateRangeInput"),
        radioButtons("radio-button",label="radioButtons",choices=c("A","B","C"),inline=T),
        tooltip(
          checkboxInput("checkbox", "checkboxInput", value = FALSE),
          "This is a tooltip"
        ),
        popover(
          bsicons::bs_icon("info-circle"),
          title = "This is a popover",
          "Popover message goes here"
        ),
        actionButton("action-button","Action"),
        hr(),
        submitButton()
      ),
      DT::datatable(iris)
    ),
    card_footer(
      "2024 Brand"
    )
  )
)

# server
server=function(input,output) {
}

shinyApp(ui=ui,server=server)
library(bslib)
run_with_themer()