Refactor Show/Hide component usage in layouts

[wackerow]

⚠️ Note: Builds on Next.js -> Do not merge until Next.js fork has been fully merged

Description

Usage of Chakra-UI Show and Hide components causing layout shifting when a page loads, since these components are built on the server where the width of the display is not yet known.

• Updates usage within all "layout" components to use hideBelow and/or hideFrom, removing usage of Hide and Show
• Added these directly to the shared components as their usage for mobile vs desktop does not change

[netlify]

✅ Deploy Preview for ethereumorg ready!

Name	Link
🔨 Latest commit	28a429f
🔍 Latest deploy log	https://app.netlify.com/sites/ethereumorg/deploys/659ef24dc862180009b0977f
😎 Deploy Preview	https://deploy-preview-11903--ethereumorg.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[corwintines]

Awesome 🚀

[gitpoap-bot]

Congrats, your important contribution to this open-source project has earned you a GitPOAP!

Be sure to join the Ethereum.org discord if you are interested in contributing further to the project or have any questions for the team.

GitPOAP: 2024 Ethereum.org Contributor:

Head to gitpoap.io & connect your GitHub account to mint!

Learn more about GitPOAPs here.

[MALIKSHAHID786]

Pending payments