Skip to content

@thisisdano thisisdano released this Aug 14, 2019

Made it simpler to subset the design system and include only the components your project needs with USWDS packages.

  • Thanks @turnerhayes for getting the ball rolling here, even if the final product might not be what you envisioned!
  • Created custom packages in stylesheets/packages used to import only code related to the component package (ie @import uswds-banner)
  • Analyzed each USWDS component's stylesheet dependencies
  • Left existing default build process alone (ie @import uswds)
  • Allows users to dramatically reduce the USWDS code footprint
package .css .min .zip
default USWDS 359 271 40 KB
form-controls 18 15 3
form-templates 60 47 6
typography 17 15 3
validation 32 28 5
usa-accordion 13 12 2
usa-alert 13 12 2
usa-banner 50 38 5
usa-button 19 16 3
usa-checklist 11 9 2
usa-footer 59 46 6
usa-header 113 63 9
usa-hero 48 37 5
usa-media-block 10 9 2
usa-search 29 25 4
usa-sidenav 12 10 2
usa-skipnav 10 9 2
usa-table 11 9 2
usa-tag 10 9 2
usa-header + usa-footer 162 72 10
usa-banner + usa-footer 99 55 7

Reorganized the source code (in the stylesheets directory) to better reflect its relationship to the build process:

  • Split subcomponents into separate files
  • Move global stylesheets into their own folder
  • Move all code-emitting source out of required dependencies
Assets 3
You can’t perform that action at this time.