yonder (version 0.2.0)

display: Display property

Description

Use the display() utility to adjust how a tag element is rendered. All arguments are responsive allowing you to hide elements on small screens or convert elements from inline to block on large screens.

Usage

display(tag, type)

Arguments

tag

A tag element.

type

A responsive argument. One of "inline", "block", "inline-block", "flex", "inline-flex", or "none".

See Also

Other design utilities: active(), affix(), background(), border(), float(), font(), height(), padding(), scroll(), shadow(), width()

Examples

# NOT RUN {
### Using flexbox

# When using `flex()` be sure to set the display, too.

div(
  lapply(
    1:5,
    function(i) {
      div() %>%
        padding(5) %>%
        margin(top = c(xs = 2), bottom = c(xs = 2)) %>%
        background("blue")
    }
  )
) %>%
  display("flex") %>%
  flex(
    direction = c(xs = "column", sm = "row"),
    justify = c(sm = "around")
  )

# }