<lorem-ipsum> web component built using the HTML Custom Element v1 spec
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
LICENSE.md
README.md
demo.html
lorem-ipsum.js

README.md

<lorem-ipsum> Custom Element

The <lorem-ipsum> component is built using the HTML Custom Elements v1 spec. This element takes two attributes:

  • type - {string} (paragraph, list, or words).
  • length - {number|number[]} a number or range of numbers to use to generate random Lorem Ipsum text.

Paragraph

<lorem-ipsum type="paragraph" length="3"></lorem-ipsum>

Words

<lorem-ipsum type="words" length="[5, 20]"></lorem-ipsum>

Lists

<lorem-ipsum type="list" length="5"></lorem-ipsum>

Transcluding HTML Elements

<lorem-ipsum type="paragraph" length="1">
    <ul>
        <li><button>Spin Me</button></li>
        <li><strong>Right Round</strong></li>
        <li>><small>Like A Record <sup>Baby</sup></small></li>
        <li><em>Right round round round</em></li>
    </ul>
</lorem-ipsum>

Nesting Elements

<lorem-ipsum type="paragraph" length="2">
    <h4><lorem-ipsum type="words" length="[2, 5]"></h4>
    <lorem-ipsum type="list" length="6"></lorem-ipsum>
    <h4><lorem-ipsum type="words" length="3"></h4>
    <lorem-ipsum type="list" length="3"></lorem-ipsum>
    <h4><lorem-ipsum type="words" length="[2, 5]"></h4>
    <lorem-ipsum type="list" length="10"></lorem-ipsum>
    <p><lorem-ipsum type="words" length="[20, 50]"></p>
</lorem-ipsum>

Donate

  • BTC: 18o3S3rzdBqfUndc4pZm9dNUrNJ5zijDon
  • ETH: 0x9289E1B3a846061B14E81FD521a3ac910EC908A7