feat: Editor & chart tabs UI improvements

[bprusinowski]

This PR:

• fixes ghost top rectangle in the homepage example charts,
• aligns editor and layouting page layouts,
• improves chart tabs scroll behavior,
• adds some Accent improvements.

Also see the Figma file.

How to test

1. Go to this link.
2. Add a new chart.
3. Go to layouting step.
4. ✅ See that the general page layouts are aligned between both steps.
5. Go back to the editing mode.
6. Add more charts until they no longer fit on the screen (or resize browser window to achieve the same effect).
7. ✅ See that scroll buttons appeared and can be used to horizontally scroll the tabs.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
visualization-tool	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 2, 2024 3:29pm

[noahonyejese]

nice, like this it should be clear how to set up accent in the future, you could add the cmd for temporary add, but it's not necessary since you added .env to .gitignore this is optional. 👍

ACCENT_API_KEY=-YOUR_ACCENT_KEY yarn run locales:pull

[noahonyejese]

LGTM! 👍

[bprusinowski]

Yup, good point – I added the inline version to README 👍