search

RinteRface / bs4Dash

Bootstrap 4 shinydashboard using AdminLTE3
https://bs4dash.rinterface.com
Other
440 stars 81 forks source link

Combine shiny::navbarPage layout with bs4Dash elements? #247

Open mbacou opened 3 years ago

mbacou commented 3 years ago

@DivadNojnarg I'd like to use bs4Dash elements (card, valueBox, timeline, etc..), but I need a more standard collapsible top navbar layout (similar to shiny::navbarPage), and I don't need bs4Dash sidebar and controlbar.

Is there a way to manually load bs4Dash CSS/JS dependencies? Or else can I tweak bs4Dash dashboard layout to include a (collapsible) top navbar?

Thx!

DivadNojnarg commented 3 years ago

You can use htmltools::findDependencies to extract bs4Dash deps like here: https://unleash-shiny.rinterface.com/htmltools-dependencies.html#htmldeps-import

mbacou commented 3 years ago

I've tried that route by adding adminLTE and bs4Dash deps to a shiny::navbarPage(bslib::bs_theme(version="4")), but I end up with a CSS soup (-: So I wouldn't recommend it.

Adding a simple (non-collapsible) top navbar to a bs4Dash page is easy enough (example below). I think the collapsible behavior will require extra work with custom JS/CSS. Any help welcome!

# Navbar ----
navbar <- dashboardHeader(
  rightUi = tags$li(class="navbar-collapse collapse dropdown",
    tags$ul(class="nav navbar-nav sidebar-menu",
      bs4SidebarMenuItem("Page 1", tabName="page-1", selected=TRUE),
      bs4SidebarMenuItem("Page 2", tabName="page-2"),
      bs4SidebarMenuItem("Page 3", tabName="page-3")
    )
  )
)
mbacou commented 3 years ago

In case others are interested, there's also the option to do without bs4Dash altogether and try to use widgets provided by other packages (summaryBox, timevis, shinyWidgets, etc.).