Style Guide

Lorem ipsum Laboris velit aliquip ullamco nulla dolore irure magna velit adipisicing enim officia minim ad adipisicing aliquip dolor nostrud consequat dolor commodo Excepteur fugiat labore enim Ut anim sint laboris fugiat qui Duis elit mollit et sit aliquip veniam voluptate eiusmod.

H2 Title

H3 Title

H4 Title

H5 Title
H6 Title

Unordered List

  • Lorem ipsum Esse laborum ut sint ad adipisicing sit adipisicing Duis esse aliqua do esse sit anim sit in.
  • Lorem ipsum Anim do sint veniam officia irure sunt nostrud irure ea.
  • Lorem ipsum In officia reprehenderit enim.
  • Lorem ipsum Eiusmod sunt dolor in ea tempor sunt amet sint dolore ad et cillum veniam pariatur mollit qui aliqua Excepteur.
  • Lorem ipsum Est in id adipisicing adipisicing culpa amet labore non exercitation mollit in nostrud sed cillum officia mollit cupidatat occaecat.

Ordered List

  1. Lorem ipsum Esse laborum ut sint ad adipisicing sit adipisicing Duis esse aliqua do esse sit anim sit in.
  2. Lorem ipsum Anim do sint veniam officia irure sunt nostrud irure ea.
  3. Lorem ipsum In officia reprehenderit enim.
  4. Lorem ipsum Eiusmod sunt dolor in ea tempor sunt amet sint dolore ad et cillum veniam pariatur mollit qui aliqua Excepteur.
  5. Lorem ipsum Est in id adipisicing adipisicing culpa amet labore non exercitation mollit in nostrud sed cillum officia mollit cupidatat occaecat.

Definition List

Lorem Definition Term
Lorem ipsum Ut ullamco dolore ad in nisi sed ad veniam mollit voluptate proident deserunt. Lorem ipsum Ut ullamco dolore ad in nisi sed ad veniam mollit voluptate proident deserunt.
Lorem Definition Term
Lorem ipsum Ut ullamco dolore ad in nisi sed ad veniam mollit voluptate proident deserunt.

Blockquote

Lorem ipsum Ut ullamco dolore ad in nisi sed ad veniam mollit voluptate proident deserunt. Lorem ipsum Ut ullamco dolore ad in nisi sed ad veniam mollit voluptate proident deserunt.

Tables

Column Header 1 Column Header 2 Column Header 3 Column Header 4
Column data Column data Column data Column data
Column data Column data Column data Column data
Column data Column data Column data Column data
Column data Column data Column data Column data

Using the Accordion

First navigate to the page that you want to use the accordion on and select the Modules dropdown but instead of adding a new module we want to 'Add Existing Module'.

After this, using the first dropdown on the left that says 'None Specified' you will navigate to this page by going under the MHQA dropdown and selecting 'Style Guide'.

From here you will have a few modules to choose from, but first you need to check the box at the top that is labeled 'Make a Copy'.

Then you will add the Form and List module to the page just like you would add any other module.

  • Accordion Title

    HTML Ipsum Presents

    Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.

    Header Level 2

    1. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    2. Aliquam tincidunt mauris eu risus.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.

    Header Level 3

    • Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    • Aliquam tincidunt mauris eu risus.
    
    #header h1 a { 
    	display: block; 
    	width: 300px; 
    	height: 80px; 
    }
    
  • Accordion Title 2

    HTML Ipsum Presents

    Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.

    Header Level 2

    1. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    2. Aliquam tincidunt mauris eu risus.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.

    Header Level 3

    • Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    • Aliquam tincidunt mauris eu risus.
    
    #header h1 a { 
    	display: block; 
    	width: 300px; 
    	height: 80px; 
    }