1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
% Generated by roxygen2: do not edit by hand
% Please edit documentation in R/card.R
\name{card}
\alias{card}
\title{A Bootstrap card component}
\usage{
card(
...,
full_screen = FALSE,
height = NULL,
class = NULL,
wrapper = card_body
)
}
\arguments{
\item{...}{Unnamed arguments can be any valid child of an \link[htmltools:builder]{htmltools tag} (which includes card items such as \code{\link[=card_body]{card_body()}}.
Named arguments become HTML attributes on returned UI element.}
\item{full_screen}{If \code{TRUE}, an icon will appear when hovering over the card
body. Clicking the icon expands the card to fit viewport size. Consider
pairing this feature with \code{\link[=card_body_fill]{card_body_fill()}} to get output that responds to
changes in the size of the card.}
\item{height}{Any valid \link[htmltools:validateCssUnit]{CSS unit} (e.g.,
\code{height="200px"}).}
\item{class}{Additional CSS classes for the returned UI element.}
\item{wrapper}{A function (which returns a UI element) to call on unnamed
arguments in \code{...} which are not already card item(s) (like
\code{\link[=card_header]{card_header()}}, \code{\link[=card_body]{card_body()}}, etc.). Note that non-card items are grouped
together into one \code{wrapper} call (e.g. given \code{card("a", "b", card_body("c"), "d")}, \code{wrapper} would be called twice, once with \code{"a"} and
\code{"b"} and once with \code{"d"}). Consider setting \code{wrapper} to \link{card_body_fill}
if the entire card wants responsive sizing or \code{NULL} to avoid wrapping
altogether}
}
\value{
A \code{\link[htmltools:builder]{htmltools::div()}} tag.
}
\description{
A general purpose container for grouping related UI elements together with a
border and optional padding. To learn more about \code{\link[=card]{card()}}s, see \href{https://rstudio.github.io/bslib/articles/cards.html}{this article}.
}
\examples{
library(htmltools)
if (interactive()) {
card(
full_screen = TRUE,
card_header(
"This is the header"
),
card_body(
p("This is the body."),
p("This is still the body.")
),
card_footer(
"This is the footer"
)
)
}
}
\seealso{
\code{\link[=card_body]{card_body()}} for putting stuff inside the card.
\code{\link[=navs_tab_card]{navs_tab_card()}} for cards with multiple tabs.
\code{\link[=layout_column_wrap]{layout_column_wrap()}} for laying out multiple cards (or multiple
columns inside a card).
}
|
