bs4UserCard | R Documentation |
userBox creates a user card.
userDescription creates a customized title tag for userBox.
bs4UserCard(
...,
title = NULL,
footer = NULL,
status = NULL,
background = NULL,
width = 6,
height = NULL,
collapsible = TRUE,
collapsed = FALSE,
closable = FALSE,
maximizable = FALSE,
gradient = FALSE,
boxToolSize = "sm",
elevation = NULL,
headerBorder = TRUE,
label = NULL,
dropdownMenu = NULL,
sidebar = NULL,
id = NULL
)
bs4UserDescription(
title,
subtitle = NULL,
image,
backgroundImage = NULL,
type = c(1, 2),
imageElevation = NULL
)
userBox(
...,
title = NULL,
footer = NULL,
status = NULL,
background = NULL,
width = 6,
height = NULL,
collapsible = TRUE,
collapsed = FALSE,
closable = FALSE,
maximizable = FALSE,
gradient = FALSE,
boxToolSize = "sm",
elevation = NULL,
headerBorder = TRUE,
label = NULL,
dropdownMenu = NULL,
sidebar = NULL,
id = NULL
)
userDescription(
title,
subtitle = NULL,
image,
backgroundImage = NULL,
type = c(1, 2),
imageElevation = NULL
)
... |
Contents of the box. |
title |
User card title. |
footer |
Optional footer text. |
status |
The status of the item. This determines the item's background color. Valid statuses are defined as follows:
|
background |
If NULL (the default), the background of the box will be white. Otherwise, a color string. Valid colors are listed in validColors. See below:
|
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 card width of 6 occupies 1/2 of that width. For column-based
layouts, use |
height |
The height of a box, in pixels or other CSS unit. By default the height scales automatically with the content. |
collapsible |
If TRUE, display a button in the upper right that allows the user to collapse the box. |
collapsed |
If TRUE, start collapsed. This must be used with
|
closable |
If TRUE, display a button in the upper right that allows the user to close the box. |
maximizable |
If TRUE, the card can be displayed in full screen mode. |
gradient |
Whether to allow gradient effect for the background color. Default to FALSE. |
boxToolSize |
Size of the toolbox: choose among "xs", "sm", "md", "lg". |
elevation |
Card elevation. |
headerBorder |
Whether to display a border between the header and body. TRUE by default |
label |
Slot for boxLabel. |
dropdownMenu |
List of items in the boxtool dropdown menu. Use boxDropdown. |
sidebar |
Slot for boxSidebar. |
id |
Card id. |
subtitle |
User card subtitle. |
image |
User image url or path. |
backgroundImage |
image url, if any. Background needs to be TRUE. |
type |
User card type. Either 1 or 2. 1 corresponds to a centered user image, while 2 is a left aligned user image. |
imageElevation |
User card image elevation (numeric). NULL by default. |
David Granjon, dgranjon@ymail.com
Other cards:
bs4CardLayout()
,
bs4SocialCard()
,
bs4TabCard()
,
descriptionBlock()
,
renderbs4InfoBox()
,
renderbs4ValueBox()
if (interactive()) {
library(shiny)
library(bs4Dash)
shinyApp(
ui = dashboardPage(
header = dashboardHeader(),
sidebar = dashboardSidebar(),
controlbar = dashboardControlbar(),
footer = dashboardFooter(),
title = "test",
body = dashboardBody(
userBox(
title = userDescription(
title = "Nadia Carmichael",
subtitle = "lead Developer",
type = 2,
image = "https://adminlte.io/themes/AdminLTE/dist/img/user7-128x128.jpg",
),
status = "primary",
gradient = TRUE,
background = "primary",
boxToolSize = "xl",
"Some text here!",
footer = "The footer here!"
),
userBox(
title = userDescription(
title = "Alexander Pierce",
subtitle = "Founder & CEO",
type = 1,
image = "https://adminlte.io/themes/AdminLTE/dist/img/user1-128x128.jpg",
),
status = "indigo",
closable = TRUE,
"Some text here!",
footer = "The footer here!"
),
userBox(
title = userDescription(
title = "Elizabeth Pierce",
subtitle = "Web Designer",
image = "https://adminlte.io/themes/AdminLTE/dist/img/user3-128x128.jpg",
backgroundImage = "https://cdn.statically.io/img/wallpaperaccess.com/full/1119564.jpg",
),
status = "olive",
closable = TRUE,
maximizable = TRUE,
"Some text here!",
footer = "The footer here!"
)
)
),
server = function(input, output) {}
)
}
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.