Repository navigation
Conversation
Introduce fluid spacing tokens in globals.css that scale linearly between the 402px and 1728px Figma frames: - gutter (24 → 64px): page side margins, header and footer insets - page-top (168 → 208px): top offset below the fixed header - section (96 → 176px): gap between page sections and before the footer - block (40 → 72px): gap between a section heading and its content Add `page-layout` / `page-container` utilities that cap content at 1440px through padding instead of max-width, so section backgrounds and ShapeLayers keep spanning the full viewport. Apply them to every existing page, replacing the per-page values (py-49/50/52/64, px-2/4/6/36, gap-20/24/38/60/75...). Drop `min-h-screen` + vertical centering from content sections so spacing no longer depends on the viewport height, use the shared Hero on Matricole, and align the hero title padding across Hero, Groups and Guides.
Contributor
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info
WalkthroughThe change adds shared fluid spacing tokens and page layout utilities, then applies them across route shells, listing pages, and reusable sections. Several page wrappers and spacing classes change. Matricole intro now uses the shared ChangesShared layout system
Priority: ⬇️ Low Change: Bug fix Merge Risk: ⚪ Minimal · up to
|
| Check name | Status | Explanation | Resolution |
|---|---|---|---|
| Docstring Coverage |  |
Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 50 functions across 53 files. (1 skipped: … | Write docstrings for the functions missing them to satisfy the coverage threshold. |
-
Check name Status Explanation Title check The title clearly and concisely describes the main change: standardizing page spacing with fluid layout utilities across pages. Linked Issues check Check skipped because no linked issues were found for this pull request. Out of Scope Changes check Check skipped because no linked issues were found for this pull request.
Full details: Docstring Coverage
-
Explanation
Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 50 functions across 53 files. (1 skipped: 1 unsupported.)
Resolution
Write docstrings for the functions missing them to satisfy the coverage threshold.
✨ Finishing Touches: 💡 1
-
📝 Generate docstrings: 💡
-
- Commit to this branch
- Create a new PR
-
- Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.
Comment @coderabbitai help to get the list of available commands.
* feat(chi-siamo): add "Su di noi" page Implement the "Su di noi" Figma page at /chi-siamo, the route the header already links to. The page is composed of existing components only (CardIcon, Card primitives, Glass, GradientIcon, Button, Shape/ShapeLayer) and uses the shared fluid spacing tokens (page-container, page-top, gap-section, gap-block). Sections: vision, problem, our answer, student path timeline, numbers, history/structure links and 5x1000 support. Background shapes follow the desktop Figma frame and are anchored per section; there is no mobile frame yet, so mobile has no shapes. * fix(chi-siamo): narrow the content column to the Figma width Content spanned up to 1440px, leaving only the fluid gutter (~50-60px on laptop screens) between it and the page edges. Override --container-page on this page so page-container caps it at 1200px like in Figma (262px margins on the 1728px frame). Adapt the number cards to the narrower column: tighter padding, Figma's unequal column proportions from xl, and the large icon only from 1xl, so labels stay on two lines. * style(chi-siamo): refine hierarchy cards and responsive layout * style(chi-siamo): remove eyebrows and restore section hierarchy --------- Co-authored-by: Bianca Roberta Ianosel <ianoselbiancaroberta02@gmail.com>
Conflicts resolved by keeping main's structure (shared animated background, no per-page shapes; collabora rebuilt from Figma; Figma-tuned Hero title padding) and reapplying this branch's fluid spacing tokens where they map mechanically (main/page layouts, chi-siamo sections, home hero, footer).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Unifies spacing across all existing pages with a small set of fluid spacing tokens, so the layout looks the same on every screen size instead of jumping at breakpoints.
Tokens (
src/styles/globals.css)Each value scales linearly between the 402px (mobile) and 1728px (desktop) Figma frames and is clamped outside that range:
gutterpage-topsectionblockThey work as regular spacing utilities (
px-gutter,pt-page-top,gap-section,gap-block, ...).Two helper utilities:
page-layout: for a page<main>(gutter + max width + top/bottom spacing)page-container: for a single full-width sectionBoth cap content at 1440px through padding, not
max-width.ShapeLayerclips horizontally to its section, so amax-widthwould cut the decorative shapes on wide screens.Changes
py-49/50/52/64,px-2/4/6/36,gap-20/24/38/60/75,md:mt-25.75, ...) with the tokens on every page: home, contact, collabora, faqs, associations, projects, matricole (+ guida), groups/guides landings, wizard, group/guide results, extra groups, 404.min-h-screen+ vertical centering from content sections (projects, home About Us, associations, collabora, contact, faqs). It made spacing depend on the viewport height. Kept full height only where it is intended: home hero, wizard, Guida della Matricola, 404.py-4mobile /py-14fromsm). Matricole uses the sharedHero. Groups and Guides landings use the same title styles.Measurements
Measured with headless Chromium on 13 routes at 390 / 768 / 1280 / 1728px:
section.Notes for review
This page is broken on mobilecomment on Collabora. At 390px it now has correct margins and no overflow. Please restore it if it referred to something else.