I used textAreaInput()
in dashboardHeader
to allow multiple lines in the header. But the background color of this text area is white and can't blend into the title panel there. I want to change the background color of this text area to either transparent or the same color as used in the dashboardHeader
. I've tried something like below. But it does not work. Any suggestions? Thank you!
library(shiny)
library(shinydashboard)
shinyApp(server = function(input, output) {}, ui =
dashboardPage(skin = "blue",
dashboardHeader(
title = textAreaInput(inputId = 'header',label = NULL,
width = 250, height = 100,
value = "This is a very very very very very loooooong title"
),
titleWidth = 260
),
dashboardSidebar(
width = 260,
sidebarMenu(
menuItem("About", tabName = "about", icon = icon("circle")),
menuItem("References", tabName = "ref", icon = icon("book"))
)
),
dashboardBody(
tags$head(tags$style(HTML('
.textArea {
background-color: #0000ff;
border: none;
}
'))),
tabItems(
tabItem(tabName = 'about'),
tabItem(tabName = 'ref')
)
)
))
Hi you have two choises
first one if you want to change the backgrondcolor for every textArea. I need to remove the dot before textArea because it is a tag not a class the dots before tells the identifier to look for a class. then you need to add !important after the color like this.
tags$head(tags$style(HTML('
textArea {
background-color: #0000ff !important;
border: none;
}')))
the second is if you only want to change the background color for this specific textArea is better to use the id #header
and in this case you don't need the !important
tags$head(tags$style(HTML('
#header{
background-color: #0000ff !important;
border: none;
}')))
Hope this helps!