时间戳

首页 > 解决方案 > 如何为整个导航栏页面着色

shiny - 如何为整个导航栏页面着色

问题描述

以下代码几乎完全符合我的要求：

ui <- fluidPage(

  tags$style(HTML(".navbar{background-color: #690a20;}")),

  navbarPage(
    title='Navbar',

    tabPanel(
      title = "start page",

      fillPage(
        fluidRow(style = "background-color: #690a20;color: white;",
                 br(),
                 br(),
                 headerPanel(h1("WELCOME", align='center')),
                 h4("Thank you for participating",
                    align='center'),
                 br(),
                 br(),
                 br())
   ))))

server <- shinyServer(function(input, output, session) {})

shinyApp(ui = ui, server = server)

但我想摆脱导航栏和流体页面之间的白条。有没有人有这样做的想法？我通过隐藏导航栏进行了尝试，但这仍然留下了一个小条。

标签： shinynavbarbackground-color

解决方案

我能够想出一个解决我的问题的方法：

library(shiny)
library(shinyjs)


ui <- fluidPage(

  useShinyjs(),
  tags$style(type='text/css', "nav.navbar.navbar-default.navbar-static-top{border-color: #f5f5f5;background-color: #f5f5f5;}"),
  tags$style(type='text/css', ".navbar{min-height: 0px; margin-bottom: 0px;}"),
  tags$style(type='text/css', ".navbar-brand{height: 0px; padding: 0px 0px;}"),


  tags$style(HTML(".navbar{background-color: #690a20;}")),

  navbarPage(
    title=NULL, id="navigation-bar",

    tabPanel(
      title = "start page",

      fillPage(
        fluidRow(style = "background-color: #690a20;color: white;",
                 br(),
                 br(),
                 headerPanel(h1("WELCOME", align='center')),
                 h4("Thank you for participating",
                    align='center'),
                 br(),
                 br(),
                 br())
      ))))

server <- shinyServer(function(input, output, session) {

  observe(
    {
      hide(selector = "#navigation-bar")
    })
})


shinyApp(ui = ui, server = server)

推荐阅读