Update vf-focus mixin to properly support theming

[pastelcyborg]

Please note that this PR involves changing the params to vf-focus, so it could be considered a breaking change. However, I did a search for all uses of vf-focus across our Org and there are only a few sites using this mixin, all of them with the default params, so there should be no breakages there. I can't say the same for anyone using this mixin externally, of course.

Done

• Updated vf-focus mixin to support light and dark color params for proper theme usage
• Removed unused Sass focus color variables
• Drive-by: Fixed minor typos on examples

Fixes WD-13363

QA

• Open the following demos:
  • buttons alignment
  • side navigation variants
  • forms validation
  • links
  • base form
  • details
• Ensure focus outlines look as expected across all themes

Check if PR is ready for release

If this PR contains Vanilla SCSS code changes, it should contain the following changes to make sure it's ready for the release:

• PR should have one of the following labels to automatically categorise it in release notes:
  • Feature 🎁, Breaking Change 💣, Bug 🐛, Documentation 📝, Maintenance 🔨.
• Vanilla version in package.json should be updated relative to the most recent release, following semver convention:
  • if CSS class names are not changed it can be bugfix release (x.x.X)
  • if CSS class names are changed/added/removed it should be minor version (x.X.0)
  • see the wiki for more details
• Any changes to component class names (new patterns, variants, removed or added features) should be listed on the what's new page.

[webteam-app]

Demo

Jenkins

demos.haus

[jmuzina]

All visual differences are just a typo fix for contextual menu examples

[jmuzina]

This looks good, and I'm glad there's no usages of this that would be breaking in our org.

I'm still hesitant to release a breaking change in a minor version. Maybe we should put this one on hold until v5 unless there is something immediately requiring this to be merged?

[pastelcyborg]

This looks good, and I'm glad there's no usages of this that would be breaking in our org.

I'm still hesitant to release a breaking change in a minor version. Maybe we should put this one on hold until v5 unless there is something immediately requiring this to be merged?

I feel similarly. I'll leave this open until we can discuss with @bartaz but generally I concur.

[pastelcyborg]

Removed the "Breaking Change" label, as I've altered my approach following the advice of @bartaz to preserve and deprecate the existing vf_focus mixin.