posodobitve headerjev in optimizacija slik

en/projects/makedonska-studentska-vecer-vo-ljubljana/index.html

@@ -18,54 +18,73 @@
 </head>
 <body>
 
-    <header class="dropdown-header-navigation">
-        <div class="container">
-            <div class="header-content">
-                <a href="../../" class="logo-link">
-                    <img src="../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-                </a>
-                <!-- Navigacija za namizje -->
-                <nav class="navigation desktop-nav">
-                    <a href="#">About us</a>
-                    <a href="#">For Students</a>
-                    <a href="../../projects/">Projects</a>
-                </nav>
-            </div>
+    <!-- START_HEADER -->
+<header class="dropdown-header-navigation">
+    <div class="container">
+        <div class="header-content">
+            <a href="../../../en/" class="logo-link">
+                <img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
+            </a>
+            <!-- Desktop Navigation -->
+            <nav class="navigation desktop-nav">
+                <a href="#">About us</a>
+                <a href="#">For Students</a>
+                <a href="../../../en/projects/">Projects</a>
+            </nav>
+        </div>
 
-            <!-- Gumbi za namizje -->
+        <!-- Desktop Buttons -->
+        <div class="navigation-actions">
+            <button class="btn btn-secondary">Become a partner</button>
+            <button class="btn btn-primary">Donate</button>
+            <!-- Language Switcher -->
+            <div class="language-selector">
+                <div class="current-lang">
+                    <i class="fas fa-globe"></i>
+                    <span id="current-lang-code">EN</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">Македонски (MK)</a>
+                </div>
+            </div>
+        </div>
+
+        <!-- Mobile Navigation Panel -->
+        <div class="mobile-nav-panel">
+            <nav class="navigation mobile-nav">
+                <a href="#">About us</a>
+                <a href="#">For Students</a>
+                <a href="../../../en/projects/">Projects</a>
+            </nav>
             <div class="navigation-actions">
                 <button class="btn btn-secondary">Become a partner</button>
                 <button class="btn btn-primary">Donate</button>
+                <!-- Language Switcher (for mobile) -->
                 <div class="language-selector">
-                    <i class="fas fa-globe"></i>
-                    <i class="fas fa-chevron-down"></i>
-                </div>
-            </div>
-
-            <!-- Panel za mobilno navigacijo (združuje povezave in gumbe) -->
-            <div class="mobile-nav-panel">
-                <nav class="navigation mobile-nav">
-                    <a href="#">About us</a>
-                    <a href="#">For Students</a>
-                    <a href="../../projects/">Projects</a>
-                </nav>
-                <div class="navigation-actions">
-                    <button class="btn btn-secondary">Become a partner</button>
-                    <button class="btn btn-primary">Donate</button>
-                    <div class="language-selector">
+                    <div class="current-lang">
                         <i class="fas fa-globe"></i>
+                        <span id="current-lang-code-mobile">EN</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">Македонски (MK)</a>
+                    </div>
                 </div>
             </div>
 
-             <!-- Ikona za mobilni meni (Hamburger/X) -->
+             <!-- Mobile Menu Icon (Hamburger/X) -->
             <div class="mobile-menu-icon">
                 <i class="fas fa-bars"></i>
                 <i class="fas fa-times"></i>
             </div>
         </div>
-    </header>
+</header>
+<!-- END_HEADER -->
 
     <main class="article-page">
         <article class="article-container">
@@ -76,7 +95,7 @@
             </header>
 
             <figure class="article-main-image">
-                <img src="../../images/msnl-1.jpg" alt="Атмосфера од македонската студентска вечер во Љубљана">
+                <img src="../../images/msnl-1.webp" alt="Атмосфера од македонската студентска вечер во Љубљана">
             </figure>
 
             <div class="article-body">
