posodobitve headerjev in optimizacija slik

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

@@ -19,29 +19,54 @@
 <body>
 
     <!-- START_HEADER -->
-    <header class="dropdown-header-navigation">
-        <div class="container">
-            <div class="header-content">
-                <a href="../../../si/" class="logo-link">
-                    <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
-                </a>
-                <!-- Navigacija za namizje -->
-                <nav class="navigation desktop-nav">
-                    <a href="#">O nas</a>
-                    <a href="#">Za študente</a>
-                    <a href="../../">Projekti</a>
-                </nav>
-            </div>
+<header class="dropdown-header-navigation">
+    <div class="container">
+        <div class="header-content">
+            <a href="../../../si/" class="logo-link">
+                <img src="../../../images/1-logo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji" class="logo-img">
+            </a>
+            <!-- Navigacija za namizje -->
+            <nav class="navigation desktop-nav">
+                <a href="#">O nas</a>
+                <a href="#">Za študente</a>
+                <a href="../../../si/projects/">Projekti</a>
+            </nav>
+        </div>
 
-            <!-- Gumbi za namizje -->
+        <!-- Gumbi za namizje -->
+        <div class="navigation-actions">
+            <button class="btn btn-secondary">Postanite partner</button>
+            <button class="btn btn-primary">Donirajte</button>
+            <!-- Zamenjan preklopnik jezika -->
+            <div class="language-selector">
+                <div class="current-lang">
+                    <i class="fas fa-globe"></i>
+                    <span id="current-lang-code">SI</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>
+
+        <!-- Panel za mobilno navigacijo -->
+        <div class="mobile-nav-panel">
+            <nav class="navigation mobile-nav">
+                <a href="#">O nas</a>
+                <a href="#">Za študente</a>
+                <a href="../../../si/projects/">Projekti</a>
+            </nav>
             <div class="navigation-actions">
                 <button class="btn btn-secondary">Postanite partner</button>
                 <button class="btn btn-primary">Donirajte</button>
-                <!-- Preklopnik jezika -->
+                 <!-- Zamenjan preklopnik jezika (tudi za mobilni meni) -->
                 <div class="language-selector">
                     <div class="current-lang">
                         <i class="fas fa-globe"></i>
-                        <span id="current-lang-code">SI</span>
+                        <span id="current-lang-code-mobile">SI</span>
                         <i class="fas fa-chevron-down"></i>
                     </div>
                     <div class="lang-dropdown">
@@ -52,40 +77,14 @@
                 </div>
             </div>
 
-            <!-- Panel za mobilno navigacijo -->
-            <div class="mobile-nav-panel">
-                <nav class="navigation mobile-nav">
-                    <a href="#">O nas</a>
-                    <a href="#">Za študente</a>
-                    <a href="../../">Projekti</a>
-                </nav>
-                <div class="navigation-actions">
-                    <button class="btn btn-secondary">Postanite partner</button>
-                    <button class="btn btn-primary">Donirajte</button>
-                    <!-- Preklopnik jezika (za mobilni meni) -->
-                    <div class="language-selector">
-                        <div class="current-lang">
-                            <i class="fas fa-globe"></i>
-                            <span id="current-lang-code-mobile">SI</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>
-
              <!-- Ikona za mobilni meni (Hamburger/X) -->
             <div class="mobile-menu-icon">
                 <i class="fas fa-bars"></i>
                 <i class="fas fa-times"></i>
             </div>
         </div>
-    </header>
-    <!-- END_HEADER -->
+</header>
+<!-- END_HEADER -->
 
     <main class="article-page">
         <article class="article-container">
@@ -96,7 +95,7 @@
             </header>
 
             <figure class="article-main-image">
-                <img src="../../../images/event4-image1.jpg" alt="Študenti uživajo ob kavi in bureku pred knjižnico CTK.">
+                <img src="../../../images/event4-image1.webp" alt="Študenti uživajo ob kavi in bureku pred knjižnico CTK.">
             </figure>
 
             <div class="article-body">
