Decorator
コンテンツを装飾するための空要素を出力するためのコンポーネントです。
デフォルトでaria-hidden="true"で出力されます。
構造
div.a--decorator[aria-hidden="true"]Props
| プロパティ | 説明 |
|---|---|
variant | a--decorator--{variant} クラスを出力します。 |
size | デコレーターのサイズ（横幅・高さ）を一括指定します。 この指定がある場合、 ar='1'が自動で付与され、指定したサイズはwに渡されます。 |
Import
import { Decorator } from '@lism-ui/core';Usage
<Decorator>を使った装飾例を紹介します。
↓
例
Lorem ipsum dolor sit, amet consectetur adipisicing elit, sed do eiusmod tempor. Non facere laudantium ex eos doloribus aut dolore nisi.
リサイズ可能
<Grid ta='l'> <Decorator size='1.25em' bd='l' rotate='45deg' transformOrigin='left bottom' /> <Box p='20'> <Dummy /> </Box> <Decorator size='1.25em' bd='l' rotate='-45deg' transformOrigin='left top' /></Grid>この他にも、以下のページで<Decorator>を活用したコンテンツの装飾例を複数紹介しています。