Блестящая панель инструментов: липкий нижний колонтитул на боковой панели панели инструментов

Я пытаюсь создать Shiny Dashboard с нижним колонтитулом в dashboardSidebar, который прилипает к нижней части области просмотра. Для этого я пытаюсь использовать собственные стили CSS, как предложено здесь (один из многих поисковых результаты при поиске в Google «бутстрап нижнего колонтитула»):

# create an example for the SO question on sticky footer
library(shiny)
library(shinydashboard)

# sidebar
so_sidebar = dashboardSidebar(
  sidebarMenu(
    menuItem(
      text = "Some text."
    )
  ),
  # footer here
  tags$footer(
    tags$p("Footer message here."), 
    style = "
      * {
    margin: 0;
  }
  html, body {
    height: 100%;
  }
  .wrapper {
    min-height: 100%;
    height: auto !important; /* This line and the next line are not necessary unless you need IE6 support */
    height: 100%;
    margin: 0 auto -155px; /* the bottom margin is the negative value of the footer's height */
  }
  .footer, .push {
    height: 155px; /* .push must be the same height as .footer */
  }

  /*

  Sticky Footer by Ryan Fait
  http://ryanfait.com/

  */"
  )

)

# compose the dashboard
so_ui = dashboardPage(
  header = dashboardHeader(
    title = "SO question"
  ), 
  sidebar = so_sidebar, 
  body = dashboardBody()
)

# run the application
shiny::shinyApp(
  ui = so_ui, 
  server = shinyServer(function(input, output) {})
)

Поскольку я никогда раньше не работал с пользовательским CSS, я не уверен, что правильно использую CSS. Я следую инструкциям здесь.

Может ли кто-нибудь помочь с правильным CSS или с любыми другими предложениями по нижнему колонтитулу, который прилипает к нижней части видимой области на боковой панели Shiny Dashboard?


r css shiny shinydashboard
person tchakravarty    schedule 09.05.2016    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Попробуйте это

 <div>
    Sticky Footer
</div> 

div{
  position:fixed;
  bottom:0;
  right:0;
  left:0;
  background:#00adfc;
  padding:10px;
  box-sizing:border-box;
}

Фиксированное положение всегда остается в указанном положении и дает ощущение липкости.

person Santhosh Kumar    schedule 09.05.2016
comment
Спасибо за это. Однако это не относится к Shiny, и я не знаю, как это реализовать. Shiny — это платформа R для создания HTML-кода путем написания кода R. - person tchakravarty; 09.05.2016
comment
На самом деле, я получил это для работы с Shiny - я обновлю код Shiny в вопросе и отмечу это правильно. У меня есть еще один вопрос. Как я могу также получить изображение над этим текстом, которое также привязано к нижней части области просмотра? - person tchakravarty; 09.05.2016
comment
В стиле R вы можете добавить css в файл css в папке www/, создав класс css, например, .sticky_footer { position:fixed; bottom:0; right:0; left:0; background:#3c8dbc; z-index: 1000; opacity: 0.9; }. Затем вы можете добавить div в dashboardBody: div(class = "sticky_footer", p("test footer")) - person Thomas; 28.10.2019