Redesign About page (Design 1E) in the QuantEcon brand#234
Conversation
Rebuild /about/ from a flat Markdown list into the card-based Design 1E layout, recoloured to the four QuantEcon logo colours instead of the mockup's generic rainbow. - Convert pages/about.md -> pages/about.html (still renders through the existing default layout, real header/footer, and .container) - Add assets/sass/_about.scss: mission card with a logo-gradient rail, accent-bordered "What we do" grid, coloured-dot History timeline, and a supporting-card row (fiscal sponsorship / get involved / contact) - Brand accents pull from the global --qe-* custom properties (red, yellow, green, blue); the mission and Infrastructure rails echo the equalizer logo - Load Exo 2 weights 300/600/700 so the mission headline renders as designed (light weight with a bold inline emphasis) - Whole "What we do" cards link through to their sections; real hrefs wired - History trimmed to four concise milestones (dates informed by the Infrastructure page rather than duplicating it) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
✅ Deploy Preview for grand-swan-ca5201 ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
There was a problem hiding this comment.
Pull request overview
This PR redesigns the QuantEcon About page to use the card-based “Design 1E” layout and aligns the styling with QuantEcon’s brand color tokens and typography.
Changes:
- Replaces
pages/about.mdwith a structuredpages/about.htmlimplementation while keeping the/about/permalink anddefaultlayout. - Adds a new page-specific Sass partial (
assets/sass/_about.scss) and wires it into the global stylesheet. - Expands the Google Fonts import to include additional Exo 2 weights needed by the new layout.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
pages/about.md |
Removes the prior flat Markdown About page content. |
pages/about.html |
Introduces the new card-based About page markup and section structure. |
assets/sass/_about.scss |
Adds dedicated styling for the new About page layout and components. |
assets/main.scss |
Registers the new About Sass partial and adds Exo 2 font weights. |
Drop the red/yellow/green/blue cycling on the "What we do" grid (and the rainbow rail on the full-width Infrastructure card) in favour of one QE brand-blue accent, so the mission card's logo-gradient rail stays the only multi-colour moment on the page. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Drop the per-entry colour cycling on the timeline dots and year labels so they match the "What we do" cards; the mission rail stays the only multi-colour element. Removes the now-unused --accent custom property. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Replace the dark slate "Get involved" card with a light blue-tinted surface (--dark modifier renamed to --highlight) so it stays distinct as the action card without the visual weight of a dark block. CTA now uses the standard link blue. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
@DrDrij what do you think of this improvement to the https://deploy-preview-234--grand-swan-ca5201.netlify.app/about/ @jstac re: history of grants I was thinking of just having date spans for organisations that have supported us like Sloan |
Address Copilot review on #234: keyboard users had only the browser default outline on the whole-card "What we do" links and the "Get involved" CTA. Add explicit :focus-visible outlines (blue, offset), matching the existing focus-visible convention in main.scss. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
Looks great @mmcky ! Can we please add schmidt futures? they gave us $275,000 USD in march 2020. if it doesn't fit nicely in that timeline we could just mention after that we've been supported by them as well. |
thanks @jstac will definitely add Schmidt Future. Just trying to find dates -- takes a bit of digging. Hoping that will change soon with our vault :-) Thanks for the March 2020 info. |
|
Thanks @mmcky . As mentioned, we received it in March 2020. I also had to dig a bit to find that... |
Rebuilds the About page (
/about/) from a flat Markdown list into the card-based Design 1E layout, recoloured from the mockup's generic rainbow to the four real QuantEcon logo colours (red#D25663· yellow#FCC837· green#6EAC5B· blue#1364AC).What changed
pages/about.md→pages/about.html. Same permalink/about/, still renders through the existingdefaultlayout — real header, footer, and.container. No mockup shell/navbar.assets/sass/_about.scsspartial (registered via@use 'about'inmain.scss).300;600;700to the Google Fonts import so the mission headline renders as designed (light weight with a bold inline emphasis).Layout (top → bottom)
red→yellow→green→blue), "Our mission" eyebrow, light Exo 2 headline with bold inline emphasis.Implementation notes
--qe-*custom properties already defined on:rootinmain.scss, so the page stays in sync with the brand tokens.Content to confirm before merge
The history/grants copy is a concise first pass — happy to refine the wording and exact Sloan grant details with the team (per our discussion, this is a starting point, not final).
🤖 Generated with Claude Code