USWDS-Site - Guidance: Add additional guidance regarding custom styles + extending USWDS

[mahoneycm]

Summary

Add guidance to outline how users can use custom styles and extend USWDS beyond what theme settings are available to them.

Problem statement

Our current Getting started for developers - Part 3: Customization primarily focuses on using theme settings and design tokens to customize USWDS.

Our document page mentions using _uswds-theme-custom-styles.scss to add additional project CSS for customizing or adding to what USWDS provides but does not provide any examples or recommendations

Proposed solution

Use some of the examples provided in the new USWDS-Tutorial - Part 2: Themeing, Customizing, and Extending to define how users can expect to add additional customizations to their projects.

This will help users to understand how they can customize the design system, and provide additional context on why they are expected to customize in this way.

Now and later steps

We discussed breaking this out into now and later steps to quickly get something on the site and providing more robust guidance down the road.

Now

We can link to the USWDS-Tutorial which provides examples on theme settings, custom styles, and extending USWDS to create custom components. We could also link the monthly call video of James and I doing a walk through of the training.

Later

We should establish our recommended pattern for users adding custom styles. Once that is established, we should update the Phase 3: Customizing and documentation pages to provide additional information on how users can expect to customize USWDS without worry of breaking components or updates erasing their styles.

[mejiaj]

Consider using the February monthly call help address this issue.

@mahoneycm can you look at the Top tasks research to see if that has an impact on weight & priority.

[mahoneycm]

Now and later steps

We discussed breaking this out into now and later steps to quickly get something on the site and providing more robust guidance down the road.

Now

We can link to the USWDS-Tutorial which provides examples on theme settings, custom styles, and extending USWDS to create custom components. We could also link the monthly call video of James and I doing a walk through of the training.

Later

We should establish our recommended pattern for users adding custom styles. Once that is established, we should update the Phase 3: Customizing and documentation pages to provide additional information on how users can expect to customize USWDS without worry of breaking components or updates erasing their styles.

[mejiaj]

@mahoneycm the monthly call video already exists on https://designsystem.digital.gov/about/monthly-calls/. Are you saying we'd link to this in Phase 3: Customizing?

[mahoneycm]

@mejiaj Yep! Personally, I think it'd be a good idea to make sure people know that the resource exists.