Deploy to Production on Develop Push / deploy (push) Successful in 22sDetails
- Brand orange is now the official #FA7850 everywhere: folded the stray
oranges (#F2762E, #E8833A, #ff6b2c) into it and kept a single darker shade
(#E85D2A) for gradient depth + button hover. Added the official brand
--yellow (#FFE16E) token.
- Tablet header gap (769-1024px): the fixed header shrinks 80->60px there but
first-section paddings kept their 80px clearance; pull the first section up
by the 20px delta in that range only (phones untouched). Verified on
interior pages and the full-bleed homepage hero — gap now matches desktop,
no overlap.
- Re-stamped cache-bust (v=f95de694).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Deploy to Production on Develop Push / deploy (push) Successful in 20sDetails
- Add :root design tokens in _typography.css (was empty) — brand teal/orange,
ink/text greys, radius + type scale + section rhythm. Visually neutral;
new rules can reference var()s instead of scattered literals.
- a11y: visible :focus-visible ring on header nav + dropdown links (keyboard
users had none).
- Fix synthesized faux-bold: .route-report h1 800 -> 700 (Inter loads 400-700).
- Testimonials column: overflow-y scroll -> auto (no permanent scrollbar gutter).
- Lightbox image radius 6px -> 8px (matches the site rounding scale).
- Consistent card affordance: homepage .news-card now lifts on hover like the
news-hub / blog cards.
- Re-stamped cache-bust (v=1f64b22f).
Deferred (needs a brand decision): unifying the two primary oranges
(#FA7850 vs #F2762E) and the fuller literal->token migration.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
On phones the lightbox caption and "Read the story" button were pinned to the
screen bottom, cramped and overlapped by the floating "Ask MSOS" pill
(z-index above the lightbox). Now:
- lightbox becomes a centred column on <=600px: image -> button -> caption
flow directly under the photo instead of being absolutely bottom-pinned;
- image capped at 62vh so tall/portrait photos leave room for the button;
- the Ask-MSOS pill is hidden while the viewer is open (body.lightbox-open),
so it can no longer overlap the controls.
Desktop layout is unchanged.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Gallery flow:
- Album covers now open the photo lightbox directly (full album set), while
the title/"Read the story" link opens the article. Previously the whole card
linked to the article and photos were only at the bottom of it.
- Each album carries its full photo set in a hidden js-lightbox grid; added
main.js support for [data-lightbox-target] cover triggers.
- Added the missing main.js include on the gallery page (its lightbox, mobile
menu and language switcher never ran before).
- Lightbox gained an optional "Read the story ->" button (data-project-url /
data-project-label) shown only for gallery albums.
Watermark:
- Baked a subtle "(c) msosorg.com" watermark (bottom-right, sized per image)
into 114 of our own event/community photos. Stock/partner/logo/icon images
excluded. Clean originals backed up to images/_originals/ (git-ignored); the
script always re-derives from them so re-runs never stack.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- Reusable "Photos from the event" grid (shows 5 thumbnails + "+N more") that
opens a full-screen lightbox (arrows / keyboard / swipe / Esc); added to the
Meet Student Slovenia 2024 post as the pattern
- New css/components/_lightbox.css + setupLightbox() in main.js (injects one
shared overlay, wires any .js-lightbox grid)
- Mobile polish: gallery albums go single-column on phones, two on tablets;
event-gallery grid 3-up on mobile; lightbox sizing/controls tuned for small
screens
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
popovskik