Content
When you can't use CSS classes or just want to use HTML, you can wrap everything with the .content class.
This is specially useful if you are dealing with user-generated content (WYSIWYG).
The content below is styled using the .content class only.
Introduction
Title 2
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem delectus dicta explicabo, iure nam quis quisquam recusandae rerum sed voluptates.
Title 3
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem delectus dicta explicabo, iure nam quis quisquam recusandae rerum sed voluptates.
Title 4
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem delectus dicta explicabo, iure nam quis quisquam recusandae rerum sed voluptates.
Title 5
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem delectus dicta explicabo, iure nam quis quisquam recusandae rerum sed voluptates.
Title 6
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris
lacinia tristique nisl ac condimentum. Morbi ultrices, libero nec varius
eleifend, augue sapien malesuada elit, quis aliquet ex ex non elit. Morbi
sem magna, commodo vitae dignissim at, vulputate quis lorem. Nulla orci erat, lobortis sed
turpis porta, tristique fringilla turpis. Donec nec purus ac turpis tempus vulputate quis
vel purus.
Nam semper eros justo, quis vehicula lorem ornare cursus. Sed in suscipit purus. Morbi scelerisque ac felis pretium cursus. Curabitur vel massa auctor, hendrerit eros nec, dignissim sapien. Integer euismod eros vitae pretium condimentum.
Code blockThis is a quote
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Vivamus eu magna placerat velit suscipit pellentesque eu in augue.
- Cras sit amet lorem vitae est mattis dignissim quis id libero.
- Fusce eu sem viverra, pharetra ligula vitae, egestas neque.
- Sed non turpis elementum, tristique ipsum ut, ultrices lectus.
- Cras interdum massa vitae erat rutrum sodales vel eget mauris.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Vivamus eu magna placerat velit suscipit pellentesque eu in augue.
- Cras sit amet lorem vitae est mattis dignissim quis id libero.
- Fusce eu sem viverra, pharetra ligula vitae, egestas neque.
- Sed non turpis elementum, tristique ipsum ut, ultrices lectus.
Variables
| Name | Type | Value | Computed value |
|---|---|---|---|
$content-blockquote-background-color | color | $grey-lighter | rgb(242, 242, 242) |
$content-blockquote-border-left | border | 5px solid $grey-light | 5px solid rgb(185, 185, 185) |
$content-blockquote-padding | sizes | 1.25em 1.5em | |
$content-pre-padding | sizes | 1.25em 1.5em |