Show
Show displays a container that hides under a breakpoint.Import
import { Show } from "@prismane/core";
Usage
The Show component will show it's content, when the screen is bigger than the provided breakpoint. By default, the breakpoint prop has a value of base (1024px)
<Show>Shown over base (1024px) breakpoint!</Show>
Custom breakpoint
<Show breakpoint="1440px">Shown over 1440px!</Show>
Show Sizes
<Stack direction="column" gap={fr(2)}> <Show breakpoint="xs">Shown over xs (640px) breakpoint!</Show> <Show breakpoint="sm">Shown over sm (768px) breakpoint!</Show> <Show breakpoint="base">Shown over base (1024px) breakpoint!</Show> <Show breakpoint="md">Shown over md (1280px) breakpoint!</Show> <Show breakpoint="lg">Shown over lg (1536px) breakpoint!</Show> </Stack>
API
Please refer to the documentation below for a comprehensive overview of all the available props and classes for the mentioned components.
- -
Show