Files
overleaf-cep/services/web/frontend/stylesheets
Antoine Clausse 8fcf007a73 [web] plans-2026: responsive card layout (mobile 1-col, md 2-col, lg 4-col) (#32905)
* plans-2026: wrap cards to 2-col at md, 4-col at lg

Replaces horizontal scroll at md/lg with a wrapping CSS grid so cards
stack in rows instead of requiring horizontal scrolling. The 4-column
layout now kicks in at lg (~992px) rather than xl (~1200px).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

* plans-2026: replace mobile horizontal scroll with 1-col stack

Removes the overflow-x scroll behaviour at xs/sm (and the
scrollbar-overlap margin/padding hack that came with it). Cards now
stack in a single column on small screens, consistent with the
2-col/4-col grid above.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

* Fix lint

* plans-2026: fix student mode 2-col at lg, remove mobile min-width

Student-mode 2-col override was only kicking in at xl; move it to lg so
the two visible cards (free + student) fill the row correctly. Also drop
the 280px min-width on .plans-card-col — now that mobile uses a 1-col
grid instead of horizontal scroll, it causes unnecessary overflow on
narrow viewports.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

* Update breakpoint for plans cards layout to lg for improved responsiveness

---------

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
GitOrigin-RevId: 5ef923dd3795353bd946c1857e78f4b5f7063ab0
2026-04-27 08:06:09 +00:00
..
2026-04-14 08:05:15 +00:00
2025-11-03 09:05:57 +00:00