SpecialRandom content
A wrapper you can use to show random content. You can use this to randomly show an image, a box or any other piece of content.
Variations
First out of three paragraphs.
Second out of three paragraphs.
Third out of three paragraphs.
First out of two large boxes
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu sem integer vitae justo eget magna fermentum iaculis eu. Et tortor consequat id porta. Quis varius quam quisque id diam vel.
Lorem ipsum dolor sit ametSecond out of two large boxes
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu sem integer vitae justo eget magna fermentum iaculis eu. Et tortor consequat id porta. Quis varius quam quisque id diam vel.
Lorem ipsum dolor sit ametDetails
Usage
Can be used inside or over any component or components. Simply add a random class around the content you wish to randomize, and then add a random-item class on each item you wish to have randomly show up.
Guidelines
- Can be used everywhere
- Only a single random-item is shown at a time. To show more than one, create multiple random groups.
HTML structure
Overall HTML view of a random group:
(other element) (optional)
*.random
(other element) (optional)
*.random-itemPresets
Table with random presets:
| Preset | Description |
|---|---|
| Random paragraph | Example of how to randomize paragraphs. |
| Random large box | Example of how to randomize large boxes. |
| Random image | Example of how to randomize an image. |
Variations
Table with random variations:
| Variation | Description |
|---|---|
| Random paragraph | Example of how to randomize paragraphs. |
| Random large box | Example of how to randomize large boxes. |
| Random image | Example of how to randomize an image. |