Files
msos/mk/get-to-know-macedonia/index.html
T
popovskikandClaude Opus 4.8 bf70a10a14 Finish the Macedonia stories and enrich image captions
Complete the three remaining Macedonia stories with sourced photos, so
both country sections are now fully illustrated.

Articles (EN/SI/MK each), placeholders replaced with real images:
- A Table Full of Macedonia (shared table, tavče gravče, ajvar,
  pastrmajlija).
- Music, Dance and the Moments That Bring Us Together (oro celebration,
  tapan and zurla, kopachkata, an MSOS event).
- History You Can Still Walk Through (Stobi, Heraclea Lyncestis, Kokino,
  Makedonium).
Each image is center-cropped to a uniform 3:2, downscaled, and given an
attribution caption with place, photographer where known, and source
link.

Captions:
- Replace bare one-word labels with a short descriptive phrase in all
  three languages, so a caption reads "Kokino, a prehistoric megalithic
  observatory" rather than just "Kokino". Applies across the food,
  culture, and heritage stories.
- Support an author-only credit with no external link, used for the
  photo from the MSOS archive.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-29 12:02:14 +02:00

344 lines
20 KiB
HTML

<!DOCTYPE html>
<html lang="mk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Запознај ја Македонија - MSOS</title>
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<!-- Font Awesome (for icons) -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- Поврзување до главната CSS-датотека -->
<link rel="stylesheet" href="../../css/main.css">
</head>
<body>
<!-- START_HEADER -->
<header class="dropdown-header-navigation">
<div class="container">
<!-- Logotip je zdaj samostojen element na levi strani -->
<a href="../../mk/" class="logo-link">
<img src="../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
</a>
<!-- Nov ovoj za vse elemente na desni strani -->
<div class="header-right-wrapper">
<nav>
<ul class="navigation desktop-nav">
<li class="menu-item menu-item-has-children">
<a href="#">За нас</a>
<ul class="dropdown-menu">
<li><a href="#">Времеплов и достигнувања</a></li>
<li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">Што работиме</a>
<ul class="dropdown-menu">
<li><a href="../../mk/projects/">Настани и проекти</a></li>
<li><a href="#">Блог</a></li>
<li><a href="#">Галерија</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">Вклучи се</a>
<ul class="dropdown-menu">
<li><a href="#">Стани член</a></li>
<li><a href="#">Поддржи ја МСОС</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">За студенти</a>
<ul class="dropdown-menu">
<li><a href="#">Водич за добредојде</a></li>
<li><a href="#">Менторска програма</a></li>
<li><a href="#">Често поставувани прашања</a></li>
<li><a href="../../mk/get-to-know-slovenia/">Запознај ја Словенија</a></li>
<li><a href="../../mk/get-to-know-macedonia/">Запознај ја Македонија</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">Новости</a>
<ul class="dropdown-menu">
<li><a href="#">Соопштенија</a></li>
<li><a href="#">Отворени повици</a></li>
<li><a href="#">Соопштенија за медиуми</a></li>
</ul>
</li>
</ul>
</nav>
<div class="navigation-actions">
<button class="btn btn-secondary">Стани член</button>
<button class="btn btn-primary">Донирај</button>
<div class="language-selector">
<div class="current-lang">
<i class="fas fa-globe"></i>
<span id="current-lang-code">МК</span>
<i class="fas fa-chevron-down"></i>
</div>
<div class="lang-dropdown">
<a href="#" data-lang="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk">Македонски (МК)</a>
</div>
</div>
</div>
</div>
<!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
<div class="mobile-menu-icon">
<i class="fas fa-bars"></i>
<i class="fas fa-times"></i>
</div>
</div>
</header>
<!-- Panel za mobilno navigacijo -->
<div class="mobile-nav-panel">
<nav>
<ul class="navigation mobile-nav">
<li class="menu-item menu-item-has-children">
<a href="#">За нас</a>
<ul class="dropdown-menu">
<li><a href="#">Времеплов и достигнувања</a></li>
<li><a href="#">Нашиот тим, мисија, визија и вредности</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">Што работиме</a>
<ul class="dropdown-menu">
<li><a href="../../mk/projects/">Настани и проекти</a></li>
<li><a href="#">Блог</a></li>
<li><a href="#">Галерија</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">Вклучи се</a>
<ul class="dropdown-menu">
<li><a href="#">Стани член</a></li>
<li><a href="#">Поддржи ја МСОС</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">За студенти</a>
<ul class="dropdown-menu">
<li><a href="#">Водич за добредојде</a></li>
<li><a href="#">Менторска програма</a></li>
<li><a href="#">Често поставувани прашања</a></li>
<li><a href="../../mk/get-to-know-slovenia/">Запознај ја Словенија</a></li>
<li><a href="../../mk/get-to-know-macedonia/">Запознај ја Македонија</a></li>
</ul>
</li>
<li class="menu-item menu-item-has-children">
<a href="#">Новости</a>
<ul class="dropdown-menu">
<li><a href="#">Соопштенија</a></li>
<li><a href="#">Отворени повици</a></li>
<li><a href="#">Соопштенија за медиуми</a></li>
</ul>
</li>
</ul>
</nav>
<div class="navigation-actions">
<button class="btn btn-secondary">Стани член</button>
<button class="btn btn-primary">Донирај</button>
<div class="language-selector">
<button class="current-lang" id="mobile-lang-trigger">
<i class="fas fa-globe"></i>
<span>МК</span>
<i class="fas fa-chevron-right"></i>
</button>
</div>
</div>
</div>
<!-- Modalno okno za izbiro na jazik (za mobilni) -->
<div id="language-modal-overlay">
<div class="language-modal-content">
<div class="language-modal-header">
<h3>Избери јазик</h3>
<button id="language-modal-close" aria-label="Затвори избор на јазик">&times;</button>
</div>
<div class="language-modal-body">
<a href="#" data-lang="si">Slovenščina (SI)</a>
<a href="#" data-lang="en">English (EN)</a>
<a href="#" data-lang="mk" class="active-lang">Македонски (МК)</a>
</div>
</div>
</div>
<!-- END_HEADER -->
<main class="page-content">
<section class="page-header-section">
<div class="container text-center">
<span class="page-subtitle">Приказни од дома</span>
<h1>Запознај ја Македонија</h1>
<p class="page-description">Македонија не е само место на картата. Таа е трпеза на која секогаш има место за уште еден човек, музика што нè зближува, планини на хоризонтот и разговори што продолжуваат долго по последното кафе. Ова се местата, традициите, вкусовите и приказните што ги носиме со себе и сакаме да ги споделиме со вас.</p>
<form class="subscribe-form">
<input type="email" placeholder="Внесете ја вашата е-пошта">
<button type="submit" class="btn btn-primary-orange">Претплати се</button>
</form>
<p class="privacy-note">Ние се грижиме за вашите податоци во нашата <a href="#">политика за приватност</a></p>
</div>
</section>
<section class="filter-section">
<nav class="filter-nav" aria-label="Категории на приказни">
<button type="button" class="filter-pill active" data-filter="all" aria-pressed="true">Сите приказни</button>
<button type="button" class="filter-pill" data-filter="places" aria-pressed="false">Места и природа</button>
<button type="button" class="filter-pill" data-filter="culture" aria-pressed="false">Култура и традиции</button>
<button type="button" class="filter-pill" data-filter="food" aria-pressed="false">Храна и вкусови</button>
<button type="button" class="filter-pill" data-filter="heritage" aria-pressed="false">Историја и наследство</button>
<button type="button" class="filter-pill" data-filter="identity" aria-pressed="false">Луѓе и идентитет</button>
</nav>
</section>
<section class="all-posts-section">
<div class="container column-layout">
<h2>Сите приказни</h2>
<div class="posts-grid">
<!-- Story: Добредојдовте во Македонија -->
<article class="post-card" data-category="identity">
<a href="welcome-to-macedonia/" class="post-link">
<img src="../../images/macedonia-welcome-skopje-square-hero.jpg" alt="Macedonia Square in central Skopje" class="post-image">
<div class="post-content">
<p class="post-meta">Тим на МСОС • Луѓе и идентитет</p>
<h3 class="post-title">Добредојдовте во Македонија</h3>
<p class="post-excerpt">Личен вовед во топлината, контрастите, природата и секојдневните моменти поради кои Македонија е дом.</p>
</div>
</a>
</article>
<!-- Story: Охрид, повеќе од разгледница -->
<article class="post-card" data-category="places">
<a href="ohrid-more-than-a-postcard/" class="post-link">
<img src="../../images/macedonia-ohrid-kaneo-hero.jpg" alt="The Church of St. John at Kaneo above Lake Ohrid" class="post-image">
<div class="post-content">
<p class="post-meta">Тим на МСОС • Места и природа</p>
<h3 class="post-title">Охрид, повеќе од разгледница</h3>
<p class="post-excerpt">Езерото, старите улици, маалата, звуците и спомените поради кои Охрид е многу повеќе од убава глетка.</p>
</div>
</a>
</article>
<!-- Story: Скопје, град со многу слоеви -->
<article class="post-card" data-category="places">
<a href="skopje-a-city-of-many-layers/" class="post-link">
<img src="../../images/macedonia-skopje-stone-bridge-hero.jpg" alt="The Stone Bridge over the Vardar in Skopje" class="post-image">
<div class="post-content">
<p class="post-meta">Тим на МСОС • Места и природа</p>
<h3 class="post-title">Скопје, град со многу слоеви</h3>
<p class="post-excerpt">Град обликуван од различни периоди, маала, заедници и контрасти што живеат едни покрај други.</p>
</div>
</a>
</article>
<!-- Story: Македонија на полна трпеза -->
<article class="post-card" data-category="food">
<a href="a-table-full-of-macedonia/" class="post-link">
<img src="../../images/macedonia-food-shared-table-hero.jpg" alt="A shared Macedonian table with salads, bread, beans, and other dishes" class="post-image">
<div class="post-content">
<p class="post-meta">Тим на МСОС • Храна и вкусови</p>
<h3 class="post-title">Македонија на полна трпеза</h3>
<p class="post-excerpt">Јадењата, вкусовите, разговорите и гостопримството поради кои заедничкиот оброк станува нешто многу поголемо.</p>
</div>
</a>
</article>
<!-- Story: Музика, оро и моментите што нè спојуваат -->
<article class="post-card" data-category="culture">
<a href="music-dance-and-the-moments-that-bring-us-together/" class="post-link">
<img src="../../images/macedonia-culture-oro-celebration-hero.jpg" alt="Several generations joining the same oro at a Macedonian celebration" class="post-image">
<div class="post-content">
<p class="post-meta">Тим на МСОС • Култура и традиции</p>
<h3 class="post-title">Музика, оро и моментите што нè спојуваат</h3>
<p class="post-excerpt">Како песните, орото, прославите и познатите ритми создаваат чувство на припадност низ генерациите.</p>
</div>
</a>
</article>
<!-- Story: Историја низ која сè уште можеме да чекориме -->
<article class="post-card" data-category="heritage">
<a href="history-you-can-still-walk-through/" class="post-link">
<img src="../../images/macedonia-heritage-stobi-street-hero.jpg" alt="An ancient street and building remains at the archaeological site of Stobi" class="post-image">
<div class="post-content">
<p class="post-meta">Тим на МСОС • Историја и наследство</p>
<h3 class="post-title">Историја низ која сè уште можеме да чекориме</h3>
<p class="post-excerpt">Антички локалитети, стари чаршии, цркви, манастири и градови во кои македонската историја сè уште се чувствува блиску.</p>
</div>
</a>
</article>
</div>
<p class="filter-empty" hidden>Ниту една приказна сè уште не одговара на овој филтер.</p>
<nav class="pagination">
<a href="#" class="pagination-arrow"><i class="fas fa-arrow-left"></i> Претходна</a>
<div class="pagination-numbers">
<a href="#" class="page-number active">1</a>
</div>
<a href="#" class="pagination-arrow">Следна <i class="fas fa-arrow-right"></i></a>
</nav>
</div>
</section>
</main>
<!-- START_FOOTER -->
<footer>
<div class="footer-container">
<div class="footer-main">
<div class="footer-info">
<div class="footer-logo">
<img src="../../images/13-whitelogo.png" alt="Лого на Македонска студентска организација во Словенија">
</div>
<p>
Masarykova cesta 24<br>
1000 Ljubljana, Slovenia<br>
+389 02 123 4567<br>
info.msosorg@gmail.com
</p>
<div class="social-icons">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-links">
<div class="links-column">
<h4>За студенти</h4>
<a href="#">Блог</a>
<a href="#">Галерија</a>
<a href="#">ЧПП</a>
<a href="#">Брошура</a>
</div>
<div class="links-column">
<h4>Проекти</h4>
<a href="#">Претстојни</a>
<a href="#">Претходни</a>
</div>
<div class="links-column">
<h4>Организација</h4>
<a href="#">За нас</a>
<a href="#">Контакт</a>
<a href="#">Документација</a>
</div>
</div>
</div>
<hr>
<div class="footer-bottom">
<p>© МСОС орг 2023 Сите права се задржани.</p>
<div class="legal-links">
<a href="#">Политика за приватност</a>
<a href="#">Политика за колачиња</a>
<a href="#">Правни услови</a>
</div>
</div>
</div>
<script src="../../main.js"></script>
</footer>
<!-- END_FOOTER -->
<script src="../../main.js"></script>
</body>
</html>