How to add back dropshadow to card when choosing a theme?

[ocstringham]

I'm using bootswatch theme "lumen" but now my card() and nav_panel() do not have a dropshadow. Is there a way to add the dropshadow back in?

[gadenbuie]

Hi @ocstringham! You can give your cards the shadow class (or shadow-sm or shadow-lg):

library(shiny)
library(bslib)

ui <- page_navbar(
  title = "Issue 979",
  theme = bs_theme(preset = "lumen"),
  nav_panel(
    "One",
    card("First card", class = "shadow-sm"),
    card("Second card", class = "shadow"),
    card("Third card", class = "shadow-lg")
  )
)

server <- function(...) { }

shinyApp(ui, server)

[ocstringham]

Thank you, @gadenbuie. This worked for cards. At the same time, it did not work to give the nav_panel 'card' a shadow. Is there a special way to give nav_panel it's own shadow?

[cpsievert]

You currently have to do that via htmltools::tagAppendAttributes()

page_fixed(
    theme = bs_theme(bootswatch = "lumen"), 
    navset_card_underline(nav_panel("A", "a"), nav_panel("B", "b")) |>
        htmltools::tagAppendAttributes(class = "shadow")
)

[ocstringham]

Worked like a charm. Good to know about htmltools::tagAppendAttributes(), that is useful. Thanks!

[github-actions[bot]]

This issue has been automatically locked. If you have found a related problem, please open a new issue (with a reproducible example or feature request) and link to this issue. :raising_hand: Need help? Connect with us on Discord or Posit Community.