refactor: Use CSS instead of JavaScript to align chart elements in dashboards

visualize-admin / visualization-tool

The tool for visualizing Swiss Open Government Data. Project ownership: Federal Office for the Environment FOEN

https://visualize.admin.ch

BSD 3-Clause "New" or "Revised" License

30 stars 3 forks source link

refactor: Use CSS instead of JavaScript to align chart elements in dashboards #1443

Closed bprusinowski closed 4 months ago

bprusinowski commented 5 months ago

Closes #1442

This PR swaps JS logic to keep chart elements in sync in the two columns of the Tall dashboard layout for CSS subgrid, which is both simpler and more performant.

As we have a nested layout and elements we want to align are not direct descendants of the grid layout that contains them (unavoidable due to e.g. drag and drop functionality), some of the container elements now use the contents display to make them "invisible" to the grid itself.

vercel[bot] commented 5 months ago

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	Apr 12, 2024 7:17am

bprusinowski commented 4 months ago

Thanks! We don't, I briefly tried to add one but had some problems with local GQL server not being accessible from Storybook. Maybe this could be a part of #1439?