Dummy
A Lism component for outputting dummy text.
Props
| Property | Description |
|---|---|
lang | Specifies the language. Defaults to en. Also supports ja and ar. |
length | Specifies the length of the dummy text. Valid values are xs, s, m, l, xl, codes. Defaults to m. |
pre | Specifies text to display before the dummy text. |
as | Specifies the HTML tag for the dummy text. |
offset | Specifies an offset for the dummy text. Text is trimmed at , and . boundaries, so the resulting text will be shorter. |
Import
import { Dummy } from 'lism-css/react';Dummy Text Examples
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.
ロレム・イプサムの座り雨。目まぐるしい文章の流れの中で、それは静かに歩く仮の言葉です。Elitも穏やかに続いていきますが、積み重ねられてきた「LiberroyとFoogの取り組み」は、余白のようなものです。
<Dummy /><Dummy lang='ja' />xs: ロレム・イプサムの座り雨。
xs: Lorem ipsum dolor sit amet.
s: ロレム・イプサムの座り雨。目まぐるしい文章の流れの中で、それは静かに歩く仮の言葉です。
s: Lorem ipsum dolor sit amet. Consectetur adipiscing elit, sed do eiusmod tempor Incididunt ut.
m: ロレム・イプサムの座り雨。目まぐるしい文章の流れの中で、それは静かに歩く仮の言葉です。Elitも穏やかに続いていきますが、積み重ねられてきた「LiberroyとFoogの取り組み」は、余白のようなものです。
m: 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.
l: ロレム・イプサムの座り雨。目まぐるしい文章の流れの中で、それは静かに歩く仮の言葉です。Elitも穏やかに続いていきますが、積み重ねられてきた「LiberroyとFoogの取り組み」は、余白のようなものです。作業が進むにつれて、工夫や考えとともに関心が折り重なりながらも、必要以上に主張せず彼らの作品は私たちに一定の示唆を与えてくれます。
l: 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. Aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint.
xl: ロレム・イプサムの座り雨。目まぐるしい文章の流れの中で、それは静かに歩く仮の言葉です。Elitも穏やかに続いていきますが、積み重ねられてきた「LiberroyとFoogの取り組み」は、余白のようなものです。作業が進むにつれて、工夫や考えとともに関心が折り重なりながらも、必要以上に主張せず彼らの作品は私たちに一定の示唆を与えてくれます。内容の違いを比べるためのドラーとして、静かにそこにあります。選ばれた事実や、意味を限定しない言葉の並びは、全体の雰囲気を整える役割を果たします。時間の流れの中で、そうした文章は自然に形を変え、使う人の意図に委ねられていきます。
xl: 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. Aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint. Occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis undeomnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.
<Dummy lang='ja' length='xs' pre='xs: ' /><Dummy lang='ja' length='s' pre='s: ' /><Dummy lang='ja' length='m' pre='m: ' /><Dummy lang='ja' length='l' pre='l: ' /><Dummy lang='ja' length='xl' pre='xl: ' />length='codes' outputs dummy text containing <b>, <i>, <a>, and <code> elements. ロレム・イプサムの座り雨、それは静かに歩く仮の言葉です。長いあいだ積み重ねられてきたLiberroyとFoogの取り組み」は、私たちに一定の示唆を与えてくれます。
<Dummy lang='ja' length='codes' />ロレム・イプサムの座り雨。
目まぐるしい文章の流れの中で、それは静かに歩く仮の言葉です。Elitも穏やかに続いていきますが、積み重ねられてきた「LiberroyとFoogの取り組み」は、余白のようなものです。
Elitも穏やかに続いていきますが、積み重ねられてきた「LiberroyとFoogの取り組み」は、余白のようなものです。作業が進むにつれて、工夫や考えとともに関心が折り重なりながらも、必要以上に主張せず彼らの作品は私たちに一定の示唆を与えてくれます。
<Dummy lang='ja' length='xs' /><Dummy lang='ja' offset={1} /><Dummy lang='ja' length='l' offset={3} />Dummy Lists
When as='ul' or as='ol' is specified, a list is rendered.
- 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.
- 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.
<Dummy as='ul' /><Dummy as='ol' />Dummy Image
When as='img' is specified, a dummy image is fetched from https://cdn.lism-css.com/.
<Dummy as='img' />