search

loolabs / waterpark

Waterloo's social park
http://waterpark.loo-labs.vercel.app
ISC License
4 stars 0 forks source link

💻 Make navbar responsive on mobile #173

Closed evtyz closed 3 years ago

evtyz commented 3 years ago

Screenshots

Before:

image

After:

Tablet:

image

Phone: (This is animated but the screenshot is still)

image

Purpose

The navbar was not responsive on devices with smaller screen width. This closes #172.

Approach

Media queries to reduce margin and font size were used for tablets. I created another div for the mobile dropdown and some CSS transitions for phones.

Testing

Via visual inspection.

vercel[bot] commented 3 years ago

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/loo-labs/waterpark/EAWa5wGLwz6KNVTRsvw5etYmmdLR
✅ Preview: https://waterpark-git-172-fix-navbar-mobile-loo-labs.vercel.app

evtyz commented 3 years ago

Vercel preview is screwed up, idk why...