@@ -86,7 +105,7 @@
                 <p>Сè започна со едноставна желба – да се собереме, да се запознаеме и да ја почувствуваме Македонија, иако сме далеку од неа. Кристијан Поповски, тогаш студент на Економскиот факултет во Љубљана, ја сподели својата идеја со неколку колеги, а одговорот беше неверојатен. За помалку од две недели, преку 40 студенти се пријавија во организацискиот тим. Секој понесе дел од својот ентузијазам и време, а заедничкиот дух и желбата за поврзување ја претворија оваа спонтана иницијатива во настан што долго ќе го паметиме.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../images/msnl-2.png" alt="Подготовки и состаноци за македонската студентска вечер">
+                    <img src="../../images/msnl-2.webp" alt="Подготовки и состаноци за македонската студентска вечер">
                     <figcaption>Фотографии од подготовките и состаноците за организирање на македонската студентска вечер</figcaption>
                 </figure>
                 
@@ -94,7 +113,7 @@
                 <p>Една недела пред настанот, секој ден објавувавме интересни факти за Македонија, нејзините национални богатства, музика и култура. Полека, но сигурно, ја градевме атмосферата и ентузијазмот, не само кај македонските студенти, туку и кај многу други кои сакаа да ја почувствуваат нашата енергија.</p>
 
                 <figure class="article-inline-image">
-                    <img src="../../images/msnl-3.jpg" alt="Хамер со испишани кирилични и латинични букви">
+                    <img src="../../images/msnl-3.webp" alt="Хамер со испишани кирилични и латинични букви">
                     <figcaption>Хамер со испишани кирилични и латинични букви. Словенците ја учат македонската азбука, додека македонците ги подучуваат.</figcaption>
                 </figure>
 
@@ -107,14 +126,14 @@
                 <p>Журката започна во 20:00 часот и беше замислена во два дела. Првиот дел беше вистинско гастрономско и културно патување низ Македонија. Студентите можеа да пробаат лебчиња со ајвар и биено сирење, македонско вино, вкусни грицки и традиционални пијалоци. На масите имаше изложени и други автентични производи што сите ги потсетуваа на дома. Сите овие вкусови и мириси беа овозможени благодарение на поддршката од продавницата за македонски производи <strong>„Македонија Трејд“</strong>, кои несебично придонесоа овој дел од вечерта да биде вистинско уживање.</p>
 
                 <figure class="article-inline-image">
-                    <img src="../../images/msnl-4.png" alt="Штандови со македонски обележја, традиционална храна и пијалаци">
+                    <img src="../../images/msnl-4.webp" alt="Штандови со македонски обележја, традиционална храна и пијалаци">
                     <figcaption>Фотографии од штандовите со македонски обележја, традиционална храна и пијалаци.</figcaption>
                 </figure>
 
                 <p>Покрај храната, посетителите можеа да разгледаат интересни факти за државата, фотографии од познати македонски дејци и културни знаменитости, како и да видат традиционални носии и <strong>гајда</strong> одблиску. Атмосферата беше топла и полна со љубопитност – како мала изложба во рамките на една голема студентска забава.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../images/msnl-5.jpg" alt="Мини квиз со прашања за Македонија">
+                    <img src="../../images/msnl-5.webp" alt="Мини квиз со прашања за Македонија">
                     <figcaption>Мини квиз со прашања за Македонија, каде студентите во едниот дел од клубот се натпреваруваат</figcaption>
                 </figure>
 
@@ -122,7 +141,7 @@
                 <p>Вечерта беше збогатена и со присуството на важни гости од македонската заедница во Словенија. На настанот ни се придружи <strong>претседателот на Сојузот на македонските културни друштва во Словенија, г-н Благоја Настески</strong>, кој со своето присуство ја потврди важноста на ваквите иницијативи за одржување на македонскиот дух и традиција во дијаспората.</p>
 
                 <figure class="article-inline-image">
