Bootstrap progress variables

Those variables can be used to customize progress bars (e.g. shinyWidgets::progressBar and shiny::Progress or shiny::withProgress) in Bootstrap and Bootswatch themes.

bs_vars_progress(
  bg = NULL,
  bar_color = NULL,
  border_radius = NULL,
  bar_bg = NULL,
  bar_success_bg = NULL,
  bar_warning_bg = NULL,
  bar_danger_bg = NULL,
  bar_info_bg = NULL
)

Arguments

bg

Background color of the whole progress component

bar_color

Progress bar text color

border_radius

Variable for setting rounded corners on progress bar.

bar_bg

Default progress bar color.

bar_success_bg

Success progress bar color.

bar_warning_bg

Warning progress bar color.

bar_danger_bg

Danger progress bar color.

bar_info_bg

Info progress bar color.

Value

a list that can be used in create_theme.

Examples

bs_vars_progress(
  border_radius = "15px",
  bar_bg = "#1B9E77",
  bar_info_bg = "#D95F02",
  bar_success_bg = "#7570B3",
  bar_danger_bg = "#E7298A"
)
#> $`progress-border-radius`
#> [1] "15px"
#> 
#> $`progress-bar-bg`
#> [1] "#1B9E77"
#> 
#> $`progress-bar-success-bg`
#> [1] "#7570B3"
#> 
#> $`progress-bar-danger-bg`
#> [1] "#E7298A"
#> 
#> $`progress-bar-info-bg`
#> [1] "#D95F02"
#> 
#> attr(,"class")
#> [1] "fresh_sass_vars" "bootstrap_vars"  "list"           

if (interactive()) {
  library(shiny)
  library(shinyWidgets)

  ui <- fluidPage(
    use_theme(
      create_theme(
        theme = "default",
        bs_vars_progress(
          border_radius = "15px",
          bar_bg = "#1B9E77",
          bar_info_bg = "#D95F02",
          bar_success_bg = "#7570B3",
          bar_danger_bg = "#E7298A"
        ),
        output_file = NULL
      )
    ),
    tags$h1("Custom progress bars"),
    fluidRow(
      column(
        width = 6,
        progressBar(
          "pb1", value = 90, display_pct = TRUE
        )
      ),
      column(
        width = 6,
        progressBar(
          "pb2", value = 70, status = "info", display_pct = TRUE
        )
      ),
      column(
        width = 6,
        progressBar(
          "pb3", value = 50, status = "success", display_pct = TRUE
        )
      ),
      column(
        width = 6,
        progressBar(
          "pb4", value = 30, status = "danger", display_pct = TRUE
        )
      )
    ),
    plotOutput("plot")
  )

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

    output$plot <- renderPlot({
      withProgress(message = 'Calculation in progress',
                   detail = 'This may take a while...', value = 0, {
                     for (i in 1:15) {
                       incProgress(1/15)
                       Sys.sleep(0.25)
                     }
                   })
      plot(cars)
    })

  }

  shinyApp(ui, server)
}