CODEWITHSUNDEEP
rshinyshinydashboard
firmo23
firmo23

Reputation: 8404

Make image used as title of shinydashboard fits exactly in the title box

I have put an image as title of my shiny dashboard and I have adjusted its size in order to fit in height and width but there is a small section in the left side which remains empty. How can I make it fit exactly in the box? (The blue part of the attached image remains empty)

enter image description here

# app.R ##
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(DT)
library(shinyWidgets)
library(shinyjs)

dbHeader <- dashboardHeaderPlus(
  enable_rightsidebar = TRUE,
  rightSidebarIcon = "gears",
  fixed = T,
  title = tags$a(href='http://mycompanyishere.com',
                                 tags$img(src='logo.png',height = "55px",width="232px"))
)

ui <- dashboardPagePlus(
  dbHeader,
  dashboardSidebar(),
  dashboardBody(
    useShinyjs(),
    tags$hr(),
    tabsetPanel(
      id ="tabA",
      type = "tabs",
      tabPanel("Front",icon = icon("accusoft")),
      tabPanel("Data", icon = icon("table")
      )
    )
  ),
  rightsidebar = rightSidebar()
)

server <- function(input, output) {

}

shinyApp(ui = ui, server = server)

Upvotes: 0

Views: 331

Answers (1)

Miha
Miha

Reputation: 2874

In order to do this, you need to modify dashboard CSS (i.e. padding). One way would be to insert 

 tags$head(tags$style(".skin-blue .main-header .logo { padding: 0px;}")),

inside dashboardBody()

Then the output looks like this (I don't have your logo but from an image below, you can see that blue part is gone).

enter image description here

For more on how to style apps in Shiny see here: https://shiny.rstudio.com/articles/css.html

Upvotes: 1

Related Questions