【发布时间】:2022-01-04 13:22:41
【问题描述】:
我正在开发一个闪亮的网络应用程序。我的 UI 代码(附在下面)包含菜单侧边栏的 CSS 设计的某些参数。我试图摆脱这个显示侧边菜单何时展开或不展开的黑/白条,因为它占用了我需要的一些空间。请看文末图片
library(shinydashboard)
library(shiny)
library(shinyWidgets)
library(shinyBS)
library(shinymanager)
library(shinythemes)
library(shinyjs)
library(shinyBS)
version='v1.4.1'
set_labels(
language = "es",
"Please authenticate" = "Consulta de esquemas de vacunación",
"Username:" = "Usuario:",
"Password:" = "Contraseña:"
)
ui <- secure_app(
head_auth = tags$script(inactivity),
theme = shinythemes::shinytheme("cerulean"),
enable_admin = T,
tags_top = tags$img(
src = "logo-s.png", width = 130),
language = "es",
fab_position = "bottom-right",
fluidPage(
dashboardPage(
dashboardHeader(
title = HTML("Consulta de esquemas de vacunacion"),
titleWidth = 300,
tags$li(a(href = '.',
img(src = 'logo-s.png',
title = "Reiniciar app", height = "80px"),
style = "padding-top:10px; padding-bottom:10px;"),
class = "dropdown"),
tags$li(class = "dropdown",
tags$style(".main-header {max-height: 80px; }"),
tags$style(".main-header .logo {height: 100px;}"),
tags$style(".sidebar-toggle {height: 80px; padding-top: 40px !important;}"),
tags$style(".navbar {min-height:80px !important}")
)
),
dashboardSidebar(
width = 225,
# Adjust the sidebar
tags$style(".left-side, .main-sidebar {top: auto; padding-top: 80px}"),
tags$head(tags$link(rel="shortcut icon", href="favicon.png")),
sidebarMenu(
tags$script(HTML("$('body').addClass('fixed');")),
tags$style(HTML('
/* logo */
.skin-blue .main-header .logo {
background-color: #173a82;
}
/* logo when hovered */
.skin-blue .main-header .logo:hover {
background-color: #173a82;
}
/* navbar (rest of the header) */
.skin-blue .main-header .navbar {
background-color: #173a82;
}
/* main sidebar */
.skin-blue .main-sidebar {
background-color: #173a82;
}
/* active selected tab in the sidebarmenu */
.skin-blue .main-sidebar .sidebar .sidebar-menu .active a{
background-color: #688ff6;
}
/* other links in the sidebarmenu */
.skin-blue .main-sidebar .sidebar .sidebar-menu a{
background-color: #173a82;
color: #000000;
}
/* other links in the sidebarmenu when hovered */
.skin-blue .main-sidebar .sidebar .sidebar-menu a:hover{
background-color: #5d705d;
}
/* toggle button when hovered */
.skin-blue .main-header .navbar .sidebar-toggle:hover{
background-color: #5d705d;
}
')),
hr(style = "border-top: 1px solid #46575e;"),
div(id="container6", style = "color :#FFFFFF; ", h4('Consultas ')),
menuItem("COVID-19 + Vacunacion infantil", tabName = "principal1", icon = icon("syringe")),
hr(style = "border-top: 1px solid #46575e;"),
div(id="container5", style = "position: absolute; bottom: 0; color :#b8c7ce; ",
h6(paste(version)),
))
),
dashboardBody(
br(),
tabItems(
tabItem(tabName = "principal1",
br(),
fluidRow(
column(2,
textInput(inputId = "documento1", "Ingrese el numero de documento", "")
),
column(2,
br(),
fluidRow(
actionButton("consulta_gobutton1",
label = "Procesar",
icon = icon("clipboard-check") ) #,
))
),
fluidRow(
hr(style = "border-top: 1px solid #b8c2cf;")),
fluidRow(
column(4,
h3("Datos del usuario"),
htmlOutput("text2")
)),
fluidRow(
column(12,
h3("Esquema de vacunación "),
DT::dataTableOutput("table1")
))),
)
)
))
【问题讨论】: