timelineBlock creates a timeline block that may be inserted in a box or outside.
timelineLabel creates a timeline label element to highlight an event.
timelineItem creates a timeline item that contains information for a given event like the title, description, date, ...
timelineItemMedia create a specific container for images.
timelineStart indicates a starting point.
timelineEnd indicates an end point.
bs4Timeline(..., reversed = TRUE, width = 6)
bs4TimelineLabel(..., color = NULL)
bs4TimelineItem(
...,
icon = NULL,
color = NULL,
time = NULL,
title = NULL,
border = TRUE,
footer = NULL,
elevation = NULL
)
bs4TimelineItemMedia(image = NULL, height = NULL, width = NULL)
bs4TimelineStart(icon = shiny::icon("clock"), color = NULL)
bs4TimelineEnd(icon = shiny::icon("hourglass-end"), color = NULL)
timelineBlock(..., reversed = TRUE, width = 6)
timelineLabel(..., color = NULL)
timelineItem(
...,
icon = NULL,
color = NULL,
time = NULL,
title = NULL,
border = TRUE,
footer = NULL,
elevation = NULL
)
timelineItemMedia(image = NULL, height = NULL, width = NULL)
timelineStart(icon = shiny::icon("clock"), color = NULL)
timelineEnd(icon = shiny::icon("hourglass-end"), color = NULL)
Any element such as timelineItemMedia ...
Whether the timeline is reversed or not.
Media width in pixels.
Item color. Valid colors 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
.
Item icon such as "clock", "times", ...
Item date or time.
Item title.
Whether to display a border between the header and the body. TRUE by default.
Item footer if any.
Timeline elevation (numeric). NULL by default.
Media url or path.
Media height in pixels.
reversed is useful when the user wants to use the timeline inside a box.
Other boxWidgets:
attachmentBlock()
,
bs4CardLabel()
,
bs4CardSidebar()
,
bs4Carousel()
,
bs4SocialCard()
,
cardDropdown()
,
cardProfile()
,
descriptionBlock()
,
userPost()
if(interactive()){
library(shiny)
library(bs4Dash)
shinyApp(
ui = bs4DashPage(
header = dashboardHeader(),
sidebar = dashboardSidebar(),
controlbar = dashboardControlbar(),
footer = dashboardFooter(),
title = "test",
body = dashboardBody(
box(
title = "Timeline",
timelineBlock(
width = 12,
reversed = TRUE,
timelineEnd(color = "danger"),
timelineLabel("10 Feb. 2014", color = "pink"),
timelineItem(
elevation = 4,
title = "Item 1",
icon = icon("gears"),
color = "olive",
time = "now",
footer = "Here is the footer",
"This is the body"
),
timelineItem(
title = "Item 2",
border = FALSE
),
timelineLabel("3 Jan. 2014", color = "lightblue"),
timelineItem(
elevation = 2,
title = "Item 3",
icon = icon("paint-brush"),
status = "orange",
timelineItemMedia(image = "https://via.placeholder.com/150x100"),
timelineItemMedia(image = "https://via.placeholder.com/150x100")
),
timelineStart(color = "secondary")
)
)
)
),
server = function(input, output) {}
)
}