Implement legacy naming for old color palette

[dancormier]

Note
This PR is targeted to merge into stacks-next, our long-lived branch intended for our v2 release

tl;dr: This PR removes the new prefix from all new colors, adds the legacy prefix to old colors, refines much of the theme generation, and updates docs. It builds from the previous related PR: #1415

Overview of changes

Color naming

• New colors no longer include the new suffix
• All old colors now include the legacy suffix
• All references to legacy, new colors updated
• Internally, legacy and new colors are now referred to as v1 and v2 respectively

Docs

• New docs pages have dropped the (new) label
• Legacy docs pages have gained the (legacy) label and have been moved to v1/ path
• New utility color classes (.fc-*, .bc-*, .bg-*) are now entirely documented on the colors docs page

Other

• Moved new color files out of new directories, moved legacy into v1 directories
• Classes previously tied to legacy color generation (such as *-transparent) have been moved to new color generation
• Resolved any issues with color generation

The most relevant changes

Note
The only changes to all files within lib/components should be updating references to legacy colors

Since this PR touches so many files, I figured it may be helpful to highlight files with the most relevant and significant changes:

• lib/atomic/color.less
  • lib/atomic/snapshots/color.less.test.ts.snap
• lib/exports/color.less
  • lib/exports/snapshots/color.less.test.ts.snap
• lib/exports/color-mixins.less
• lib/exports/color-sets.less
• lib/exports/v1/constants-colors.less
  • lib/exports/v1/snapshots/constants-colors.less.test.ts.snap

Removing the new suffix to new colors

All new colors no longer include the new suffix

/* New */
--white: …;
--black-200: …;
--theme-base-primary-color-h: …;
.fc-theme-primary-400 { … }

Adding the legacy suffix to old colors

All old colors now include the legacy suffix. References to these colors have been updated.

/* Legacy */
--white-legacy: …;
--black-legacy-200: …;
--theme-base-primary-color-legacy-h: …;
.fc-theme-primary-legacy-400 { … }

New colors

New colors should match the Figma. See the new Colors docs page for more details.

[netlify]

✅ Deploy Preview for stacks ready!

Name	Link
🔨 Latest commit	c95d86a
🔍 Latest deploy log	https://app.netlify.com/sites/stacks/deploys/64dd1a7fc1d57f000820b7ce
😎 Deploy Preview	https://deploy-preview-1440--stacks.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[giamir]

Github just lost my PR review summary. Need to retype everything now. 🙃

tldr: looks good, I left few comments but nothing major. Great work 🎉

One note about migration guide:
How did you find all the occurrence that needed to obtain the legacy suffix across the codebase? CMD+F on all atomic classes and css variables?
I think your approach might be worth documenting in a migration guide draft since in Core they will need to go through the exact same process most likely.

[dancormier]

Github just lost my PR review summary. Need to retype everything now. 🙃

Ugh! That's the worst. I've had my prayers to the local storage gods go unheeded before. Feels bad!

One note about migration guide: How did you find all the occurrence that needed to obtain the legacy suffix across the codebase? CMD+F on all atomic classes and css variables? I think your approach might be worth documenting in a migration guide draft since in Core they will need to go through the exact same process most likely.

Good call. I used a few regexes and kinda just went file-by-file on what they found. I figure creating the migration guide will take a little thoughtfulness, so I've made a ticket for now. IMO, that ticket can be a good holding place for any ideas or tips we want to jot down without the overhead of adding it to the README.

[dancormier]

I noticed one minor issue: theme color values are not being overridden in high contrast mode.

We should expect the theme colors to match orange/blue for primary/secondary when in high contrast mode, regardless of custom theming. It should be an easy fix. I'll add it into this branch shortly then merge.