@@ -106,19 +105,19 @@
                 <p>Izpitno obdobje vedno prinaša stres – ure in ure učenja, pogovori, ki se vrtijo samo okoli izpitov, prvih in drugih rokov, opravljenih ali neopravljenih obveznosti. Nekateri se z izpitom srečajo prvič, drugi že petič. Zato smo se odločili, da si vzamemo kratek odmor za vdih: da se sprostimo, nasmejimo in se spomnimo, da smo v tem študijskem stresu skupaj.</p>
 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image2.jpg" alt="Študentje čakajo v vrsti pred stavbo knjižnice CTK.">
+                    <img src="../../../images/event4-image2.webp" alt="Študentje čakajo v vrsti pred stavbo knjižnice CTK.">
                     <figcaption>Stotine študentov v vrsti pred CTK, ki so čakali še pred odprtjem, da si zagotovijo svoje mesto v knjižnici.</figcaption>
                 </figure>
                 
                 <p>S skodelico vroče kave v roki in po zaslugi <strong>Bureka Olimpija</strong> smo uživali v okusnem bureku z mesom in sirom. Poskrbeli smo tudi za kanček zabave – študente smo povabili, da prinesejo svoje skodelice, za najbolj kreativne pa smo pripravili nagrado.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image3.jpg" alt="Študent se smeji medtem ko je kos bureka.">
+                    <img src="../../../images/event4-image3.webp" alt="Študent se smeji medtem ko je kos bureka.">
                     <figcaption>Brezplačen topel burek – skrivna formula za reševanje tudi najtežjih matematičnih problemov 😉</figcaption>
                 </figure>
 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image4.jpg" alt="Skupina študentov s toplo kavo pozira pred kamero.">
+                    <img src="../../../images/event4-image4.webp" alt="Skupina študentov s toplo kavo pozira pred kamero.">
                     <figcaption>Skupina študentov s toplo kavo, nasmejani pred CTK.</figcaption>
                 </figure>
 
@@ -127,7 +126,7 @@
                 <p>Odzivi so bili takojšnji – študenti so hiteli pisat, odgovori pa so bili vse prej kot dolgočasni: od "kaotično" in "Hočemo spat! (ampak ne v CTK)!" do "chill", "pod stresom", "izčrpano", "srečno" in "zaspano". Z drugimi besedami – celoten spekter študentskih čustev, iskreno prelitih v nekaj besed.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image5.jpg" alt="Bela tabla z ročno napisanimi odgovori študentov o njihovih občutkih med izpitnim obdobjem.">
+                    <img src="../../../images/event4-image5.webp" alt="Bela tabla z ročno napisanimi odgovori študentov o njihovih občutkih med izpitnim obdobjem.">
                     <figcaption>Duhoviti in iskreni odgovori na velikih tablah s vprašanji pred CTK.</figcaption>
                 </figure>
 
@@ -138,106 +137,72 @@
                 <p>Skupno stojnico MSOS, Skupine Povezani in CTK je obiskalo okoli 150 ljudi, ki so se prišli družit, spit kavo, prigriznit nekaj in si izmenjat zgodbe med knjigami in roki. Dogodek je potekal v odličnem vzdušju – veliko nasmehov, nova poznanstva in majhen opomnik, da je tudi v najbolj stresnih obdobjih vedno čas za kavo in dobro družbo.</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image6.jpg" alt="Študenti zbrani na skupni stojnici med dogodkom.">
+                    <img src="../../../images/event4-image6.webp" alt="Študenti zbrani na skupni stojnici med dogodkom.">
                     <figcaption>Del vzdušja na skupni stojnici.</figcaption>
                 </figure>
                 
                 <p>Se vidimo ponovno prihodnje leto – še bolj sproščeni in z še več kave!</p>
                 
                 <figure class="article-inline-image">
-                    <img src="../../../images/event4-image7.png" alt="Kolaž fotografij, ki prikazuje študente, skodelice za kavo in burek.">
+                    <img src="../../../images/event4-image7.webp" alt="Kolaž fotografij, ki prikazuje študente, skodelice za kavo in burek.">
                     <figcaption>Dobra družba, veliko spominov in skupaj premagan izpitni stres.</figcaption>
                 </figure>
             </div>
 
             <!-- START_FOOTER -->