-                    <img src="../../images/msnl-6.jpg" alt="Кристијан и Бисера заедно со амбасадорката Зеленковска и претседателот г-н Настески">
+                    <img src="../../images/msnl-6.webp" alt="Кристијан и Бисера заедно со амбасадорката Зеленковска и претседателот г-н Настески">
                     <figcaption>Кристијан и Бисера заедно со амбасадорката Зеленковска и претседателот на Сојузот на македонски друштва, г-н Настески</figcaption>
                 </figure>
 
@@ -139,7 +158,7 @@
                 <p>Оваа ноќ го постави темелот за Македонската студентска организација во Словенија и ни покажа дека со ентузијазам, заедништво и малку храброст, може да се создаде нешто што ќе ги обедини луѓето и ќе им даде чувство на дом – дури и кога се далеку од него.</p>
 
                 <figure class="article-inline-image">
-                    <img src="../../images/msnl-7.jpg" alt="Посветениот тим на волонтери по завршувањето на настанот">
+                    <img src="../../images/msnl-7.webp" alt="Посветениот тим на волонтери по завршувањето на настанот">
                     <figcaption>Фотографија направена во 4 часот наутро, по завршувањето и средувањето на просторот заедно со посветениот тим на волонтери</figcaption>
                 </figure>
             </div>
@@ -148,7 +167,7 @@
                 <hr>
                 <div class="author-share-section">
                     <div class="author-details">
-                        <img src="../../images/11-boy.jpg" alt="Аватар на Кристијан Поповски">
+                        <img src="../../images/11-boy.webp" alt="Аватар на Кристијан Поповски">
                         <div class="author-text">
                             <p class="author-name">Кристијан Поповски</p>
                             <p class="author-title">Претседател и основач</p>
@@ -181,57 +200,60 @@
         </section>
     </main>
 
-    <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>
+    <!-- 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="Macedonian Student Organisation in Slovenia Logo">
                 </div>
-                <div class="footer-links">
-                    <div class="links-column">
-                        <h4>For students</h4>
-                        <a href="#">Blog</a>
-                        <a href="#">Gallery</a>
-                        <a href="#">FAQs</a>
-                        <a href="#">Brochure</a>
-                    </div>
-                    <div class="links-column">
-                        <h4>Projects</h4>
-                        <a href="#">Upcoming</a>
-                        <a href="#">Previous</a>
-                    </div>
-                    <div class="links-column">
-                        <h4>Organisation</h4>
-                        <a href="#">About us</a>
-                        <a href="#">Contact</a>
-                        <a href="#">Documentation</a>
-                    </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>
-            <hr>
-            <div class="footer-bottom">
-                 <p>© MSOS org 2023 All rights reserved.</p>
-                <div class="legal-links">
-                    <a href="#">Privacy policy</a>
-                    <a href="#">Cookie Policy</a>
-                    <a href="#">Legal Terms</a>
+            <div class="footer-links">
+                <div class="links-column">
+                    <h4>For students</h4>
+                    <a href="#">Blog</a>
+                    <a href="#">Gallery</a>
+                    <a href="#">FAQs</a>
+                    <a href="#">Brochure</a>
+                </div>
+                <div class="links-column">
+                    <h4>Projects</h4>
+                    <a href="#">Upcoming</a>
+                    <a href="#">Previous</a>
+                </div>
+                <div class="links-column">
+                    <h4>Organisation</h4>
+                    <a href="#">About us</a>
+                    <a href="#">Contact</a>
+                    <a href="#">Documentation</a>
                 </div>
             </div>
         </div>
-    </footer>
+        <hr>
+        <div class="footer-bottom">
+             <p>© MSOS org 2023 All rights reserved.</p>
+            <div class="legal-links">
+                <a href="#">Privacy policy</a>
+                <a href="#">Cookie Policy</a>
+                <a href="#">Legal Terms</a>
+            </div>
+        </div>
+    </div>
+    <script src="../../../main.js"></script>
+</footer>
+<!-- END_FOOTER -->
 
     <script src="../../main.js"></script>
 </body>