Update website to v11, @carbon/react

[tay1orjones]

This PR updates the website to use the newest version of gatsby, gatsby-theme-carbon, and related carbon dependencies for v11

Changelog

Changed

• update various dependencies
• update sass token usage to reflect changes made in v11

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/carbon-design-system/carbondesignsystem/HPqBbBaRjQ4RZeCQCxAsbiL5cH87
✅ Preview: https://carbondesignsystem-git-fork-tay1orj-bcf273-carbon-design-system.vercel.app

[tay1orjones]

@sstrubberg @alisonjoseph - @aledavila and I did not encounter the pictogram library and icon library issues you encountered in #2689 🎉

[tay1orjones]

I put a lot of reviewers on here - the more eyes the better! 👀 We've stepped through nearly every page and things seem to look good, but a thorough review is appreciated 🙏

[alisonjoseph]

@sstrubberg @alisonjoseph - @aledavila and I did not encounter the pictogram library and icon library issues you encountered in #2689 🎉

Awesome! Will take a look through tomorrow 💯

[tay1orjones]

@alisonjoseph Thanks! Just pushed up a couple commits that should fix all those items.

@theiliad Yeah, it looks like charts is using bx prefixed classes. Once charts updates to use the new cds prefix it should be fixed. Let me know if I can help!

[alisonjoseph]

Looks good (other than the charts issue Elliad pointed out) 👍

[tay1orjones]

Note that the grid demo page is totally borked. I can't fix it until carbon-design-system/carbon#10934 lands and is published (I'll cut a patch release for it ASAP).

The demo grids have to be scoped with a prefix, which I can't do without having the grid code included twice. Including it twice breaks other things due to it being farther down in the cascade.

Similar thing with the charts fix - it's reliant on updating an external dep.

Since this is merging into the v11 branch, I'd like to get the bulk of these changes in and carry these two issues forward. I'll issue follow-up PRs for them individually.

[tw15egan]

I believe we need to port over this fix

[tw15egan]

I reviewed a bunch of pages and didn't see any breaking bugs. Since this is going to the v11 branch, I'm good with it 👍🏻 ✅

[jnm2377]

Just some things I noticed:

• Feedback dialog styles are off. But this may be something we missed in GTC. I'm unsure.

(how it should be)

• In the homepage, the feedback dialog can't be opened at all, and it's opacity is less than 1 for some reason.

• some of the codesnippets that have file structures are no longer aligned. This feels nitpicky, sorry. But they're working correctly in the current site, so just wanna make sure we capture that somewhere to fix either now or later.

• Icon page and Pictogram page search bar is too small, and the dropdown has a dark line at the bottom now. The search bar sizing makes it so that you can see some of the content when you're scrolling.

(when scrolling)

(how it should be)

[laurenmrice]

I noticed a couple of things:

Community assets —> Component index page

• The Tags are getting a background color behind them and the tooltips on hover have been enlarged.

Guidelines —> Color page (Usage tab)

• A drop shadow has been put underneath the content switcher. A drop shadow shouldn’t appear until the page scrolls and content switcher is on top of the table.

Guidelines —> Icons and Pictograms page (Library tab)

• Tooltips have disappeared from the hoverable icon buttons to download and copy code.

[jnm2377]

A few more things:

• this actually seems like it might be an existing issue... when you're on the Community assets > Component index > Contribute a component tab, and you click the Next tile at the bottom of the page, it actually takes you to the previous as in the next and previous tile are both the same href.

• the data viz color palette component no longer has a visible focus state in the content switcher, neither when you click or tab thru

(this PR)

(how it should be)

[tay1orjones]

We're going to continue to address the remaining issues (and any more we find!) in the next sprint. In the meantime I'd like to continue to have other folks work on documentation and migration updates that require the v11 styles be in next.

So I'm going to merge this as is so we don't impede the other workstreams happening in parallel. All the follow-up items outlined above to be fixed next sprint have been documented in #2785

If any new issues are encountered, update that issue. It can be our living list of items to address for now.

[theiliad]

@tay1orjones, just cut out v0.55.0 in charts. Using that should solve the charting issues, hopefully...

[tay1orjones]

@theiliad Thank you! That fixes the chart pages 🎉