Convert the Hub / Become-a-member carousels from a pure-CSS marquee to a
JS-driven scroller with click-and-drag, touch swipe, and progress dots
(setupHubCarousel). Turn the "ways to be part of MSOS" cards into hub-style
photo cards and add the final Become-a-member photos (WebP).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Convert the fixed 6-card grid in the "There is more than one way to be
part of MSOS" section into the Hub's auto-scrolling marquee, reusing the
existing .hub-carousel mechanics with icon-based gradient cards. Applied
across EN/MK/SI.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
A privacy-friendly help widget that answers visitor questions from the
site's own content and links to the full page — runs 100% in the browser,
no API, no server, no per-token cost.
- tools/build_search_index.py: parses every EN/MK/SI page into ~720
heading-level chunks per language -> assistant/index-<lang>.json
(lazy-loaded only when the chat is opened; gzips to ~80 KB).
- assistant.js: dependency-free BM25 search + multilingual stopword
filtering + a curated short-answer layer for common questions, plus an
accessible chat widget (role=dialog, keyboard, aria). CSP-safe (self only).
- assistant.css: scoped .msa-* styles in the site's teal palette;
responsive (full-screen panel on mobile).
- Injected on 208 pages (blog WIP excluded; picks it up when that lands).
Verified in a headless browser across EN/MK/SI: curated answers, search
fallback with correct ranking (rare terms win), correct deep links,
Cyrillic + Slovene diacritics, and zero console errors. Curated MK/SI
answers are machine-drafted — proofread before launch.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Site-wide health pass (excludes in-progress blog work). Verified with a
local server + headless browser: Timeline, homepage and gallery pages load
with zero console errors and no layout distortion.
Render bugs
- Timeline page (en/mk/si): fix ../../../ paths that overshot the site root,
so the main stylesheet and hero image load again.
- Meet Student Slovenia 2023 (en/mk/si): remove a <figure> referencing
event3-photo-11.png, an image that was never uploaded (broken image).
Performance
- Add intrinsic width/height to 1039 raster <img> tags to prevent layout
shift (CLS); 450 SVGs correctly skipped. Add a global
`img { max-width:100%; height:auto }` safety net so aspect ratio is
preserved and images never overflow.
- Preload the homepage hero (LCP) image on en/mk/si.
- Load Font Awesome non-blocking (media=print/onload swap) with a <noscript>
fallback, on 225 pages.
Accessibility
- Add aria-label to 57 unlabeled newsletter email inputs.
- Add an sr-only <h1> to the three "My Route" pages (had no h1).
- Add an .sr-only utility class.
SEO
- Add meta descriptions to legal/msos-hub/support pages (en/mk/si).
Note: MK/SI meta descriptions are machine-drafted and should be proofread
by a native speaker before considering them final.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- New multilingual Gallery page (en/mk/si) with 9 event albums and a
keyboard-accessible lightbox (prev/next scoped per album)
- Reuses existing event photos; links each album to its event post
- New css/pages/_gallery.css + setupGallery() lightbox in main.js
- "Gallery" link added to the "What We Do" nav (desktop + mobile) site-wide
- Gallery URLs added to sitemap.xml with hreflang
- Landing "Every Student Has a Story": removed backdrop blur on the video
thumbnail, kept the bluish gradient tint
Note: images/original/ (458 MB of raw source photos, gitignored + unused by
the site) moved out of the working tree to reclaim disk.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
MSOS Hub page:
- "What you can do here": Porsche-style vertical image cards in a
continuous auto-scrolling marquee with edge fades (real photos placeholders)
- "A glimpse of the space": full-bleed band of 4 connected photos
- "A space we built together": full-bleed image banner with blue gradient overlay
- "Made possible by": partner logo tiles (Cultural Association + Ministry);
processed Ministry + Cultural Association logos from source art
- Copy/spacing polish; removed em-dashes; larger section spacing; deeper
final-CTA gradient so it no longer blends into the footer
Branding / partners:
- Per-language MSOS logos (SVG) in header + footer across all pages
- Partner carousel: added Ministry (wide variant), Cultural Association,
Embassy of North Macedonia, and Spletni Mojster (width-capped); de-duplicated
logos within each marquee group so new logos appear sooner
Footer:
- Build credit line (Spletni Mojster + Kristijan), clean centered text
- Synced MK/SI footers to EN (added missing About us + Timeline links)
Landing page:
- FAQ short CTA already avatar design (FAQ page kept its Email/Viber block)
- Swapped blurry stock video thumbnail for the real team photo
- Removed the intentional hero-background blur
Navigation:
- Mobile menu: use 100dvh so the language selector is reachable with submenus open
- Desktop: dropdown parents no longer navigate to dead "/#" links
Language suggestion banner:
- Dismissible, browser-language based banner suggesting the matching locale;
remembers choice in localStorage and waits for the cookie-consent choice
to avoid overlapping the consent card
Removed stale *.html.bak backup files.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
New legal/registration reference page at /{lang}/legal/ with the official
details: legal name, registered office, registration number (4128133000),
tax number (44932448), VAT status, SKIS activity, registration date, bank
(NLB d.d.), IBAN SI56 0284 3026 6115 703, SWIFT LJBASI2X, representative,
and contact. New css/pages/_legal.css. Linked as "Official information" in
the footer legal bar on all pages.
Also fills the Support page's bank-transfer card with the same real IBAN/
bank/SWIFT (placeholders removed). SEO block + hreflang + sitemap (210
pages) regenerated.
MK/SI labels AI-drafted -> native review. SWIFT LJBASI2X is inferred from
the IBAN bank code (02 = NLB) -> please double-check.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
A promo page for the MSOS Hub — a renovated community/event space in
Ljubljana for gatherings up to 50 people. Sections: hero with quick facts,
the funding/partner story (Ministry of Foreign Affairs and Trade of North
Macedonia, Municipality of Ljubljana, Macedonian Cultural Association
"Macedonia"), what you can do here, what's inside (amenities), an image
placeholder gallery (photos pending — captioned), "made possible by", and a
booking CTA (mailto info@msosorg.com). New css/pages/_hub.css.
'MSOS Hub' added to the Who We Are dropdown (desktop + mobile) on all pages.
SEO block + hreflang + sitemap (207 pages) regenerated.
MK/SI translations are AI-drafted -> native review. Real photos to replace
the captioned placeholders when available.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
New donation/partnership landing page telling the MSOS story of being
community-built: hero, "built by the community" narrative, four ways to
support (partner/sponsor, donate, offer skills/space, spread the word),
"where your support goes" impact, a bank-transfer card (placeholder IBAN/
bank/SWIFT for the org to fill in), a partners thank-you marquee, and a
contact CTA (mailto info@msosorg.com). New css/pages/_support.css.
The header "Support MSOS" button (previously a dead <button>) now links to
/{lang}/support/ on all pages. SEO block + hreflang + sitemap regenerated.
MK/SI translations are AI-drafted -> native review. Bank details are
placeholders pending real IBAN/SWIFT.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- Remove the duplicate Privacy/Cookie links from the footer Organisation
column; keep them (plus Manage cookies) in the bottom legal bar
- Show both info@msosorg.com and info.msosorg@gmail.com in the privacy +
cookie policy prose (en/mk/si)
- Fix the privacy policy's now-false "no tracking cookies" sentence to
reflect consent-based Google Analytics (en/mk/si)
MK/SI policy text is AI-drafted -> native review.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Adds a per-language "Manage cookies" link to the footer legal bar on all
201 pages, wired to window.msosOpenConsent() so visitors can change or
withdraw their choice at any time (GDPR requirement). Verified: decline ->
re-open via link -> accept flips analytics consent to granted.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- consent.js: self-contained, non-blocking bottom banner in EN/MK/SI,
remembers the choice in localStorage, links to the per-language cookie
policy. Accept -> gtag consent 'update' granted; Decline stays denied.
- Head GA snippet restores a returning visitor's prior "granted" choice
before the first hit; loads /consent.js on every page.
- Re-openable via window.msosOpenConsent() for a "manage cookies" link.
Verified in-browser: shows for new visitors, Accept grants + remembers,
reload keeps consent without re-prompting, Slovene text + /si/ policy link.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- gtag.js injected on all 201 pages via tools/seo_inject.py + on 404.html
- Consent Mode v2 defaults all storage to 'denied' (EEA-safe: tag loads,
no tracking cookies until a consent banner grants analytics_storage)
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- Add branded 1200x630 og-default.jpg; article pages use their hero as
og:image, others use the default
- Wire the existing (previously unlinked) favicon set into every page
- Add branded 404.html with root-absolute paths + noindex
- Emit Article + localized BreadcrumbList JSON-LD on all article pages
- Convert 74 heavy served photos to WebP (28MB -> 8.5MB, -70%), rewrite
references, add loading=lazy/decoding=async to below-fold images and
fetchpriority=high to heroes (protect LCP)
- Stop tracking images/original/ (458MB of unused source masters; kept on
disk, gitignored) and ignore .playwright-mcp/
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
SEO (all 201 pages, en/mk/si):
- Inject canonical, hreflang (en/mk/sl + x-default), Open Graph, Twitter
cards and Organization JSON-LD via idempotent SEO:START/END block
- Generate multilingual sitemap.xml (xhtml:link alternates) + robots.txt
- Curated meta descriptions for lead-less pages (home, become-a-member,
faq, news hub, my-route); every page now has a description
- Absolute URLs target final domain msosorg.com, not the temp host
- Add reusable tools/seo_inject.py (+ README)
Content fixes:
- Translate about-us and timeline-and-milestones into MK + SI, wire up
their pages, and repair the previously-dead "Who We Are" nav links
across all mk/si pages
- Remove duplicate en/projects/makedonska-studentska-vecer-vo-ljubljana
(unreferenced; already covered by macedonian-student-night-in-ljubljana)
Locale correctness:
- Normalise Slovene pages to <html lang="sl"> (correct ISO 639-1)
- Map sl->si in main.js so the language-switcher highlight and newsletter
i18n keep working on Slovene pages (data-lang="si" still maps to /si/)
MK/SI translations and descriptions are AI-drafted; flag for native review.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Navigation
- Replace "Donate" with a "Support MSOS ❤️" CTA site-wide
- Remove dead nav links (Gallery, Press releases)
- Turn the one-item News dropdown into a direct link
Homepage
- Replace the non-functional "Become part" contact form with a
"Find your people in Slovenia" join CTA (blue/white gradient band,
orange button, photo collage), in all three languages
- Fix the placeholder Activities subtitle
- Redesign Activities into card-style tabs with icons; move per-tab
content into HTML panels and switch by index so the tabs work in
every language (MK/SI tabs were previously dead)
Newsletter (MailerLite)
- Add the subscribe block to the News hub, news articles, and every
events/projects page and hub, in all three languages
- Resize/rebalance the block, shrink the privacy line, add top spacing
- Standardise on honest copy (drop the "2,000+ subscribers" claim)
- Load main.js on the News hub pages (they shipped without it, so the
form and header dropdowns didn't work there)
- Fix a dead privacy-policy link on the makedonska-vecer page
- Document the signup convention in docs/newsletter-signup.md
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Why become a member
- Rebuild the benefits grid as a 3x3 bento: 7 icon cards + 2 real event photos
(with captions), fixes the orphan card, adds hover motion. Swap the blank
fa-house-heart (Pro) for fa-house-user (Free) on "Feel at home".
Join form
- Merge the duplicate "There is a place for you here" section into the form's
path step (student / supporter cards now carry the descriptions); drop the
separate section. New heading "There is a place for you here"; centred layout.
- Redesign the choice cards: colour-coded (student orange / supporter teal)
icon circles, descriptions, hover lift + "Choose this" reveal.
- Fix the stray "Support MSOS" submit button showing on the path step.
Conversion + polish
- Floating "Become a member" CTA that appears after the hero and hides near the
form/final CTA, so the ask stays reachable without scrolling to the bottom.
- More space between section titles and their cards (numbers, reals, tests,
showcase, benefits).
- Testimonials: Elena -> Katerina (Koper); un-swap Ana (Maribor) and Marko
(Ljubljana); remove the "sample quotes" placeholder note.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- Hero gradient now spans edge to edge (full-viewport ::before band behind the
centred content) and is more colourful/on-brand (warm peach to soft teal).
- Both hero CTAs (Become a member / See what we do) share one size so they align.
- Add hover (lift + shadow + colour shift) and active (press) states to the
reusable .btn classes, so all buttons site-wide get consistent feedback; plus
a focus-visible outline for keyboard users.
- Remove the confusing Community/Events/Support/... tag pills (they duplicated
the hero lead sentence). member.js updated + now emits main.js on the member
pages so regeneration keeps the nav working.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The "Get Involved" dropdown (Become a member / Support MSOS) had dead href="#"
links and only duplicated the two top-right buttons (Become a member, Donate).
Removed it site-wide (desktop + mobile, en/si/mk) - 390 blocks across 195 pages,
including the privacy-policy header the generators slice from, so regeneration
stays clean. Nav is now Who We Are / What We Do / For Students / News + the two
pill buttons.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Mobile fixes (article, guide, get-to-know, projects pages):
- Remove duplicate main.js include site-wide. footer.js emitted a
<script src=main.js> inside the footer block while pages also load one
before </body>, so DOMContentLoaded ran twice and every tap toggled the
mobile menu / article TOC twice (net no-op). Menu and TOC only worked on
the homepage. Now exactly one main.js per page, before </body>.
- Kill horizontal overflow: add overflow-x: clip to html/body (clips the
off-canvas mobile nav panel without breaking position: sticky, unlike
overflow-x: hidden).
- Reset align-items to stretch in the mobile .article-layout-container
rule; the desktop flex-start made .article-container size to max-content
width in a column flexbox and overflow the viewport.
Membership form hardening (Become a Member):
- Honeypot field + localStorage cooldown (30s gap, max 3/24h) + stronger
email regex; trilingual cooldown alert message.
- Apps Script (setup doc): per-email auto-reply dedupe + daily send cap;
applicant reply is a plain thank-you that never echoes submitted answers.
- Draft HTML welcome email (email-welcome-preview.html) for later use.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
New trilingual /<lang>/become-a-member/ conversion page: hero with real-photo collage, why-join benefits, animated MSOS-in-numbers, ways to participate, membership-in-real-life and projects showcase (real project photos), testimonials, who-can-join, an adaptive multi-step form (student + supporter flows, conditional fields, progress, personalised messages, validation, success screen), FAQ and final CTA. Site-wide 'Become a member' buttons now link here. Form posts to a Google Form once wired; metrics/testimonials are placeholders to confirm.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
popovskik