Create boxes around a list of shiny.tags
box_list.Rd
Create boxes around a list of shiny.tags
Arguments
- x
list
of shiny.tags to box- ...
Arguments passed on to
ui_row
box
lgl
Whether to box the contents or just put them in row. Default TRUErow
lgl
Whether to wrap the output in a row. Default TRUEclass
chr
A class to add to the top level div.rowadd_attribs
list
of attributes to append to arbitrary tags in the formatlist([jQuery selector] = list([attribute] = [value]))
title
Optional title.
footer
Optional footer text.
status
The status of the item. This determines the item's background color. Valid statuses are defined as follows:
primary
: #007bff .secondary
: #6c757d .info
: #17a2b8 .success
: #28a745 .warning
: #ffc107 .danger
: #dc3545 .gray-dark
: #343a40 .gray
: #adb5bd .white
: #fff .indigo
: #6610f2 .lightblue
: #3c8dbc .navy
: #001f3f .purple
: #605ca8 .fuchsia
: #f012be .pink
: #e83e8c .maroon
: #d81b60 .orange
: #ff851b .lime
: #01ff70 .teal
: #39cccc .olive
: #3d9970 .
solidHeader
Should the header be shown with a solid color background?
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:
primary
: #007bff .secondary
: #6c757d .info
: #17a2b8 .success
: #28a745 .warning
: #ffc107 .danger
: #dc3545 .gray-dark
: #343a40 .gray
: #adb5bd .white
: #fff .indigo
: #6610f2 .lightblue
: #3c8dbc .navy
: #001f3f .purple
: #605ca8 .fuchsia
: #f012be .pink
: #e83e8c .maroon
: #d81b60 .orange
: #ff851b .lime
: #01ff70 .teal
: #39cccc .olive
: #3d9970 .
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
NULL
for the width; the width is set by the column that contains the box.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
collapsible=TRUE
.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.
icon
Header icon. Displayed before title. Expect
icon
.tip_icon
Tip icon. Tooltip Icon displayed after title. Expect
tippy
.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.
Value
shiny.tag.list
with box's around them.
See also
Other ui:
acc_list()
,
add_sass()
,
bs4Alert()
,
bs_extract_status()
,
bs_statuses
,
col_10()
,
col_11()
,
col_12()
,
col_1()
,
col_2()
,
col_3()
,
col_4()
,
col_5()
,
col_6()
,
col_7()
,
col_8()
,
col_9()
,
col_auto()
,
copyright()
,
css_props()
,
dynamic_row()
,
enurl()
,
fa_arrow_icon()
,
icon_sb()
,
infoIcon()
,
jq_hide()
,
list_to_li()
,
list_to_p()
,
make_action_button()
,
make_columns()
,
rep_br()
,
tagRemoveAttributes()
,
ui_row()
,
ui_tabs()
,
undisplay()
,
with_red_star()
Examples
box_list(purrr::map(c("Lorem", "Ipsum"), htmltools::HTML))
#> <div class="row ui_row">
#> <div class="col-sm-12">
#> <div class="card bs4Dash ">
#> <div class="card-header">
#> <h3 class="card-title">1</h3>
#> <div class="card-tools float-right">
#> <button class="btn btn-tool btn-sm" type="button" data-card-widget="collapse">
#> <i class="fas fa-minus" role="presentation" aria-label="minus icon"></i>
#> </button>
#> </div>
#> </div>
#> <div class="card-body">
#> Lorem
#> Lorem
#> 1
#> </div>
#> </div>
#> <script type="application/json">{"title":"1","solidHeader":true,"width":12,"collapsible":true,"closable":false,"maximizable":false,"gradient":false}</script>
#> </div>
#> </div>
#> <div class="row ui_row">
#> <div class="col-sm-12">
#> <div class="card bs4Dash ">
#> <div class="card-header">
#> <h3 class="card-title">2</h3>
#> <div class="card-tools float-right">
#> <button class="btn btn-tool btn-sm" type="button" data-card-widget="collapse">
#> <i class="fas fa-minus" role="presentation" aria-label="minus icon"></i>
#> </button>
#> </div>
#> </div>
#> <div class="card-body">
#> Ipsum
#> Ipsum
#> 2
#> </div>
#> </div>
#> <script type="application/json">{"title":"2","solidHeader":true,"width":12,"collapsible":true,"closable":false,"maximizable":false,"gradient":false}</script>
#> </div>
#> </div>