3

I'm working on a full page layout using fillPage(). For a box to be able to stretch vertically, all elements that define this box need to have a style = "height: 100%" attribute (or so I'm told). Is there a way to append/update the style attribute for an element and all sub-elements?

I have whipped up an implementation that appears to work for my case, but I'm probably missing some details.

library(htmltools)

tagAppendAttributesAll <- function(x, ...) {
  if (!is.list(x)) return(x)
  if (inherits(x, "shiny.tag.list")) {
    x[] <- purrr::map(x[], tagAppendAttributesAll, ...)
    x
  } else {
    x <- tagSetChildren(
      x,
      list = purrr::map(x$children[], tagAppendAttributesAll, ...)
    )
    tagAppendAttributes(x, ...)
  }
}

tagSetFullHeightAll <- function(x) {
  tagAppendAttributesAll(x, style = "height: 100%;")
}

print(tagSetFullHeightAll(
  div(
    div(
      div("test"),
      style = "height: 400px; "
    )
  )
))
#> <div style="height: 100%;">
#>   <div style="height: 400px;  height: 100%;">
#>     <div style="height: 100%;"></div>
#>   </div>
#> </div>

Created on 2019-04-29 by the reprex package (v0.2.1.9000)

krlmlr
  • 25,056
  • 14
  • 120
  • 217

1 Answers1

0

Maybe I'm misunderstand your problem. Have you tried using the unit 'vh'. In one of my shiny apps I'm using this line:

leafletOutput("rutMap", width = '100%', height = '75vh')

Hans Gardfjell
  • 11
  • 2
  • Unfortunately, `vh` seems to be imperfect -- AFAICT it uses the size of the display, and not the size of the window. Also, I'm composing a grid of fixed-size and variable-sized elements. I might extend the example to clarify. – krlmlr Apr 29 '19 at 20:46