Hi Everyone,
I am trying to customize the navbar of a shiny app but I cannot find the appropriate CSS that will enable me to change the background color of a tabPanel when it is active or when i hover-over it.
Below is the code I use

``library(shiny)
library(shinydashboard)
ui <- function(){
navbarPage(title = 'Hello',
tabPanel("title2"),
tabPanel("title3"),
tags$style(type = 'text/css',
'.navbar { background-color: red;}',
'.navbar-default .navbar-brand{color: white;}',
'.tab-panel{ background-color: red; color: white}',
'.nav navbar-nav li.active:hover a, .nav navbar-nav li.active a {
background-color: green ;
border-color: green;
}'
))
}
server <- function(input, output, session){
}
shinyApp(ui = ui, server = server)
Thanks in advance.
Hi there,
In your CSS, try adding;
.navbar-nav li a:hover, .navbar-nav > .active > a {
color: #fff !important;
background-color:#2b8cc4 !important;
background-image: none !important;
}
Hopefully that works!
Most helpful comment
Hi there,
In your CSS, try adding;
.navbar-nav li a:hover, .navbar-nav > .active > a {
color: #fff !important;
background-color:#2b8cc4 !important;
background-image: none !important;
}
Hopefully that works!