Integration of shiny dashboard elements into a classical shiny navbarPage()

[msquatrito]

Hi, 

I have tried (naively!!) to add a shiny dashboard box() in my app that uses a navbarPage() layout and not a dashboardPage().

The issue that I'm facing is that it is not showing as I expected. The title of the box instead of appearing in a color background (e.g. status = "warming"), it appears on a white background.

When I inspect the element with the web browser, it look looks that the right class is assigned:

<div class="box box-solid box-warning">

So, is it possible to use shiny dashboard elements outside a dashboardPage()?

Here is a minimal reproducible example:

using fluidPage():

server <- function(input, output) {

  output$distPlot <- renderPlot({

    hist(rnorm(input$obs), col = 'darkgray', border = 'white')

  })

}

ui <- fluidPage(

  sidebarLayout(

    sidebarPanel(

      sliderInput("obs", "Number of observations:", min = 10, max = 500, value = 100)

    ),

    mainPanel(

      box(title = "Histogram",status = "warning", solidHeader = TRUE,

      plotOutput("distPlot")

      ))

  )

)
shinyApp(ui = ui, server = server)

using dashboardPage():

server <- function(input, output) {
  output$distPlot <- renderPlot({
    hist(rnorm(input$obs), col = 'darkgray', border = 'white')
  })
}
ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(
    sliderInput("obs", "Number of observations:", min = 10, max = 500, value = 100)),
  dashboardBody(
    box(title = "Histogram",status = "warning", solidHeader = TRUE,
        plotOutput("distPlot")
    )
    )
  )
)
shinyApp(ui = ui, server = server)

Thanks in advance.

Massimo

[msquatrito]

I've found the solution.

I've just copied all the .box  CSS rules in the stile.css file that I use for my app. I guess that navbarPage() and dashboardPage() use different CSS rules.

m.