Resizable bslib Cards
This is a simple example of resizing {bslib} cards for a dashboard. A card can be made resizable (vertical, horizontal or both) by using the resize property. In order to use this in a {bslib} dashboard it can be added using tags$style or included in bs_theme(). Adding the resize-vertical class adds a resize anchor to the botton right of a card.
1library(bslib)
2
3ui <- page_fillable(
4 tags$head(
5 tags$style("
6 .resize-vertical {
7 resize: vertical;
8 }
9 ")
10 ),
11 layout_sidebar(
12 sidebar = sidebar(
13 width = 250,
14 h3("controls")
15 ),
16 card(
17 card_title("Card 1"),
18 height = "60%",
19 fill = FALSE,
20 class = 'resize-vertical',
21 card_body(
22 plotOutput('plt')
23 )
24 ),
25 layout_column_wrap(
26 card(
27 card_title("Card 2"),
28 card_body(
29 )
30 ),
31 card(
32 card_title("Card 3"),
33 card_body()
34 )
35 )
36 )
37)
38
39server <- function(input, output, session) {
40 output$plt <- renderPlot({
41 plot(mtcars$mpg, mtcars$hp)
42 })
43 output$data <- renderDataTable(mtcars)
44}
45
46shinyApp(ui, server)
