У меня есть блестящее приложение с tabBox, как показано ниже:
library(shiny)
library(shinydashboard)
body <- dashboardBody(
fluidRow(tags$style(".nav-tabs {
background-color: #006747;
}
.nav-tabs-custom .nav-tabs li.active:hover a, .nav-tabs-custom .nav-tabs li.active a {
background-color: transparent;
border-color: transparent;
}
.nav-tabs-custom .nav-tabs li.active {
border-top-color: #990d5e;
}
.content-wrapper {
background-color: #FFF;
}"),
tabBox(
title = "First tabBox",
# The id lets us use input$tabset1 on the server to find the current tab
id = "tabset1", height = "250px",
tabPanel("Tab1", "First tab content"),
tabPanel("Tab2", "Tab content 2")
)
))
shinyApp(
ui = dashboardPage(
dashboardHeader(title = "tabBoxes"),
dashboardSidebar(),
body
),
server = function(input, output) {
}
)
Я хотел бы скрыть/удалить серые линии границ tabBox
со всех сторон, как показано стрелками на картинке.
Может ли кто-нибудь помочь, какой класс CSS должен использоваться для внесения этого изменения?
Вы можете установить box-shadow: none;
для класса .nav-tabs-custom
:
library(shiny)
library(shinydashboard)
body <- dashboardBody(
fluidRow(tags$style(".nav-tabs {
background-color: #006747;
}
.nav-tabs-custom .nav-tabs li.active:hover a, .nav-tabs-custom .nav-tabs li.active a {
background-color: transparent;
border-color: transparent;
}
.nav-tabs-custom .nav-tabs li.active {
border-top-color: #990d5e;
}
.content-wrapper {
background-color: #FFF;
}
.nav-tabs-custom {
box-shadow: none;
}
"),
tabBox(
title = "First tabBox",
# The id lets us use input$tabset1 on the server to find the current tab
id = "tabset1", height = "250px",
tabPanel("Tab1", "First tab content"),
tabPanel("Tab2", "Tab content 2")
)
))
shinyApp(
ui = dashboardPage(
dashboardHeader(title = "tabBoxes"),
dashboardSidebar(),
body
),
server = function(input, output) {}
)
код добавлен.