7

如何为 tabItem 中的框更改闪亮仪表板中的字体系列？

我已经在dashboardBody中包含了一些css编码，改变了颜色和字体系列，但这仅与主标题相关联：

body <- dashboardBody(
 tags$head(tags$style(HTML('
  .skin-blue .main-header .logo {
    font-family: "Calibri";
    font-weight: bold;
    font-size: 28px;
    background-color: #003D76;
  }
  .skin-blue .main-header .navbar {
    background-color: #0082D1;
  }
  
'))),

非常感谢您的帮助。

tabItem 有以下开头：

tabItems(
tabItem(tabName = "dashboard",
        fluidRow(
          box(
            title = strong("GPIM Liquidity Risk"), status = "primary", solidHeader = TRUE, width = 8,
            img(src = "gpim-signet.png", height = 80, width = 130),
4

1 回答 1

6

您可以更改主侧边栏的 css，如下所示（我提供了一些选项以方便您）

可重现的示例如下（它是默认皮肤，所以如果你使用其他皮肤 - 你应该将skin-blue更改为其他东西）： 

    library(shiny)
library(shinydashboard)
## ui
    ui <- dashboardPage(
      dashboardHeader(title="MPG Data"),
      dashboardSidebar(
        sidebarMenu(
          menuItem("MPG",tabName="mpg")
        )
      ),
      dashboardBody(
        #here's where you throw the css into the header
        tags$head(
          includeCSS(path = "www/style.css")
        ),
        tabItems(
          tabItem(tabName="mpg",
                  fluidRow(tableOutput("mpgTable"))
          )
        )
      )
    )

    ## server
    server <- function(input, output) {
      output$mpgTable <- renderTable({mpg})
    }

    ## launch dashboard 
    shinyApp(ui, server)

css文件的内容如下

/* main sidebar */
        .skin-blue .main-sidebar {
                              background-color: #f4b943;
                              font-family: "Calibri";
                              font-size:25px;
                              line-height:1.42857143;
                              color:#ebebeb;
                              }

希望它会有所帮助！

于 2016-03-31T19:05:23.707 回答