Bug - Developer resources > Global CSS variables page no longer exists

[sg00dwin]

https://staging.patternfly.org/developer-resources/global-css-variables

Results in several broken links within the Utility classes sections pointing to Breakpoints section.
https://staging.patternfly.org/utility-classes/accessibility#overview
https://staging.patternfly.org/utility-classes/alignment#overview
https://staging.patternfly.org/utility-classes/background-color#overview
https://staging.patternfly.org/utility-classes/display#overview
https://staging.patternfly.org/utility-classes/flex#overview
https://staging.patternfly.org/utility-classes/float#overview
https://staging.patternfly.org/utility-classes/sizing/ (6 links)
https://staging.patternfly.org/utility-classes/spacing#overview

[kmcfaul]

All tokens page can be a replacement, but may not be applicable in some cases (remove if so).

[mcoker]

This is probably known, but ideally we'd have something simple a user can reference for our breakpoint values. The only one I know of is in our upgrade guide - https://www.patternfly.org/get-started/upgrade/#4.-update-any-pixel-based-logic-for-breakpoints. Currently users will need to search for breakpoint tokens in the all tokens table.

Personally I'd love to see a page that has all of the top-level semantic tokens grouped by concept (breakpoints, box-shadows, spacers, colors, etc) and anchors to each section that we could link to, then the table can be referenced for more info. This would just be a page like you commonly find on design system sites for their token documentation.

Another idea could be to allow URL parameters to be passed to filter the table (like ?filter=breakpoint or ?filter=t--global--breakpoint or even something like ?layer=semantic&search=breakpoint.

[edonehoo]

@mcoker 💯 agree with you -- that crossed my mind as I was working on this. Simply linking to the all tokens page is better than a broken link, but still isn't very helpful (maybe not even obvious to search for 'breakpoint'). Like you said, even just a url param would help there.

But I dp like the idea of breaking apart the all tokens table into those conceptual groupings? Then you'd have something like Atlassian's approach:

Color tokens

Backgrounds

[table]

Icons

[table]

Would be a good follow-up issue I think, so that we could research a few ideas? Or even some user research to understand how people are interacting with the table in its current form