Improve app-wide responsiveness styling #212

New issue

Open

opened 2025-05-29 15:03:16 +00:00 by 2nPlusOne · 0 comments

2nPlusOne commented

2025-05-29 15:03:16 +00:00

(Migrated from github.com)

The only thing that has me curious wasn't something you added, but it was the w-11/12 and w-10/12 for small. This seems like an odd way to implement responsiveness and my gut says we might be better off using a combination of media query classes and min widths. That is, we design more specifically for those screen sizes of sm, md, lg, xl, and not everything in between.

Originally posted by @2nPlusOne in https://github.com/rit-sse/WebsiteTheSSEquel/pull/211#issuecomment-2918298568

This ticket encompasses addressing the "styling smell" (does that work as a term?) identified above by improving how tailwind classes are used to achieve responsiveness. Attention should be paid to following established norms (especially those found in the tailwind docs) for making site elements responsive with mobile-first design principles in mind.

> The only thing that has me curious wasn't something you added, but it was the w-11/12 and w-10/12 for small. This seems like an odd way to implement responsiveness and my gut says we might be better off using a combination of media query classes and min widths. That is, we design more specifically for those screen sizes of sm, md, lg, xl, and not everything in between. _Originally posted by @2nPlusOne in https://github.com/rit-sse/WebsiteTheSSEquel/pull/211#issuecomment-2918298568_ This ticket encompasses addressing the "styling smell" (does that work as a term?) identified above by improving how tailwind classes are used to achieve responsiveness. Attention should be paid to following established norms (especially those found in the tailwind docs) for making site elements responsive with mobile-first design principles in mind.