unexpected behavior when using highcharter and boxplus with footer

[andresk159]

Hello I am working with the r package "highcharter" to make one map, I am putting it inside a boxplus and adding the "footer" option to the boxplus, once I add this option to the dashboard it starts to show a dark zone at the bottom of the page behind the box.
here there is an image.

Here is a reproducible example

 install.packages("shiny"); library(shiny)
  install.packages("shinydashboardPlus");library(shinydashboardPlus)
  install.packages("highcharter"); library(highcharter)

  header <- dashboardHeaderPlus(
    title = tagList(
      span(class = "logo-lg", "dashboard"), 
      img(src = "https://image.flaticon.com/icons/svg/861/861083.svg"),
    )

  )

sidebar <- dashboardSidebar(
  sidebarMenu(id = "menu", 
              menuItem(" Home", tabName = "tab1", icon = icon("fars fa-home"), selected = T))

)

body <- dashboardBody(

  tabItems(
    tabItem(tabName = "tab1",
            infoBox("New Orders", 10 * 2, icon = icon("credit-card")),
            boxPlus(solidHeader = FALSE, title = "Status summary", background = NULL,
                    width = 12, status = "danger", collapsible = T, closable = F, height = NULL,
                    column(width = 8,
                           tags$script(src = "https://code.highcharts.com/mapdata/custom/world-palestine-highres.js"),
                           highchartOutput("hcontainer",height = "100%")
                           #plotOutput("plot1")
                    ),
                    footer =  fluidRow(
                      column(
                        width = 4,
                        descriptionBlock(
                          number = textOutput('descBlock_txt_2', inline = T), 
                          number_color = "green", 
                          number_icon = "fa fa-caret-up",
                          header = textOutput('descBlock_txt_1', inline = T), 
                          text = "Total Occurences", 
                          right_border = TRUE,
                          margin_bottom = FALSE
                        )
                      ),
                      column(
                        width = 4,
                        descriptionBlock(
                          number = "18%", 
                          number_color = "red", 
                          number_icon = "fa fa-caret-down",
                          header = "1200", 
                          text = "GOAL COMPLETION", 
                          right_border = FALSE,
                          margin_bottom = FALSE
                        )
                      )
                    )

            )
    )
  )
)

  server <- function(input, output) {

    data_dummy <-  get_data_from_map(download_map_data("custom/world-palestine-highres")) %>% 
      dplyr::mutate(cnt = round(runif(nrow(.), 0, 100), 0))

    output$hcontainer <- renderHighchart({

      n <- 4
      stops <- data.frame(q = 0:n/n,
                          c = brewer.pal(n+1, "YlOrRd"),
                          stringsAsFactors = FALSE)
      stops <- list_parse2(stops)

      hc <- hcmap(map = "custom/world-palestine-highres", data = data_dummy,
                  joinBy = c("iso-a2" ,"iso-a2"), value = "cnt", name = "dummy",
                  borderColor = "#FAFAFA", borderWidth = 0.1,
                  tooltip = list(valueDecimals = 0, valuePrefix = " ", valueSuffix = " count"), 
                  download_map_data = F, states = list(hover = list(color = "#a4edba"))

      ) %>% 
        hc_colorAxis( stops = stops, min = 0 , max = 10, labels = list(format = "{value}")) 
      # hc_colorAxis( minColor = "#FFFFFF", maxColor = "#434348")
      hc %>% 
        hc_add_event_series( series = "series",event = "click")

    })

    }

  shinyApp(
    ui = dashboardPagePlus(skin = "green",
                           header,
                           sidebar,#dashboardSidebar(disable = F),
                           body
                           #footer
    ),
    server = server
  )

Thanks

[DivadNojnarg]

Add this to your code in the dashboardBody:

tags$style(
    ".content-wrapper{
      min-height: 800px !important;
    }
    "
  )

You may adapt the min-height property to your needs. Alternatively, you may write a custom dashboardPagePlus function (the problem also appears in shinydashboard with dashboardPage).

page <- dashboardPagePlus(
    skin = "green",
    header,
    sidebar,
    body
  )

page[[1]]$attribs$style <- "min-height: 800px"

shinyApp(ui = page, server = server)