1.0.0-alpha.10

Documentation 👉

🚀 Added

• New utility classes:
  • .ds-u-text-decoration--underline
  • .ds-u-text-decoration--none
• Added .ds-u-color--primary-darkest utility class

🚨 Breaking changes

• Removed .ds-u-font-weight--light
• Removed the "Open Sans - Light" font file. This reduces page weight by 11.16kB.

💅 Changes

• The font-weight of .ds-title and .ds-text--lead are now set to normal. Previously they were set to "light".
  
• Change buttons to be same height as text fields
  
• Added a border to Alert components
  

🛠 Fixed

• Update USWDS to 1.2.0-rc1, resolving an issue where installing the design system NPM package was also installing a bunch of unnecessary dependencies used by the USWDS
• Alignment of checkbox/radio fields when text wraps

📃 Documentation

• Added guidance for grid layout and internationalization

1.0.0-alpha.9

Documentation 👉

🚀 Added

• Added .woff2 font files for a reduced page weight
• Added a Tabs component

  

1.0.0-alpha.8

Documentation 👉

🚀 Added

• Add type prop to TextField component

1.0.0-alpha.7

Documentation 👉

🚀 Added

• New React form components
  • <ChoiceList> conditionally renders a radio, checkbox, or select field
  • <TextField> - renders a text input or textarea field

🚨 Breaking changes

• Some of the filenames of existing components were changed:
  • Form/FormLabel moved to FormLabel/FormLabel
  • Form/FormField changed to TextField/TextField

1.0.0-alpha.6

Documentation 👉

• Published as a public NPM package

1.0.0-alpha.5

Documentation 👉

🚀 Added

• New React components
  • <Alert>
  • <Button>
  • <Choice>
  • <FormLabel>
  • <Select>
• Example React project, showing how to incorporate the design system into a build process (Using Webpack and Gulp).

Important: Since these components extend React.PureComponent, your project needs to have a React version of 15.3 or higher.

🚨 Breaking changes

• Renamed ds-c-dropdown to ds-c-select, since this is applied to a <select> element, and now also the <Select> React component. There were no visual changes.
• The default button component style is now with an outline. You no longer need to apply the ds-c-button--outline modifier class to achieve this style. A new ds-c-button--transparent modifier class has been added, which changes the button style to look more like an anchor element (no outline or background).

  • 

• The label component (ds-c-label) will no longer have a margin-top value when it's the first-child of a fieldset. The fieldset component (ds-c-fieldset) will now control the top margin, which resolves an issue with WebKit ignoring the margin-top property when applied to a legend element. This is being considered a breaking change since the margin is now applied to a different element and may introduce an unintended visual change if you had previously overwritten the label's margin or were relying on the previously broken behavior.

💅 Changes

• Removed negative letter-spacing from base typography

  • 

🛠 Fixed

• Fixed checkbox/radio button's vertical alignment
• Center text on anchor buttons

1.0.0-alpha.4

🚀 Added

• Responsive utility prefixes! View the new "Responsive design" page of the documentation to learn more.

  • 

• US Web Design Standard - Vertical navigation component:

  • 

• A .ds-h6 base typography class:

  • 

• A .ds-u-font-size--h4 utility class

  • 

• The design system's version # is now included in a CSS comment at the top of the transpiled CSS file.

🚨Breaking changes

• Renamed ds-title to ds-display and renamed ds-title--alt to ds-title to be more consistent with the font-size utility class names. Sorry 😬

💅 Changes

• Update styling of radio/checkbox fields. Before/After:

  • 

• Adjusted the type scale. Before/After:

  • 

🛠 Fixed

• Added border-collapse to the Table component so the borders were 1px as intended.

  • 

📝 Documentation

• Added a "Getting started" and "Core concepts" page
• Added "Further reading" sections
• Rendering as static HTML pages

1.0.0-alpha.3

1.0.0-alpha.3 Documentation 👉

🛠 Fixed

• Fixed the @font-face URLs in the transpiled CSS.

📝 Documentation

• Added an examples directory to the repo with basic examples of the design system in use.

1.0.0-alpha.2

1.0.0-alpha.2 Documentation 👉

🚀 Added

• CSS components and typography styles from the US Web Design Standards. Specifically:
  • input, textarea = ds-c-field
  • select = ds-c-field ds-c-field--dropdown
  • radio, checkbox = ds-c-choice
  • button, ds-c-button
  • Alert/Notification = ds-c-alert
  • Typography
• ds-base--inverse base class which applies an "inverse" background and text color
• ds-u-border--0 utility class for removing an element's default border
• Yeoman generator (yarn run generate) for creating a component's initial files

Note: If you plan to use the Sass files, you'll want to be sure to copy the src/images directory and ensure the $image-path Sass variable points to wherever your project's images directory is.

🚨Breaking changes

• The accessible-outline mixin (_mixins.outline) has been removed
• The px function (functions.px) has been removed

📝 Documentation

• Details and usage instructions are now collapsed by default so the code snippets don't get pushed so far down the page. This is a temporary solution until the docs get some lovin'.
• Now link to a component's USWDS companion page

1.0.0-alpha.1

🚀 Added

• Utility classes! A utility class modifies a single trait, typically a single CSS property. To apply a trait, or a combination of traits to an element, add the corresponding utility class directly to the HTML element. We can begin using utility classes to prototype possible components. Once we've identified what these components are, we can then roll them into the design system using more succinct names. This is just a first pass and I'm very open to feedback, especially on the naming convention. I'm currently favoring clarity over succinctness. This means the design system may be verbose, but it should deliver clarity and resilience in exchange. The styling of these utility classes will likely also evolve as we continue pushing on the design front.
• A new base CSS layer. You can apply the ds-base class to the <body> or parent element to apply a base layer of styling (color, font-family, font-size, line-height). Let me know if you have feedback or more ideas on how we can apply base HTML styles while still allowing the design system to be effectively implemented into existing codebases.

🚨Breaking changes

• The namespace changed from hc- to ds- to align closer with CMS.gov as a whole, rather than being tied to just HealthCare.gov. No promises that this will be the last time this changes 😬
• The package is now published to the cmsgov NPM account rather than Nava's. If you previously installed the package, you'll want to update the package name since it's now @cmsgov/design-system-core.

📝 Documentation

• Still lots of work to be done, but there's now a bit more organization applied to the documentation.
• Code snippets can now be hidden using the @hide-markup KSS flag
• A new @status KSS flag allows us to mark components as Prototype/Alpha/Beta/etc
• Published online so anyone can now read it without generating it locally. Temporarily hosted on S3 until we get GitHub pages working.
• KSS markup comments can now use EJS to generate more complex examples.