- Documentation for promo banner variations
- Accordion component now supports a multi-selectable feature, allowing multiple accordions within a set to be open at the same time.
- Documentation for the new promo banner component
- Note about how U.S. Web Design System has been implemented into the Formation design system
- Corrects font size in the font size utility. The issue affected the normal font size utility, which was incorrectly set to
300. The correct value is
6.6.1 and 6.6.2
- Corrects display bug in the promo banner component
- Adds new promo banner component
- New pattern documentation for handling supplemental content.
- Patches line-height mismatch for paragraphs inside of a
- Update loading indicator component: Uses CSS for animation instead of animated SVG, which was unsupported in IE.
- Removed USWDS
- Fixed bug where anchors were hidden behind sticky navigation
May 30, 2019
Content style guide update
- New topic added for VA trademarks.
May 21, 2019
- Removed examples of alert boxes with expandable content.
Content style guide updates
Summary of new guidance or change in guidance (either from the vets.gov or OPIA style guides):
- Sentence casing, except for “Veterans,” global header, global footer, global top nav labels, and proper nouns.
- Service member spelling change, per latest OPIA and DOD style guides.
- Times and time zones: Omit daylight savings/standard reference; use ET, MT, CT, PT without parentheses; and other style updates.
- Phone numbers and vanity numbers style change.
- Use “select” instead of “press” for phone menu options. It’s more 508-friendly.
- Numbers: When to use 1, when to spell out “one.”
- Use we, us, you when talking with Veterans.
- Use they and their as gender-neutral pronouns.
- Changes to how we display links and use embedded links.
- Guidance and tips for writing health content.
- Writing for SEO: format and character count updates for title tags and meta descriptions.
- Bulleted lists: Clarification on punctuating; on when multiple lists on the same page.
- Clarification on contractions. (Contractions are conversational. We use them.)
- Change of house reference from Chicago Manual to AP Style. This aligns with OPIA house reference.
May 20, 2019
- Patch to Fix a bugg affecting accordions
- Redesigned code snippet previews and improved links to the react versions for some components.
May 13, 2019
- Imports missing Sidenav component CSS
May 13, 2019
May 9, 2019
April 30, 2019
- Adds missing Sass variables for cool blue colors
April 25, 2019
- Address bug in accordion script where bordered accordions were not declared
- Fixes second bug in accordion where the DOM was traversed incorrectly
- Fixes interaction on accordions where accordion content is opened below the fold
- Updates to the content style guide
- Removed browser autocomplete from search
- Fixes issue where content in responsive previews generated 404 in production
April 17, 2019
- Updated documentation to the content style guide
April 12, 2019
- Improved documentation for running the site locally
- Updates to some content guidance in the style guide
autoprefixerto address display bug in select boxes
April 4, 2019
- Added examples to showcase how to nest flexbox grids inside other grid columns.
- Updates Formation’s USWDS backbone to version 1.6.10.
April 3, 2019
6.0.0 & 6.0.1
Image paths in Formation are now relative, so the images and fonts folder are not required to be in your site root.
- Better indicators for responsive utilities
- Updates to contribution documentation (still work in progress)
- Updates to content style guide
March 29, 2019
- Added search feature
March 25, 2019
- Removes padding property on U.S. Web Design System grid that is overridden on VA.gov
- Updated documentation for designers, developers, and naming conventions
March 21, 2019
- Adds heading level names to font-size utility
- Adds more images used in background image CSS from va.gov
- Update to documentation about headings in the typography section
- Update to documentation on heading utilities
March 13, 2019
- Updates external link icon documentation;
March 12, 2019
- Adds external link icon CSS into Formation design system
March 11, 2019
- Creats Sass variables for hub colors that are consistent with the rest of color variable naming conventions
- Adds two new hub colors to utility classes for color, background color, and border color
- New layout for system color palette
- Updated documentation for color, background color, and border color to include new hub colors and Sass variable names
March 6, 2019
- Update documentation for alerts
March 4, 2019
- Added form control documentation
- Added image aspect ratio documentation
February 21, 2019
- Added line-height utility
- Added measure
- Improved documentation pages for some utilities
February 20, 2019
- Added height and width utility
February 14, 2019
- Added a border utility
February 12, 2019
- Added a font-weight utility
- Added a transparent option for color and background color utility.
- Added a new
February 11, 2019
- Hover on any
h4to get an anchor link. This feature will allow users to easily copy deep links to share and discuss.
February 8, 2019
- Added a text-decoration utility
- Added a text-alignment utility
February 6, 2019
- Added a spacing units function for margin and padding
- Added documentation for spacing units
February 6, 2019
- Added font-family utility
- Updated the documentation presentation for the color utility and added hex keys.
- Updated icon documentation to include HTML snippets
February 5, 2019
Adds a font-size utility
Updated the documentation for background colors and added hex keys.
February 1, 2019
Adds a background-color utility
Adds a color utility
January 30, 2019
Adds a suite Flexbox utilities.
January 29, 2019
Moves the Add Another button to the bottom of array lists in support of updates to the U.S. Forms System.
January 25, 2019
Includes Font Awesome regular and Fontawesome brand fonts.
This release adds a new flexbox grid system.
January 23, 2019
In this release we are splitting Formation into two modules: formation and formation-react. The regular formation module contains the styles and assets used to render a site using the VA design system. In the future it will also include plain JS implementations of components with interactivity.
formation-react module contains all the React component implementations we’ve built for design system patterns.
Both are starting on v3, but will not necessarily be kept in sync going forward.
To upgrade, update any paths in your React code to point to
formation-react instead of
January 21, 2019
- Updated icon font set to Fontawesome 5 solid
January 17, 2019
- Created page to show recent updates
January 15, 2019
- Accessibility fixes for the module component