Hidden

Quickly and responsively toggle the visibility value of components and more with the hidden utilities.
How it works
Hidden works with a range of breakpoints e.g. xsUp or mdDown, or one or more breakpoints e.g. -Only 'sm' or -Only @('md', 'xl'). Ranges and individual breakpoints can be used simultaneously to achieve very customized behavior. The ranges are inclusive of the specified breakpoints.
innerWidth  |xs      sm       md       lg       xl
            |--------|--------|--------|--------|-------->
width       |   xs   |   sm   |   md   |   lg   |   xl
​
smUp        |   show | hide
mdDown      |                     hide | show
Up
 Using any breakpoint -Up parameter, the given children will be hidden at or above the breakpoint.
New-UDHidden -Up xl -Content {
    New-UDTypography 'xl'
}
Down
 Using any breakpoint -Down parameter, the given children will be hidden at or below the breakpoint.
New-UDHidden -Down xs -Content {
    New-UDTypography 'xs'
}
Only
Using the breakpoint -Only parameter, the given children will be hidden at the specified breakpoint(s).
The -Only parameter can be used in two ways:
list a single breakpoint
list an array of breakpoints
New-UDHidden -Only 'sm' -Content {
    New-UDTypography 'sm'
}
New-UDHidden -Only @('sm', 'xl') -Content {
    New-UDTypography 'sm,xl'
}
API
​New-UDHidden​
Grid
Stack
Last modified 5mo ago