Style Guide

This page demonstrate some basic elements and typography which you will use frequently within your blog. Also This theme comes with Bootstrap in pack, so you can use any of the element which is available in bootstrap.

H1 Heading

Donec tempor arcu quis ex gravida pellentesque. Quisque eros augue, placerat non tincidunt id, posuere et mauris. Mauris porta sollicitudin feugiat.

H2 Heading

Donec tempor arcu quis ex gravida pellentesque. Quisque eros augue, placerat non tincidunt id, posuere et mauris. Mauris porta sollicitudin feugiat.

H3 Heading

Donec tempor arcu quis ex gravida pellentesque[^n]. Quisque eros augue, placerat non tincidunt id, posuere et mauris. Mauris porta sollicitudin feugiat.

H4 Heading

Donec tempor arcu quis ex gravida pellentesque. Quisque eros augue, placerat non tincidunt id, posuere et mauris. Mauris porta sollicitudin feugiat.

H5 Heading

Donec tempor arcu quis ex gravida pellentesque. Quisque eros augue, placerat non tincidunt id, posuere et mauris. Mauris porta sollicitudin feugiat.

H6 Heading

Donec tempor arcu quis ex gravida pellentesque. Quisque eros augue, placerat non tincidunt id, posuere et mauris. Mauris porta sollicitudin feugiat.

Image Example

Image with regular size setting

Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nunc lacinia dapibus dui, at iaculis metus condimentum ac. Mauris nibh eros, tincidunt eu semper in, accumsan scelerisque dolor. Phasellus molestie suscipit ornare. Nulla dapibus interdum lacus, in ornare ex efficitur vel.

Image with wide size setting

Integer sit amet justo tortor. Nullam eget metus in elit convallis mollis. Ut a arcu neque. Vestibulum consequat ut mi vel tincidunt. Donec tincidunt diam tellus, eget rutrum turpis accumsan a. In convallis eu tortor a euismod. Donec lobortis gravida viverra.

Image with full width size setting

Maecenas maximus iaculis risus mollis pharetra. Nunc nec blandit ante. Cras pretium sodales mauris molestie mattis. Integer imperdiet pharetra tellus sed luctus. Ut sit amet convallis ligula. Nunc tempor in augue eu pulvinar.

Donec sed porta diam. Cras scelerisque, lorem consectetur consequat blandit, orci justo consectetur lacus, sed sodales nisi augue vel leo. Nullam non eleifend lacus, commodo pulvinar tortor. Vestibulum a sem et urna consectetur eleifend.

Unordered list

Donec tincidunt faucibus enim, non malesuada enim blandit vel. Nunc eu metus consequat, tempor magna sit amet, porttitor arcu. Nulla auctor odio tincidunt, tincidunt ipsum vitae, accumsan lectus.

  • Felis ut ultricies lacinia.
  • Mauris nec eros at ex luctus.
  • Suspendisse fringilla.
  • Lacinia porta vel eget erat.

Ordered list

Donec tincidunt faucibus enim, non malesuada enim blandit vel. Nunc eu metus consequat, tempor magna sit amet, porttitor arcu. Nulla auctor odio tincidunt, tincidunt ipsum vitae, accumsan lectus.

  1. Felis ut ultricies lacinia.
  2. Felis ut ultricies lacinia.
  3. Mauris nec eros at ex luctus.
  4. Suspendisse fringilla.

Table

Firstname Lastname Age
Jill Smith 50
Eve Jackson 94

Blockquotes

Vivamus vulputate sapien vitae nisl tempus laoreet. Fusce non eros risus. Sed tristique ex tellus, id tempus turpis ultricies ac. In porttitor, sem in scelerisque convallis, massa quam facilisis mauris, vitae faucibus est arcu eget magna.

All the great things are simple, and many can be expressed in a single word: freedom, justice, honor, duty, mercy, hope. - Winston Churchill

Nunc tristique, est vitae sollicitudin iaculis, erat nibh vulputate ligula, quis ullamcorper felis turpis ut lorem. Duis vehicula accumsan iaculis. Suspendisse ultricies urna metus, ut porta tortor convallis vitae.

Code Highlighting

HTML

<!-- start widget -->
<div class="widget">
	<h4 class="widget-title"><span>Facebook</span></h4>
	<div class="widget-content fb"></div>
</div>
<!-- end widget -->

CSS

.comment-wrap {
    background: #fff;
	padding: 1.5em 2em;
	box-sizing: border-box;
	margin-bottom: 1.5em;
}

javaScript

var x = 5;
var y = 2;
var z = x + y;
document.getElementById("demo").innerHTML = z;

Embed Card examples

YouTube video example
SoundCloud music

Twitter embed - it's a caption example
Codepen embed - it's a caption example
Mixcloud example

Some other styles

  • Bold Text: This text is bolded my default markup.
  • Emphasize: This text is emphasize.
  • Highlight: Highlighted text
  • Strike-through: I am A strike-through text.
  • Link: I am a link
  • Inline Code: Its an Inline code example
You've successfully subscribed to Polar
Great! Next, complete checkout for full access to Polar
Welcome back! You've successfully signed in.
Unable to sign you in. Please try again.
Success! Your account is fully activated, you now have access to all content.
Error! Stripe checkout failed.
Success! Your billing info is updated.
Error! Billing info update failed.