bs4Dash (version 0.5.0)

bs4InfoBox: Boostrap 4 info box

Description

A beautiful AdminLTE3 info box.

Usage

bs4InfoBox(
  ...,
  tabName = NULL,
  title,
  value = NULL,
  icon = NULL,
  iconElevation = 3,
  status = NULL,
  gradientColor = NULL,
  width = 4,
  elevation = NULL
)

infoBox( ..., tabName = NULL, title, value = NULL, icon = NULL, iconElevation = 3, status = NULL, gradientColor = NULL, width = 4, elevation = NULL )

Arguments

...

Any extra UI element.

tabName

Optional: bs4InfoBox may be used to navigate between tabs.

title

Info box title.

value

The value to display in the box. Usually a number or short text.

icon

An icon tag, created by icon.

iconElevation

Icon elevation compared to the main content (relief). 3 by default.

status

A color for the box. "primary", "info", "success", "warning", "danger" or NULL.

gradientColor

If NULL (the default), the background of the box will be white. Otherwise, a color string. "primary", "success", "warning" or "danger".

width

The width of the box, using the Bootstrap grid system. This is used for row-based layouts. The overall width of a region is 12, so the default width of 4 occupies 1/3 of that width. For column-based layouts, use NULL for the width; the width is set by the column that contains the box.

elevation

Infobox elevation.

See Also

Other cards: bs4Card(), bs4TabCard(), bs4ValueBox()

Examples

Run this code
# NOT RUN {
if(interactive()){
 library(shiny)
 library(bs4Dash)
 
 shiny::shinyApp(
   ui = bs4DashPage(
     navbar = bs4DashNavbar(),
     sidebar = bs4DashSidebar(),
     controlbar = bs4DashControlbar(),
     footer = bs4DashFooter(),
     title = "test",
     body = bs4DashBody(
      fluidRow(
       bs4InfoBox(
        title = "Messages",
        value = 1410,
        icon = "envelope"
       ),
       bs4InfoBox(
        title = "Bookmarks",
        status = "info",
        value = 240,
        icon = "bookmark"
       ),
       bs4InfoBox(
        title = "Comments",
        gradientColor = "danger",
        value = 41410,
        icon = "comments"
       )
      )
     )
   ),
   server = function(input, output) {}
 )
}

# }

Run the code above in your browser using DataLab