HGR Style Guide

Grid System (12 Columns)

.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-1
.col-md-8
.col-md-4
.col-md-4
.col-md-4
.col-md-4
.col-md-6
.col-md-6


Headings

Page Header With Small Text

This is an h1 heading

This is an h2 heading

This is an h3 heading

This is an h4 heading

This is an h5 heading
This is an h6 heading

Tables
# First Name Tables
1 Michael Are formatted like this
2 Lucille Do you like them?
3 Success
4 Danger
5 Warning
6 Active
# First Name Tables
1 Michael This one is bordered and condensed
2 Lucille Do you still like it?

Content Formatting

This is a lead paragraph.

This is an ordinary paragraph that is long enough to wrap to multiple lines so that you can see how the line spacing looks.

Muted color paragraph.

Warning color paragraph.

Danger color paragraph.

Info color paragraph.

Success color paragraph.

This is text in a small wrapper. NBD, right?

Twitter, Inc.
795 Folsom Ave, Suite 600
San Francisco, CA 94107
P: (123) 456-7890
Full Name
[email protected]

Here’s what a blockquote looks like in Bootstrap. Use small to identify the source.

  • Normal Unordered List
  • Can Also Work
    • With Nested Children
  • Adds Bullets to Page
  1. Normal Ordered List
  2. Can Also Work
    1. With Nested Children
  3. Adds Bullets to Page

function preFormatting() {  // looks like this;  var something = somethingElse;  return true;}

Buttons


















Images



This is a header

This is a panel

This is a footer

This is a header

This is a panel

This is a footer

This is a header

This is a panel

This is a footer

This is a header

This is a panel

This is a footer

This is a header

This is a panel

This is a footer

This is a header

This is a panel

  • First Item
  • Second Item
  • Third Item
This is a footer

Default Well
Small Well

Large Padding Well

Contact (Name of Sales Rep)

    [dynamichidden dynamichidden-374 id:hidden_to_email]
    [dynamichidden dynamichidden-139 id:hidden_item_number]
    [dynamichidden dynamichidden-91 "CF7_URL"]
    [dynamichidden dynamichidden-303 id:new_customer]
    [dynamichidden dynamichidden-799 id:cant_remember]
    [dynamichidden dynamichidden-782 id:cc_emails]
    [dynamichidden dynamichidden-973 id:bcc_emails]
    Your Name*
    Your Email Address*
    Confirm Your Email Address*
    Your Phone Number
    Company Name
    Item Number [dynamictext dynamictext-999 id:item_number_show]
    Your Message*
    [recaptcha]

    Contact (Name of Sales Rep)

      [dynamichidden dynamichidden-738 id:hid_item_num]
      [dynamichidden dynamichidden-424 id:hid_email]
      [dynamichidden dynamichidden-91 "CF7_URL"]
      [dynamichidden dynamichidden-12 id:new_customer_pp]
      [dynamichidden dynamichidden-170 id:cant_remember_pp]
      [dynamichidden dynamichidden-988 id:cc_emails_pp]
      [dynamichidden dynamichidden-465 id:bcc_emails_pp]
      Your Name*
      Your Email Address*
      Confirm Your Email Address*
      Your Phone Number
      Company Name
      Item Number [dynamictext dynamictext-851 id:item_number_show_pp]
      Your Message*
      [recaptcha]