Elements
In this layer, elements refer to styles applied the specific type selectors. In this implementation there is a few helper classes to accompany these default styles.
Tables
This is a responsive table implementation. For a responsive table implementation see "Responsive Table UI" under Objects.
Name | Type | Grade |
---|---|---|
Gizmo | Robot | A+ |
Sherlock Holmes | Human | B- |
Merlin | Wizard | C |
Richard Nixon | Cyborg | B- |
Lists
Element styling for ordered and unordered lists.
Unordered List
- Listed Item #1
- Listed Item #2
- Listed Item #3
- Listed Item #4
Ordered List
- Numbered Item #1
- Numbered Item #2
- Numbered Item #3
- Numbered Item #4
Headlines
Simple typescale
Headline Level 1
Headline Level 2
Headline Level 3
Headline Level 4
Headline Level 5
Headline Level 6
SmallBody Text
Normal body text assuming a font-size
of 100% and spacing for multiple paragraphs.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Links
Simple styling for links and a class to apply to elements that need similar styling but aren't an anchor tag.
Forms
Reset styling for form elements, mostly to inherit styles.
Images
Sets max-width: 100%
on images and sets the fill of <svg>
elements to be the declared color.