css - R Shiny - 两个导航栏页面，每一个都有自定义和标准颜色

Question

我正在尝试在我的 Shiny 应用程序上有两个甚至更多“navbarPage”。第一个需要着色，第二个需要有默认样式。我尝试在 navbarPage 中传递类条件，但它不接受它。如果我向其中添加 .css，所有 navbarPage 都会获得该样式。这里我有一个最小的可重现示例

library(shiny)
ui <- fluidPage(
  div(class = "navbar1",
      navbarPage(title="Navbar One",theme="custom-navbar.css",
                                    navbarMenu("Nav 1.1",
                                               tabPanel("Item 1"),
                                               tabPanel("Item 2")),
                                    navbarMenu("Nav 1.2")
                                    )#close nav1
      ), #close div

  navbarPage(title="Navbar Two",
             navbarMenu("Nav 2.1",
                        tabPanel("Item 3"),
                        tabPanel("Item 4")),
             navbarMenu("Nav 2.2",
                        tabPanel("Item 5"),
                        tabPanel("Item 6")),
             navbarMenu("Nav 2.3")
             ), #close nav2

  titlePanel("It is a title panel"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins",
                  "sidebar panel",
                  min = 1,
                  max = 50,
                  value = 30)
    ),
    mainPanel(
      p("it is a mainpanel")
    )
  )
)

server <- function(input, output) {}
shinyApp(ui = ui, server = server)

.css 文件

.navbar{ background-color: #00b8bd;}

.navbar-default .navbar-brand{color: white;}

.tab-panel{ background-color: #00b8bd; color: #00b8bd}

.navbar-nav li a:hover, .navbar-nav > .active > a {
color: #fff !important;
background-color:#00b8bd !important;
background-image: #fff !important;
}

提前致谢!

Answer 1

我已将类 navbar1 放在您的第一个导航栏周围，并更新了 .css 文件以查看此内容，这一切都正常。

R

library(shiny)
ui <- fluidPage(
  div(class = "navbar1", navbarPage(title="Navbar One",theme="custom-navbar.css")), #custom colors
  navbarPage(title="Navbar Two"), #default colors
  titlePanel("It is a title panel"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins",
                  "sidebar panel",
                  min = 1,
                  max = 50,
                  value = 30)
    ),
    mainPanel(
      p("it is a mainpanel")
    )
  )
)

server <- function(input, output) {}
shinyApp(ui = ui, server = server)

.css

.navbar1 .navbar{ background-color: #00b8bd;}

.navbar1 .navbar-default .navbar-brand{color: white;}

.navbar1 .tab-panel{ background-color: #00b8bd; color: #00b8bd}

.navbar1 .navbar-nav li a:hover, .navbar1 .navbar-nav > .active > a {
color: #fff !important;
background-color:#00b8bd !important;
background-image: #fff !important;
}