Hide navbar title

user_8562539 0
Viewed 1425

I am working on a Shiny app with a navbarPage with plenty of tabPanels. Here is a minimal example:

ui <- navbarPage(
  'example', collapsible=TRUE,
  tabPanel("panel 01", 'some text'), tabPanel("panel 02"), tabPanel("panel 03"), 
  tabPanel("panel 04"), tabPanel("panel 05"), tabPanel("panel 06"), 
  tabPanel("panel 07"), tabPanel("panel 08"), tabPanel("panel 09"), 
  tabPanel("panel 10"), tabPanel("panel 11"), tabPanel("panel 12")
)
server <- function(input, output){}  
shinyApp(ui=ui, server=server)

Now, if the screen is wide enough, the tabs align nicely with the title, looking like this: 01

However, in a smaller window, the panels do not fit in one row anymore, resulting in this: 02

The panel headers are moved to a row below the title, basically wasting a lot of space in the title row. This is especially annoying since I have the title set to "" or NULL, resulting in an empty row: 03

Is there a way to remove/hide this empty row? I have tried messing around with style tags, but nothing came even close to fixing this problem.

navbar shiny r css
1 Answers

You can hide the navbar-brand with .css by setting {display:none}. For this you need to adapt your UI a bit. Because you are using navbarPage you need to add the tagList function. If you don't wrap it in a taglist shiny will think that you want to create a new tabPanel and a ghost tab will appear. More info here.

A working example:

ui <- shinyUI(
  tagList(tags$head(tags$style(type = 'text/css','.navbar-brand{display:none;}')),
          navbarPage(
            '', collapsible=TRUE,
            tabPanel("panel 01", 'some text'), tabPanel("panel 02"), tabPanel("panel 03"), 
            tabPanel("panel 04"), tabPanel("panel 05"), tabPanel("panel 06"), 
            tabPanel("panel 07"), tabPanel("panel 08"), tabPanel("panel 09"), 
            tabPanel("panel 10"), tabPanel("panel 11"), tabPanel("panel 12")
          )))

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