processing / p5.js-website-legacy

Archived p5.js website 2015-2024
http://archive.p5js.org
MIT License
240 stars 484 forks source link

Sister site navigation not available on phones/smaller screens. #1495

Open HrxSrv opened 8 months ago

HrxSrv commented 8 months ago

Most appropriate sections of the p5.js website?

Every Page of p5js.org

What is your operating system?

Windows

Web browser and version

Google Chrome 120.0.6099.217 (Official Build) (64-bit) (cohort: Stable)

Actual Behavior

The sister-site navigation bar gets hidden whenever the screen-size gets <= 780px, making it impossible on mobile phones to navigate between the sister sites of the processing foundation or to see the promo banner. Screenshot 2024-01-20 175904

Expected Behavior

The sister-sites navbar should be visible accross all dimensions of the website. Following layout should be consistent across all dimensions Screenshot 2024-01-20 175943 To maintain the aesthetics and usability this navbar can also be stuffed in the hamburger menu on screen size <=780px.

Steps to reproduce

On Screen size <=780px: Open the p5js.org, sister-site navbar and promo banner are hidden. On Screens with size >780px: Open p5js.org page and inspect it on a lower screen size i.e <=780px or untill the navbar goes hidden.

Would you like to work on the issue?

I would really like to work on this issue and i have already dug some probable solutions for this.

shardulgawande27 commented 8 months ago

/attempt #1495