0

我设法在闪亮的仪表板标题中放置了一个操作按钮。但是，当使用 应用样式时tags$li，它仅适用于侧边栏。删除该tags$a部分时，样式将应用于整个标题。不知道如何修复它，因此整个标题的样式是一致的 - 希望在堆栈溢出中获得一些提示/方向。

我看过这些帖子：

  1. R闪亮仪表板中标题中的主页按钮
  2. Shinydashboard仪表板中的登录按钮标题

这个问题是我上一个问题的扩展：调整操作按钮的大小会导致闪亮仪表板中的标题错位

这是一个代表（下图）：

library(shiny)
library(shinydashboard)
library(htmltools)
library(shinyjs)
ui <- dashboardPage(
  dashboardHeader(
    
    tags$li(class = "dropdown",
                    tags$a(actionButton(inputId = "email1", label = "",
                                        icon = icon("envelope", lib = "font-awesome")
                                        
                                        #Also tried to adjust the width and height of transparent, no luck 
                                        # ,
                                        # style='height: 20px;
                                        #       background: transparent;
                                        #       border: none;
                                        #       font-size: 2rem;
                                        #       transform: translate(5%, -30%);'

                    ),
                    href="mailto:have_a_nice_day@yep.com;"),
                    
                    # has no effect on the main header bar (the header in which button is placed)
                    tags$style(".main-header {max-height: 20px}"),
                    tags$style(".main-header .logo {height: 20px;}"),
                    tags$style(".sidebar-toggle {height: 20px; padding-top: 1px !important;}"),
                    tags$style(".navbar {min-height:20px !important}")
            )
  ),
  dashboardSidebar(
  ),
  dashboardBody()
)

server <- function(input, output){}

shinyApp(ui, server)

非常感谢您的帮助！

在此处输入图像描述

4

2 回答 2

1

这是因为按钮和a标签的填充。你可以做：

        tags$a(actionButton(inputId = "email1", label = "",
                            icon = icon("envelope", lib = "font-awesome"),
                            style = "padding-top: 0; padding-bottom: 0;"),
        href="mailto:have_a_nice_day@yep.com;", 
        style = "padding-top: 0; padding-bottom: 0;")

如果您不使用操作按钮，最好这样做：

library(fontawesome)

和

tags$li(class = "dropdown",
        tags$a(fa("envelope"),
        href="mailto:have_a_nice_day@yep.com;", 
        style = "padding-top: 0; padding-bottom: 0;"),
于 2021-08-29T11:25:47.270 回答
1

如果标题中没有电子邮件图标，您的代码可以正常工作。尝试这个

library(shiny)
library(shinydashboard)
ui <- dashboardPage(
  dashboardHeader(
    
    # tags$li(class = "dropdown",
    #         tags$a(actionButton(inputId = "email1", label = "",
    #                             icon = icon("envelope", lib = "font-awesome")
    # 
    #                             #Also tried to adjust the width and height of transparent, no luck
    #                             # ,
    #                             # style='height: 20px;
    #                             #       background: transparent;
    #                             #       border: none;
    #                             #       font-size: 2rem;
    #                             #       transform: translate(5%, -30%);'
    # 
    #         ),
    #         href="mailto:have_a_nice_day@yep.com;"),
    # ),
    tags$li(class = "dropdown",
            # has effect on the main header bar
            tags$style(".main-header {max-height: 20px !important;}"),
            tags$style(".main-header .logo {height: 20px !important;}"),
            tags$style(".sidebar-toggle {height: 20px; padding-top: 1px !important;}"),
            tags$style(".navbar {min-height:20px !important}")
    )
    
  ),
  dashboardSidebar(
    # Adjust the sidebar
    tags$style(".left-side, .main-sidebar {padding-top: 20px}")
  ),
  dashboardBody()
)

server <- function(input, output){}

shinyApp(ui, server)

输出

于 2021-08-28T13:37:36.090 回答