How can I change the background color of the shinydashboard sidebar?

4,242 views
Skip to first unread message

Dawg

unread,
Jun 24, 2015, 12:31:11 AM6/24/15
to shiny-...@googlegroups.com
Hello -
does anybody have a simple fix to change the shinydashboard sidebar background color to something other than black. Tried some other bootstrap css files, but all of them look pretty black.
Thanks,
D.

Winston Chang

unread,
Jun 24, 2015, 9:21:05 PM6/24/15
to Dawg, shiny-discuss
You can use some custom CSS. If you're using the blue skin (which is the default) you can do something like this:

library(shiny)
library(shinydashboard)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(
    sidebarMenu(
      menuItem("A"),
      menuItem("B")
    )
  ),
  dashboardBody(
    tags$head(tags$style(HTML('
      .skin-blue .main-sidebar {
        background-color: #666666;
      }
      .skin-blue .sidebar-menu>li.active>a, .skin-blue .sidebar-menu>li:hover>a {
        background-color: #444444;
      }
    ')))
  )
)

server <- function(input, output) {}

shinyApp(ui, server)


-Winston




--
You received this message because you are subscribed to the Google Groups "Shiny - Web Framework for R" group.
To unsubscribe from this group and stop receiving emails from it, send an email to shiny-discus...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/shiny-discuss/f700f198-d793-4c00-85c9-ea6467a48f02%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Dawg

unread,
Jun 25, 2015, 2:38:03 PM6/25/15
to shiny-...@googlegroups.com
Thanks a lot!
Reply all
Reply to author
Forward
0 new messages