Decorator
A component that outputs an empty element for decorating content.
Rendered with aria-hidden="true" by default.
Structure
div.a--decorator[aria-hidden="true"]Props
| Prop | Description |
|---|---|
size | Sets the decorator’s size (width and height) at once. When specified, the value is passed to w (width) and ar='1/1' (aspect-ratio:1/1) is applied automatically. |
blur,contrast,brightness,grayscale,hueRotate,invert,saturate,sepia | These are concatenated together and passed to style.filter. |
clipPath,boxSizing | Passed to style.clipPath and style.boxSizing respectively. |
Import
import { Decorator } from 'lism-css/react';Usage
Here are some decoration examples using <Decorator>.
↓
Example
Lorem ipsum dolor sit amet. Consectetur adipiscing elit, sed do eiusmod tempor Incididunt ut. Labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut.
<Box p='30' pos='rel'> <Dummy /> <Decorator size='1.25em' pos='abs' t='0' l='0' bd-x-s bd-y-s /> <Decorator size='1.25em' pos='abs' r='0' b='0' bd-x-e bd-y-e /></Box>