Remove miscellaneous css custom properties

[lgriffee]

WHY are these changes introduced?

Fixes #4589

The following tokens (see table below) were made to rollout the design language changes in 2020 and should no longer be used.

WHAT is this pull request doing?

Swapping the following tokens for equivalent values or completely removing the value and associated css property.

token	value
--p-override-none	none
--p-override-transparent	transparent
--p-override-one	1
--p-override-visible	visible
--p-override-zero	0
--p-non-null-content	''
--p-badge-mix-blend-mode	luminosity
--p-range-slider-thumb-scale	1.5

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

Copy-paste this code in playground/Playground.tsx:

import React from 'react';
import {Page} from '../src';

export function Playground() {
  return (
    <Page title="Playground">
      {/* Add the code you want to test in here */}
    </Page>
  );
}

🎩 checklist

• Tested on mobile
• Tested on multiple browsers
• Tested for accessibility
• Updated the component's README.md with documentation changes
• Tophatted documentation changes in the style guide
• For visual design changes, ping @ sarahill to update the Polaris UI kit

[github-actions]

size-limit report

Path	Size
cjs	165.98 KB (-0.07% 🔽)
esm	96.55 KB (-0.1% 🔽)
esnext	143.12 KB (-0.29% 🔽)
css	34.29 KB (-0.9% 🔽)

[alex-page]

This looks great @lgriffee. I am unsure if we can remove some of these values all together or if they override another value in the CSS cascade. Would you be able to take a look?

[lgriffee]

Removing unused class. Here's the legacy commit from when it was added

[alex-page]

Amazing! Thanks for the context Laura. I think it makes sense to remove this code.

[alex-page]

Do we need the HTML element with .ContentWrapper classname? Or can we flatten this components HTML?

[lgriffee]

I don't think we need it—I can consolidate its relevant CSS into .Breadcrumb and replace its HTML with a shorthand fragment so that contentMarkup still has one parent element (which you can check out in this commit).

[lgriffee]

Also along the line of consolidation I just want to note that there might be more rollback values that need to be removed in these files. Not sure if there was work done already to remove them so it’s definitely possible that they are needed overrides. I didn’t look into them in this PR to keep a narrow scope. But if it’s something important to address now or in the future I can create a ticket to look into it.

[alex-page]

Awesome work @lgriffee. I had one question but this looks great 💯. It looks like you have a conflict with the UNRELEASED.md file let me know if you need help resolving that!

[aveline]

This looks great @lgriffee!

[kyledurand]

Looks good just a few comments. I'll 🎩 now

[kyledurand]

Sorry about the delay 🎩 ing. I ran into a nix issue with dev last night and got distracted with other things. This looks great! Excellent clean up. The only thing I noticed via chromatic is that the breadcrumb back button is slightly wider but I think it's an improvement now that it's perfectly square 👍

I left a note about removing one more sass var that appears to be unused, and unreleased has some entries that can snuck in by a rebase probable but otherwise 🚢 !