posodobitve headerjev in optimizacija slik

mk/projects/morning-coffee-in-front-of-ctk/index.html

@@ -18,29 +18,55 @@
 </head>
 <body>
 
-    <header class="dropdown-header-navigation">
-        <div class="container">
-            <div class="header-content">
-                <a href="../../../mk/" class="logo-link">
-                    <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
-                </a>
-                <!-- Desktop Navigation -->
-                <nav class="navigation desktop-nav">
-                    <a href="#">За нас</a>
-                    <a href="#">За студенти</a>
-                    <a href="../../">Проекти</a>
-                </nav>
-            </div>
+    <!-- START_HEADER -->
+<header class="dropdown-header-navigation">
+    <div class="container">
+        <div class="header-content">
+            <a href="../../../mk/" class="logo-link">
+                <img src="../../../images/1-logo.png" alt="Лого на Македонска студентска организација во Словенија" class="logo-img">
+            </a>
+            <!-- Навигација за десктоп -->
+            <nav class="navigation desktop-nav">
+                <a href="#">За нас</a>
+                <a href="#">За студенти</a>
+                <a href="../../../mk/projects/">Проекти</a>
+            </nav>
+        </div>
 
-            <!-- Desktop Buttons -->
+        <!-- Копчиња за десктоп -->
+        <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">MK</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>
+
+        <!-- Панел за мобилна навигација -->
+        <div class="mobile-nav-panel">
+            <nav class="navigation mobile-nav">
+                <a href="#">За нас</a>
+                <a href="#">За студенти</a>
+                <a href="../../../mk/projects/">Проекти</a>
+            </nav>
             <div class="navigation-actions">
                 <button class="btn btn-secondary">Стани партнер</button>
                 <button class="btn btn-primary">Донирај</button>
-                <!-- Language Switcher -->
+                <!-- Преклопник за јазик (за мобилен) -->
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code">MK</span>
+                        <span id="current-lang-code-mobile">MK</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
@@ -51,39 +77,14 @@
                 </div>
             </div>
 
-            <!-- Mobile Navigation Panel -->
-            <div class="mobile-nav-panel">
-                <nav class="navigation mobile-nav">
-                    <a href="#">За нас</a>
-                    <a href="#">За студенти</a>
-                    <a href="../../">Проекти</a>
-                </nav>
-                <div class="navigation-actions">
-                    <button class="btn btn-secondary">Стани партнер</button>
-                    <button class="btn btn-primary">Донирај</button>
-                    <!-- Language Switcher (for mobile) -->
-                    <div class="language-selector">
-                        <div class="current-lang">
-                            <i class="fas fa-globe"></i>
-                            <span id="current-lang-code-mobile">MK</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>
-            </div>
-
-             <!-- Mobile Menu Icon (Hamburger/X) -->
+             <!-- Икона за мобилно мени (Хамбургер/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">
@@ -94,7 +95,7 @@
             </header>
 
             <figure class="article-main-image">
-                <img src="../../../images/event4-image1.jpg" alt="Студенти уживаат во кафе и бурек пред ЦТК.">
+                <img src="../../../images/event4-image1.webp" alt="Студенти уживаат во кафе и бурек пред ЦТК.">
             </figure>
 
             <div class="article-body">
@@ -104,19 +105,19 @@
                 <p>Испитната сесија секогаш носи стрес – часови и часови учење, разговори што се вртат само околу испити, први и втори рокови, положени или не, некои за прв пат, а некои и по петти пат. Затоа решивме да направиме мала пауза за воздишка: да се опуштиме, да се насмееме и да се потсетиме дека сме тука заедно во овој студиски стрес.</p>
 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image2.jpg" alt="Студенти чекаат во ред пред библиотеката ЦТК.">
+                    <img src="../../../images/event4-image2.webp" alt="Студенти чекаат во ред пред библиотеката ЦТК.">
                     <figcaption>Стотина студенти во ред пред ЦТК, чекаат уште пред отворање за да фатат место во библиотеката.</figcaption>
                 </figure>
                 
                 <p>Со шолја топло кафе во рака, а благодарение на <strong>Бурек Олимпија</strong> уживавме во вкусен бурек со месо и сирење. Се потрудивме и да внесеме малку забава – ги поканивме студентите да донесат свои чашки, а за најкреативните имаше награда.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image3.jpg" alt="Студент се смее додека јаде бурек.">
+                    <img src="../../../images/event4-image3.webp" alt="Студент се смее додека јаде бурек.">
                     <figcaption>Бесплатен топол бурек – тајната формула за решавање и на најтешките математички проблеми 😉</figcaption>
                 </figure>
 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image4.jpg" alt="Група студенти со топло кафе позираат пред ЦТК.">
+                    <img src="../../../images/event4-image4.webp" alt="Група студенти со топло кафе позираат пред ЦТК.">
                     <figcaption>Група студенти со топло кафе, насмеани пред ЦТК.</figcaption>
                 </figure>
 
@@ -125,7 +126,7 @@
                 <p>Реакциите беа моментални – студентите се нафрлија да пишуваат, а одговорите беа сè, само не досадни: од „хаотично“ и „Сакаме да спиеме! (не во ЦТК)!" до „лагано“, „под стрес“, „исцрпено“, „среќно“ и „заспано“. Со други зборови – цел спектар на студентски емоции, искрено преточени во неколку зборови.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image5.jpg" alt="Табла со рачно напишани одговори од студенти за нивните чувства за време на испитниот рок.">
+                    <img src="../../../images/event4-image5.webp" alt="Табла со рачно напишани одговори од студенти за нивните чувства за време на испитниот рок.">
                     <figcaption>Духовити и искрени одговори на големите табли со прашања пред ЦТК.</figcaption>
                 </figure>
 
@@ -136,14 +137,14 @@
                 <p>Околу 150 луѓе го посетија заедничкиот штанд на МСОС, Повезани и ЦТК за да се подружат, да се напијат кафе, да грицнат нешто и да си разменат приказни меѓу книгите и роковите. Настанот помина во одлична атмосфера – многу насмевки, нови познанства и еден мал потсетник дека и во најстресните периоди, секогаш има време за кафе и добро друштво.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image6.jpg" alt="Студенти собрани на заедничкиот штанд за време на настанот.">
+                    <img src="../../../images/event4-image6.webp" alt="Студенти собрани на заедничкиот штанд за време на настанот.">
                     <figcaption>Дел од атмосферата на заедничкиот штанд</figcaption>
                 </figure>
                 
                 <p>Се гледаме повторно и следната година – уште поопуштени и со уште повеќе кафе!</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image7.png" alt="Колаж од фотографии на кои се прикажани студенти, шолји за кафе и бурек.">
+                    <img src="../../../images/event4-image7.webp" alt="Колаж од фотографии на кои се прикажани студенти, шолји за кафе и бурек.">
                     <figcaption>Убава дружба, многу спомени и заеднички пребродени испитни стресови.</figcaption>
                 </figure>
             </div>
@@ -152,7 +153,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>
@@ -183,57 +184,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="Лого на Македонска студентска организација во Словенија">
                 </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>
+                <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>© МСОС орг 2023 Сите права се задржани.</p>
-                <div class="legal-links">
-                    <a href="#">Политика за приватност</a>
-                    <a href="#">Политика за колачиња</a>
-                    <a href="#">Правни услови</a>
+            <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>
-    </footer>
+        <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>