Style Guide

The following section provides some formatting tests for default content rendered with markdown.

Headers

H1

H2

H3

H4

H5

H6

Code

Pre-formatted code blocks are used for writing about programming or markup source code. Rather than forming normal paragraphs, the lines of a code block are interpreted literally. Markdown wraps a code block in both <pre> and <code> tags.

To indicate a span of code, wrap it with backtick quotes (`). Unlike a pre-formatted code block, a code span indicates code within a normal paragraph.

Sample line of code:

<iframe href="example.html"></iframe>

Sample block of code:

module.exports = (themeOptions) => {
  const contentPath = themeOptions.contentPath || `content/pages`
  const assetPath = themeOptions.assetPath || `content/assets`
  return {
    contentPath,
    assetPath,
  }
}

Blockquotes

This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.

Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

Links

This is an example link.

This link has no title attribute and is in a longer set of words. Let’s see how long I can type before I get bored and stop typing. Here is me filling in some more spaces. And wow we have encountered another link in the wild!

Buttons

Tables

Lists

Markdown supports ordered (numbered) and unordered (bulleted) lists.

Unordered lists use asterisks, pluses, and hyphens — interchangably — as list markers:

• Red
• Green
• Blue

Ordered lists use numbers followed by periods:

1. Bird
2. McHale
3. Parish

Emphasis

single underscores

Some more text in italics to get a better feel for how it can look. Here it goes just continuing on.

double asterisks

Some more BOLD text. This really draws attention to it and helps to give a feel for what it looks like just a bit longer.