Hero #
Hero Title
Not all heroes wear capes
Hero Title
Not all heroes wear capes
Hero Title
Not all heroes wear capes
Menu and Contents #
Installation
Lorem ipsum dolor sit amet,
consectetur
adipiscing elit, sed do eiusmod tempor incididunt ut labore et
dolore magna aliqua. Quis ipsum suspendisse ultrices gravida.
Fringilla phasellus faucibus scelerisque eleifend donec
pretium.
Installing Infima
Ut lectus arcu bibendum at. Quam adipiscing vitae proin sagittis nisl rhoncus mattis rhoncus urna. Lacus laoreet non curabitur gravida. Neque viverra justo nec ultrices dui sapien eget mi. Et pharetra pharetra massa massa ultricies mi. Nulla aliquet enim tortor at. Euismod nisi porta lorem mollis aliquam.
Ut lectus arcu bibendum at. Quam adipiscing vitae proin sagittis nisl rhoncus mattis rhoncus urna. Lacus laoreet non curabitur gravida. Neque viverra justo nec ultrices dui sapien eget mi. Et pharetra pharetra massa massa ultricies mi. Nulla aliquet enim tortor at. Euismod nisi porta lorem mollis aliquam.
Verifying Installation
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida. Fringilla phasellus faucibus scelerisque eleifend donec pretium.
const myFun = (x, y) => {
const doubleX = x + x;
const doubleY = y + y;
return doubleX + doubleY
};
Morbi tincidunt ornare massa eget. Dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras. Sem fringilla ut morbi tincidunt augue interdum velit euismod in. Volutpat maecenas volutpat blandit aliquam etiam erat. Fames ac turpis egestas maecenas. Odio ut sem nulla pharetra diam sit. Gravida rutrum quisque non tellus orci ac auctor.
Running Examples
At elementum eu facilisis sed odio morbi quis. Metus vulputate eu scelerisque felis. Vitae semper quis lectus nulla at volutpat diam ut venenatis. Pellentesque diam volutpat commodo sed egestas egestas fringilla. Cursus in hac habitasse platea dictumst quisque sagittis purus. Odio ut enim blandit volutpat maecenas volutpat blandit.
Why this is good
- Foo
- Bar
-
Baz
- Foo
- Bar
- Baz
At elementum eu facilisis sed odio morbi quis. Metus vulputate eu scelerisque felis. Vitae semper quis lectus nulla at volutpat diam ut venenatis. Pellentesque diam volutpat commodo sed egestas egestas fringilla. Cursus in hac habitasse platea dictumst quisque sagittis purus. Odio ut enim blandit volutpat maecenas volutpat blandit.
Grid #
Twelve Column Layout
Equal-width
Auto-width
Column Offsets
No Gutters
Dropdown #
Alerts #
somewhere
else
.
somewhere
else
. And this
some code
for example.
somewhere
else
.
somewhere
else
.
somewhere
else
.
somewhere
else
.
- Timeline
- About
- Timeline
- About
- Timeline
- About
Badges #
This is Something New Primary
This is Something New Primary
This is Something New Primary
This is Something New Primary
This is Something New Primary
This is Something New Primary
Avatar #
Horizontal Avatars
Vertical Avatars
Cards #
Lorem Ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida.
Quaco Lighthouse
The Quaco Head Lighthouse is a well maintained lighthouse close to St. Martins. It is a short, beautiful walk to the lighthouse along the seashore.Full-Height Cards
Lorem Ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida.
Quaco Lighthouse
The Quaco Head Lighthouse is a well maintained lighthouse close to St. Martins. It is a short, beautiful walk to the lighthouse along the seashore.Typography #
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Emphasis
Emphasis, aka italics, with asterisks or underscores .
Strong emphasis, aka bold, with asterisks or underscores .
Combined emphasis with asterisks and underscores .
Strikethrough uses two tildes.
Scratch this.
This is primary text.
This is secondary text.
This is success text.
This is info text.
This is warning text.
This is danger text.
Blockquotes
Blockquotes are very handy in email to emulate reply text. This line is part of the same quote.
Quote break.
This is a very long line that will still be quoted properly when it wraps. Oh boy let's keep writing to make sure this is long enough to actually wrap for everyone. Oh, you can put Markdown into a blockquote.
Some nested quote
Here's a link to
somewhereelse and aninline code block
Lists
- First ordered list item
- Second item
- Third item
- First unordered list item
- Second item
- Third item
-
Lists in a list item:
-
Indented four spaces.
- indented eight spaces.
- Four spaces again.
-
Indented four spaces.
-
Multiple paragraphs in a list items: It's best to indent the paragraphs four spaces You can get away with three, but it can get confusing when you nest other things. Stick to four.
We indented the first line an extra space to align it with these paragraphs. In real use, we might do that to the entire list so that all items line up.
This paragraph is still part of the list item, but it looks messy to humans. So it's a good idea to wrap your nested paragraphs manually, as we did with the first two.
-
Blockquotes in a list item:
Skip a line and indent the >'s four spaces.
-
Preformatted text in a list item:
Skip a line and indent eight spaces. That's four spaces for the list and four to trigger the code block.
Tables
| Tables | Are | Cool |
|---|---|---|
| col 3 is | right-aligned | $1600 |
| col 2 is | centered | $12 |
| zebra stripes | are neat | $1 |
| Markdown | Less | Pretty |
|---|---|---|
| Still | renders |
nicely |
| 1 | 2 | 3 |
| Markdown | Less | Pretty |
|---|---|---|
| Still | renders |
nicely |
| 1 | 2 | 3 |
Inline HTML
To reboot your computer, search it up on Google or press ctrl + alt + del .
Horizontal Rules
Three or more...
Hyphens
Asterisks
Underscores
Code and Syntax Highlighting
Inline
code
has
back-ticks around
it.
function foo() {
console.log('foo!');
}
You can use
code
in your headers.
As well as type
code
in your blockquotes.
And you can use
code
inside links
| JavaScript | Reason |
|---|---|
const myFun = (x, y) => {
const doubleX = x + x;
const doubleY = y + y;
return doubleX + doubleY
};
|
let myFun = (x, y) => {
let doubleX = x + x;
let doubleY = y + y;
doubleX + doubleY
};
|