-            <footer class="article-footer">
-                <hr>
-                <div class="author-share-section">
-                    <div class="author-details">
-                        <img src="../../../images/11-boy.jpg" alt="Avatar Kristijana Popovskega">
-                        <div class="author-text">
-                            <p class="author-name">Kristijan Popovski</p>
-                            <p class="author-title">Predsednik in ustanovitelj</p>
-                        </div>
-                    </div>
-                    <div class="share-buttons">
-                        <button class="btn btn-secondary"><i class="fas fa-link"></i> Kopiraj povezavo</button>
-                        <a href="#" class="social-icon-btn" aria-label="Deli na Twitterju"><i class="fab fa-twitter"></i></a>
-                        <a href="#" class="social-icon-btn" aria-label="Deli na Facebooku"><i class="fab fa-facebook-f"></i></a>
-                        <a href="#" class="social-icon-btn" aria-label="Deli na LinkedInu"><i class="fab fa-linkedin-in"></i></a>
-                    </div>
+<footer>
+    <div class="footer-container">
+        <div class="footer-main">
+            <div class="footer-info">
+                <div class="footer-logo">
+                    <img src="../../../images/13-whitelogo.png" alt="Logotip Makedonske študentske organizacije v Sloveniji">
                 </div>
-            </footer>
-        </article>
-
-        <section class="newsletter-cta">
-            <div class="container">
-                <div class="cta-content">
-                    <h2>Pridružite se 2.000+ naročnikom</h2>
-                    <p>Ostanite na tekočem z vsem, kar morate vedeti.</p>
-                    <form class="subscribe-form-bottom">
-                        <input type="email" placeholder="Vnesite svoj e-mail">
-                        <button type="submit" class="btn btn-primary-orange">Naroči se</button>
-                    </form>
-                    <p class="privacy-note">Skrbimo za vaše podatke v naši <a href="#">politiki zasebnosti</a>.</p>
+                <p>
+                    Masarykova cesta 24<br>
+                    1000 Ljubljana, Slovenija<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>
-        </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="Logotip Makedonske študentske organizacije v Sloveniji">
-                    </div>
-                    <p>
-                        Masarykova cesta 24<br>
-                        1000 Ljubljana, Slovenija<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 class="footer-links">
+                <div class="links-column">
+                    <h4>Za študente</h4>
+                    <a href="#">Blog</a>
+                    <a href="#">Galerija</a>
+                    <a href="#">Pogosta vprašanja</a>
+                    <a href="#">Brošura</a>
                 </div>
-                <div class="footer-links">
-                    <div class="links-column">
-                        <h4>Za študente</h4>
-                        <a href="#">Blog</a>
-                        <a href="#">Galerija</a>
-                        <a href="#">Pogosta vprašanja</a>
-                        <a href="#">Brošura</a>
-                    </div>
-                    <div class="links-column">
-                        <h4>Projekti</h4>
-                        <a href="#">Prihajajoči</a>
-                        <a href="#">Pretekli</a>
-                    </div>
-                    <div class="links-column">
-                        <h4>Organizacija</h4>
-                        <a href="#">O nas</a>
-                        <a href="#">Kontakt</a>
-                        <a href="#">Dokumentacija</a>
-                    </div>
+                <div class="links-column">
+                    <h4>Projekti</h4>
+                    <a href="#">Prihajajoči</a>
+                    <a href="#">Pretekli</a>
                 </div>
-            </div>
-            <hr>
-            <div class="footer-bottom">
-                 <p>© MSOS org 2023 Vse pravice pridržane.</p>
-                <div class="legal-links">
-                    <a href="#">Politika zasebnosti</a>
-                    <a href="#">Politika piškotkov</a>
-                    <a href="#">Pravni pogoji</a>
+                <div class="links-column">
+                    <h4>Organizacija</h4>
+                    <a href="#">O nas</a>
+                    <a href="#">Kontakt</a>
+                    <a href="#">Dokumentacija</a>
                 </div>
             </div>
         </div>
-    </footer>
-    <!-- END_FOOTER -->
+        <hr>
+        <div class="footer-bottom">
+             <p>© MŠOS org 2023 Vse pravice pridržane.</p>
+            <div class="legal-links">
+                <a href="#">Politika zasebnosti</a>
+                <a href="#">Politika piškotkov</a>
+                <a href="#">Pravni pogoji</a>
+            </div>
+        </div>
+    </div>
+    <script src="../../../main.js"></script>
+</footer>
+<!-- END_FOOTER -->
 
     <script src="../../../main.js"></script>
 </body>