如何在闪亮的仪表板中更改颜色?

时间:2015-07-29 21:17:45

标签: r shiny shinydashboard

(来自闪亮的谷歌团体的交叉帖子)

有人可以指出我必须修改闪亮仪表板颜色的标签名称吗?

http://rstudio.github.io/shinydashboard/appearance.html#long-titles修改 这会将我的信息中心的左上角更改为橙色

tags$head(tags$style(HTML('
        .skin-blue .main-header .logo {
                              background-color: #f4b943;
                              }
                              .skin-blue .main-header .logo:hover {
                              background-color: #f4b943;
                              }
                              ')))

我不清楚如何将标题和侧边栏的其余部分更改为橙色,以及当选择/突出显示“SideBarMenu”上的项目时如何更改颜色。

4 个答案:

答案 0 :(得分:49)

根据您发布链接的示例,您可以尝试:

<强> ui.R

Generate ssh key pair using the instructions given above
copy the ssh url from github repo
git clone url

我评论了CSS,指出它修改了什么。

答案 1 :(得分:3)

感谢您的发帖。我认为你应该添加“悬停时的切换按钮”以使其完整。示例代码如下:

/* toggle button when hovered  */                    
.skin-blue .main-header .navbar .sidebar-toggle:hover{
  background-color: #ff69b4;
}

答案 2 :(得分:0)

谢谢@NicE的回答。补充:如果有人想控制侧边栏菜单选择的左边框的颜色强调,则border-left属性起作用:

            /* active selected tab in the sidebarmenu */
            .skin-blue .main-sidebar .sidebar .sidebar-menu .active a{
                                  background-color: #2e6984;
                                  border-left: 3px solid #254264;
                                  }

            /* other links in the sidebarmenu */
            .skin-blue .main-sidebar .sidebar .sidebar-menu a{
                                  background-color: #3E8CB0;
                                  color: #FFFFFF;
                                  }

            /* other links in the sidebarmenu when hovered */
             .skin-blue .main-sidebar .sidebar .sidebar-menu a:hover{
                                  background-color: #2e6984;
                                  border-left: 3px solid #254264;
                                  }

答案 3 :(得分:0)

也许这个包可以帮助你进一步:

https://github.com/dreamRs/fresh

它允许很好地设置自定义主题和颜色,而无需自己处理 CSS 定义 - 但可以创建它们以供重复使用。

可以在此处找到更多信息(非常详细的书,包含更多主题!):https://unleash-shiny.rinterface.com/beautify-with-fresh.html