About Us "Through the years": retitle, redesign names, thank-you note

- Renamed the section from "Our members & friends" to "Through the years"
  (Низ годините / Skozi leta) — a retrospective framing that honours everyone
  who has been part of MSOS without labelling anyone a current member or friend.
  Updated title, marquee aria-label, image alt text and the dev comment.
- Removed dashes from the hero intro, section intro and closing note.
- Replaced the placeholder names with the full list of 74 contributors, kept
  the original five, sorted alphabetically per language (Latin for EN/SI,
  Macedonian Cyrillic with native collation for MK).
- New design for the names: a clean multi-column credits wall (accent dot,
  hairline rows, hover) instead of pill chips (css/pages/_about.css).
- Added a thank-you note to members past, present and future, and to everyone
  who has volunteered, contributed or supported MSOS. EN/MK/SI.

MK/SI copy is AI-drafted and pending a native proofread.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
popovskikandClaude Opus 4.8 committed 2026-08-08 00:57:53 +02:00
1 parent a15e9f20f1
commit 91d29121c0
4 files changed
+319 -100

No files matched your search

+98 -29
View File
@@ -214,7 +214,7 @@
<div class="about-hero-content">
<span class="about-hero-eyebrow">About us</span>
<h1>Our team, mission, vision & core values</h1>
<p class="about-hero-lead">MSOS is more than an organization - it is the energy of the team behind it. Our members are the heart and driving force that inspires us, writing this story and shaping student life in Slovenia.</p>
<p class="about-hero-lead">MSOS is more than an organization, it is the energy of the team behind it. Our members are the heart and driving force that inspires us, writing this story and shaping student life in Slovenia.</p>
</div>
</section>
@@ -362,37 +362,37 @@
</section>
<!-- FAQ Call to Action Section -->
<!-- Appreciation to members & friends (names pending full list) -->
<!-- MSOS through the years (names pending full list) -->
<section class="appreciation-section">
<div class="appr-intro">
<h2>Our members & friends</h2>
<p class="appr-lead">MSOS is its people. With gratitude to everyone who has been part of our story — and everyone still writing it with us.</p>
<h2>Through the years</h2>
<p class="appr-lead">MSOS is its people. With gratitude to everyone who has been part of our story, and everyone still writing it with us.</p>
</div>
<!-- Scrolling photo carousel (Apple-style focal zoom) -->
<div class="appr-marquee" aria-label="MSOS members and friends">
<div class="appr-marquee" aria-label="MSOS through the years">
<div class="appr-track">
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-05.webp" width="690" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-06.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-07.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-08.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-09.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-03.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-10.webp" width="600" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-11.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-12.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-13.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-04.webp" width="900" height="675" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-14.webp" width="900" height="675" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-15.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-16.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-17.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-18.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-19.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-20.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-21.webp" width="675" height="900" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-22.webp" width="900" height="600" alt="MSOS members and friends"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-05.webp" width="690" height="900" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-06.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-07.webp" width="675" height="900" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-08.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-09.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-03.webp" width="675" height="900" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-10.webp" width="600" height="900" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-11.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-12.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-13.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-04.webp" width="900" height="675" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-14.webp" width="900" height="675" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-15.webp" width="675" height="900" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-16.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-17.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-18.webp" width="675" height="900" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-19.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-20.webp" width="900" height="600" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-21.webp" width="675" height="900" alt="MSOS through the years"></div>
<div class="appr-card"><img loading="lazy" decoding="async" src="../../images/members-22.webp" width="900" height="600" alt="MSOS through the years"></div>
<!-- duplicate set for a seamless infinite loop (aria-hidden) -->
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-01.webp" width="900" height="675" alt=""></div>
<div class="appr-card" aria-hidden="true"><img loading="lazy" decoding="async" src="../../images/members-02.webp" width="900" height="600" alt=""></div>
@@ -421,13 +421,82 @@
</div>
</div>
<div class="appreciation-names">
<span class="appr-name">Aleksandar B.</span>
<span class="appr-name">Ana Gj.</span>
<span class="appr-name">Ana V.</span>
<span class="appr-name">Anastasija S.</span>
<span class="appr-name">Anastasija T.</span>
<span class="appr-name">Andrej D.</span>
<span class="appr-name">Angela P.</span>
<span class="appr-name">Angelina S.</span>
<span class="appr-name">Anja K.</span>
<span class="appr-name">Anja T.</span>
<span class="appr-name">Atanas Č.</span>
<span class="appr-name">Bisera N.</span>
<span class="appr-name">Blagica E.</span>
<span class="appr-name">Borjan J.</span>
<span class="appr-name">Božidar J.</span>
<span class="appr-name">Damjan B.</span>
<span class="appr-name">Dijana D.</span>
<span class="appr-name">Dimitar Đ.</span>
<span class="appr-name">Elena A.</span>
<span class="appr-name">Elma M.</span>
<span class="appr-name">Emilija P.</span>
<span class="appr-name">Eva N.</span>
<span class="appr-name">Evgenija A.</span>
<span class="appr-name">Evgenija G.</span>
<span class="appr-name">Evgenija K.</span>
<span class="appr-name">Filimena N.</span>
<span class="appr-name">Gorjan V.</span>
<span class="appr-name">Hristijan A.</span>
<span class="appr-name">Hristijan B.</span>
<span class="appr-name">Hristijan J.</span>
<span class="appr-name">Hristijan K.</span>
<span class="appr-name">Hristijan M.</span>
<span class="appr-name">Igor A.</span>
<span class="appr-name">Ilija Č.</span>
<span class="appr-name">Ina M.</span>
<span class="appr-name">Jovana A. N.</span>
<span class="appr-name">Katerina S.</span>
<span class="appr-name">Kiara L.</span>
<span class="appr-name">Kiril T.</span>
<span class="appr-name">Kliment K.</span>
<span class="appr-name">Klimentina Č.</span>
<span class="appr-name">Kristijan P.</span>
<span class="appr-name">Kristijan T.</span>
<span class="appr-name">Lea J.</span>
<span class="appr-name">Marko A.</span>
<span class="appr-name">Luka G.</span>
<span class="appr-name">Luka R.</span>
<span class="appr-name">Marija A.</span>
<span class="appr-name">Marija K.</span>
<span class="appr-name">Marko A.</span>
<span class="appr-name">Marko Gj.</span>
<span class="appr-name">Marko I.</span>
<span class="appr-name">Matea A.</span>
<span class="appr-name">Mia C.</span>
<span class="appr-name">Mia K.</span>
<span class="appr-name">Miahela M.</span>
<span class="appr-name">Mihael T.</span>
<span class="appr-name">Mihaela N.</span>
<span class="appr-name">Mihaela T.</span>
<span class="appr-name">Mila D.</span>
<span class="appr-name">Monika J.</span>
<span class="appr-name">Monika V.</span>
<span class="appr-name">Renata G.</span>
<span class="appr-name">Ria D.</span>
<span class="appr-name">Simona R.</span>
<span class="appr-name">Sofija M.</span>
<span class="appr-name">Stefan Gj.</span>
<span class="appr-name">Stefanija A.</span>
<span class="appr-name">Stojan B.</span>
<span class="appr-name">Teodor V.</span>
<span class="appr-name">Tijana A.</span>
<span class="appr-name">Tina M.</span>
<span class="appr-name">Vasil H.</span>
<span class="appr-name">Viktorija P.</span>
<span class="appr-name">Vladimir J.</span>
</div>
<p class="appreciation-note">Placeholder — the full list of members and friends is being compiled.</p>
<p class="appr-thanks">To every member, past and present, to those yet to come, and to everyone who has volunteered, contributed or supported MSOS in any way: thank you. You are the heart of this organisation. <strong>This is our story, and we are writing it together.</strong></p>
</section>
</main>