Skip to content

therocco/lorem-ipsum

master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 

<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

About

<lorem-ipsum> web component built using the HTML Custom Element v1 spec

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published