Epic: CSS Library - Replace shared variables import in vets-website

[micahchiang]

Description

vets-website currently imports shared variables from Formation. This is done at the sitewide level like in the link above, but also in almost all applications similar to this one.

Formation's shared-variables.scss file imports several stylesheets from formation/base, uswds v1, and formation-overrides/variables.

We need to replace the formation import with one from css-library. This epic encompasses the steps required to do so and is part of the plan to get css-library to a v1 release state

Considerations

• The formation shared-variables file includes some things from uswds v1. We don't want those. Bourbon, neat, and grid-settings should all come from uswds v3.
• Similarly, there are likely some variables in formation's base/* imports that we either no longer need or do not want to use. We should take this opportunity to decomission some of these where we can by using the variables generated by css-library or inheriting from uswds v3.
• Given the above, we'll probably need to rename any variable usages in vets-website that use the old formation naming convention. For example, in Formation's b-variables.scss file there's a variable named $color-primary. In css-library the equivalent that gets generated is $vads-color-primary

[micahchiang]

Parking this draft PR here for now that removes shared-variables from vets-website - https://github.com/department-of-veterans-affairs/vets-website/pull/31184. It isn't mergeable for how many things it changes, but it could serve as a reference for how we approach things.

[micahchiang]

Leaving some more notes here:

• focus-gold-light-outline is used 4 times only in vets-website. It probably isn't worth it to import a whole mixin stylesheet just for this. We should look at refactoring

  

• media and media-maxwidth mixins are not imported often (~33 files) but are used heavily where they are imported