- Responsive layouts using grid or column schemes
- Push-pull control
- Special text boxes and labels - alerts, warnings, notes, wells, pre-formatted boxes etc.
- Navigation lists: can be mixed with pills and dropdowns, dividers / spacers, flexible tabs placement
The following classes are used by UIO and Exploration Tool:
Links and Text:
Hypothetical Scenario: Framework as FSS Replacement
To better understand functionality of a framework, it may be worthwhile to explore how a framework can replicate functionality of FSS (see: FSS Cheat Sheet).
forms and controls
- Apply button styling to an element
- Purecss - add pure-button class to anchor element to make it into a button.
- alignment: left, right
- control and label alignment: left, center, right
- movable containers that emcompass elements that collectively create a "widget" (i.e. a calendar or search field).
- Foundation - Foundation has a Panel style which is like a callout.
- contains: title, options, and content sections.
- progressive enhancement
- visibility / content hiding
- 5 modes of hiding:
- hidden to browsers and ATs
- hidden to browsers and ATs, but maintaining layout
- hidden to browsers but available to ATs
- hide text and replace with image
- size, spacing between characters
- Bootstrap - defined via
- font loading: serif, sans, monospace, times, courier, arial, verdana
- alignment: left, right, center
- very minimal
- written in SMACSS
- Purecss is designed to play nice with other frameworks. One use case is to have Purecss as foundation and specific Bootstrap modules.