Theme Styleguide

• Theme Styleguide

Site theme styleguide preview page with basic HTML elements, styles and etc..

Heading 1

These are the content heading elements. Skip the first <h1> element in post content which is Theme Styleguide in this case. It is already filled by page.title variable to auto-create post main header. So start with <h2>s.

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Do not over use heading elements, keep it simple, I mean who needs an <h6> element?

Lists

Unordered

• Stop organizing the template and write some posts
• Lorem ipsum dolor sit amet, consectetur adipisicing elit
• Do not lorem ipsum me!
• Stop organizing the template and write some posts

Ordered

1. Find a topic
2. Do some research
3. Stop organizing the template and write some posts
4. Do not forget citations!

Checkbox (to-do) List

• Do this immediately
• Don’t do this
• Lorem ipsum
• Hellow world!

Media

Image Full

Always use block full with images. Theme’s max container width is 720px wide. So minimum content image width is so.

Image Inline

Inline images are not supported due to keep markdown syntax simple. If you use one, a 120x160 image in this case, you’ll get an unexpectedly cut in half content as in here. It is possible to use a customized markup syntax to fix but I’m skipping it for now.

Image Smaller than Site Content

You’ll get this if you use images smaller than 720px.

Tables

Code

Inline code samples are simple inline colored blocks as in let inlineBlock = 'inline';

Fenced code blocks are block contents styled as sample below. See GFM guide

let greet = (name) => {
  console.log(`hello ${name}! you're always welcome here!`);
}
greet("friend");

Text Elements

Here is the old bold text, and great italic. Links appear like link to theme repo. Broken lines starts from just here (with double or more spaces in markdown content):
This line is broken by a <br> element.

Inline Horizontal Rule

<hr> elements are always block level with some margin above and below.

Use them to create logically separated blocks in content maybe?

Blockquotes

Author said:

who cares your content style, headers, code blocks or images, etc.. stop organizing the site template and write posts.

And this is the end! Or not maybe?