update

aktuality.js

@@ -0,0 +1,105 @@
+// Aktuality Manager - Načítá a zobrazuje aktuality z XML souboru
+class AktualityManager {
+    constructor() {
+        this.xmlFile = 'aktuality.xml';
+        this.containerSelector = '.aktuality-grid';
+    }
+
+    // Načte XML soubor
+    async loadXML() {
+        try {
+            const response = await fetch(this.xmlFile);
+            if (!response.ok) {
+                throw new Error(`Chyba při načítání XML: ${response.status}`);
+            }
+            const xmlText = await response.text();
+            return new DOMParser().parseFromString(xmlText, "text/xml");
+        } catch (error) {
+            console.error('Chyba při načítání aktualit:', error);
+            this.showError();
+            return null;
+        }
+    }
+
+    // Zobrazí chybovou zprávu
+    showError() {
+        const container = document.querySelector(this.containerSelector);
+        if (container) {
+            container.innerHTML = `
+                <div class="aktuality-error">
+                    <p>Nepodařilo se načíst aktuality. Zkuste to prosím později.</p>
+                </div>
+            `;
+        }
+    }
+
+    // Vytvoří HTML pro jednu položku
+    createAktualityItem(polozka) {
+        const typ = polozka.querySelector('typ')?.textContent || 'Novinka';
+        const datum = polozka.querySelector('datum')?.textContent || '';
+        const titulek = polozka.querySelector('titulek')?.textContent || '';
+        const popis = polozka.querySelector('popis')?.textContent || '';
+        const link = polozka.querySelector('link')?.textContent;
+        const linkText = polozka.querySelector('linkText')?.textContent || 'Více informací';
+
+        let linkHtml = '';
+        if (link) {
+            linkHtml = `
+                <a href="${link}" class="aktuality-link">
+                    ${linkText} <i class="fas fa-arrow-right"></i>
+                </a>
+            `;
+        }
+
+        return `
+            <div class="aktuality-card">
+                <span class="aktuality-badge">${typ}</span>
+                <div class="aktuality-date">
+                    <i class="fas fa-calendar-alt"></i>
+                    ${datum}
+                </div>
+                <h3>${titulek}</h3>
+                <p>${popis}</p>
+                ${linkHtml}
+            </div>
+        `;
+    }
+
+    // Zobrazí aktuality na stránce
+    async displayAktuality() {
+        const xmlDoc = await this.loadXML();
+        if (!xmlDoc) return;
+
+        const container = document.querySelector(this.containerSelector);
+        if (!container) return;
+
+        const polozky = xmlDoc.querySelectorAll('polozka');
+        
+        if (polozky.length === 0) {
+            container.innerHTML = `
+                <div class="aktuality-empty">
+                    <p>Momentálně žádné aktuality.</p>
+                </div>
+            `;
+            return;
+        }
+
+        let html = '';
+        polozky.forEach(polozka => {
+            html += this.createAktualityItem(polozka);
+        });
+
+        container.innerHTML = html;
+    }
+
+    // Inicializace - zavolá se při načtení stránky
+    init() {
+        document.addEventListener('DOMContentLoaded', () => {
+            this.displayAktuality();
+        });
+    }
+}
+
+// Vytvoření instance a inicializace
+const aktualityManager = new AktualityManager();
+aktualityManager.init();

aktuality.xml

@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<aktuality>
+    <polozka>
+        <typ>Sleva</typ>
+        <datum>24. listopadu 2025</datum>
+        <titulek>Black Friday týden - Slevy až 30%</titulek>
+        <popis>Připravili jsme pro vás speciální nabídku na vybrané whisky a rumy. Navštivte naši prodejnu a využijte slevy až 30% na prémiové destiláty.</popis>
+        <link>katalog-zbozi.html</link>
+        <linkText>Zobrazit nabídku</linkText>
+    </polozka>
+    <polozka>
+        <typ>Novinka</typ>
+        <datum>20. listopadu 2025</datum>
+        <titulek>Nová kolekce japonské whisky</titulek>
+        <popis>Právě jsme rozšířili naši nabídku o exkluzivní japonské whisky z palírny Yamazaki. Limitovaná edice je nyní k dispozici v našem sortimentu.</popis>
+        <link>katalog-zbozi.html#whisky</link>
+        <linkText>Prohlédnout si</linkText>
+    </polozka>
+    <polozka>
+        <typ>Akce</typ>
+        <datum>15. listopadu 2025</datum>
+        <titulek>Adventní degustace 2025</titulek>
+        <popis>Připravujeme tradiční adventní degustaci prémiových destilátů. Rezervujte si místo včas a objevte nové chutě před Vánoci.</popis>
+    </polozka>
+</aktuality>

index.html

@@ -334,14 +334,126 @@ nav ul li a:hover::after {
     line-height: 1.6;
 }
 
-/* Product Carousel */
+/* Aktuality Section */
-.products {
+.aktuality {
     padding: 80px 0;
-    background: linear-gradient(to bottom, var(--primary), rgba(255, 255, 255, 0.8));
+    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), var(--primary));
+}
+
+.aktuality-container {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 20px;
+}
+
+.aktuality-title {
+    font-family: 'Playfair Display', serif;
+    font-size: 36px;
+    margin-bottom: 60px;
+    color: var(--accent);
+    text-align: center;
+}
+
+.aktuality-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
+    gap: 30px;
+}
+
+.aktuality-card {
+    background: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(245, 245, 245, 0.8));
+    backdrop-filter: blur(5px);
+    border-radius: 8px;
+    padding: 30px;
+    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
+    border: 1px solid rgba(201, 169, 95, 0.1);
+    transition: var(--transition);
     position: relative;
     overflow: hidden;
 }
 
+.aktuality-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
+    border-color: rgba(201, 169, 95, 0.3);
+}
+
+.aktuality-badge {
+    position: absolute;
+    top: 15px;
+    right: 15px;
+    background: var(--accent);
+    color: var(--primary);
+    padding: 5px 12px;
+    border-radius: 20px;
+    font-size: 12px;
+    font-weight: 600;
+    text-transform: uppercase;
+}
+
+.aktuality-date {
+    color: var(--text-dark);
+    font-size: 14px;
+    margin-bottom: 15px;
+    display: flex;
+    align-items: center;
+}
+
+.aktuality-date i {
+    color: var(--accent);
+    margin-right: 8px;
+}
+
+.aktuality-card h3 {
+    font-size: 22px;
+    margin-bottom: 15px;
+    color: var(--accent);
+    line-height: 1.3;
+}
+
+.aktuality-card p {
+    font-size: 16px;
+    line-height: 1.6;
+    color: var(--text-dark);
+    margin-bottom: 20px;
+}
+
+.aktuality-link {
+    color: var(--accent);
+    text-decoration: none;
+    font-weight: 600;
+    display: inline-flex;
+    align-items: center;
+    transition: var(--transition);
+}
+
+.aktuality-link:hover {
+    transform: translateX(5px);
+}
+
+.aktuality-link i {
+    margin-left: 5px;
+    transition: var(--transition);
+}
+
+.aktuality-link:hover i {
+    transform: translateX(3px);
+}
+
+.aktuality-loading,
+.aktuality-error,
+.aktuality-empty {
+    text-align: center;
+    padding: 40px;
+    color: var(--text-dark);
+    font-size: 16px;
+}
+
+.aktuality-error {
+    color: #e74c3c;
+}
+
+/* Product Carousel */
 .products::before {
     content: '';
     position: absolute;
@@ -887,6 +999,9 @@ footer::before {
     .feature-grid {
         grid-template-columns: 1fr;
     }
+    .aktuality-grid {
+        grid-template-columns: 1fr;
+    }
     .carousel-item {
         flex: 0 0 calc(100% - 20px);
     }
@@ -1009,6 +1124,20 @@ footer::before {
             </div>
         </div>
     </section>
+
+        <!-- Aktuality Section -->
+    <section class="aktuality">
+        <div class="aktuality-container">
+            <h2 class="aktuality-title">Aktuality</h2>
+            <div class="aktuality-grid">
+                <!-- Aktuality budou načteny z XML souboru pomocí JavaScriptu -->
+                <div class="aktuality-loading">
+                    <p>Načítám aktuality...</p>
+                </div>
+            </div>
+        </div>
+    </section>
+    
     <!-- Product Carousel -->
     <section class="products" id="products">
         <div class="container">
@@ -1296,7 +1425,6 @@ footer::before {
             });
         });
     </script>
-    
+    <script src="aktuality.js"></script>
 </body>
 </html>
-``` 

katalog-zbozi.html

@@ -152,22 +152,30 @@ nav ul li a:hover::after { width: 100%; }
 /* Footer */
 footer {
     background: var(--primary);
-    padding: 60px 0 0; 
+    padding: 60px 0 30px;
     position: relative;
     overflow: hidden;
-    color: var(--text-dark);
+}
-    font-size: 14px;
+
-    line-height: 1.6;
+footer::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 1px;
+    background: linear-gradient(to right, transparent, var(--accent), transparent);
 }
 
 footer a {
-    color: inherit;
+    color: var(--text-dark);
     text-decoration: none;
-    transition: all 0.3s ease;
+    transition: var(--transition);
 }
 
 footer a:hover {
     color: var(--accent);
+    transform: translateX(5px);
 }
 
 .footer-container {
@@ -176,57 +184,21 @@ footer a:hover {
     gap: 40px;
     max-width: 1200px;
     margin: 0 auto;
-    padding: 0 20px 40px;
+    padding: 0 20px;
-    position: relative;
-}
-
-.footer-container::after {
-    content: '';
-    position: absolute;
-    bottom: 0;
-    left: 20px;
-    right: 20px;
-    height: 1px;
-    background: linear-gradient(to right, transparent, rgba(201,169,95,0.2), transparent);
-}
-
-.footer-info {
-    padding-right: 20px;
 }
 
 .footer-logo {
+    display: flex;
+    align-items: center;
     margin-bottom: 20px;
 }
 
-.footer-logo a {
-    display: inline-block;
-}
-
-.footer-logo img { 
-    max-width: 200px; 
-    height: auto;
-    transition: transform 0.3s ease;
-}
-
-.footer-logo img:hover {
-    transform: translateY(-2px);
-}
-
-.footer-info p {
-    margin-bottom: 20px;
-    color: rgba(255,255,255,0.7);
-    font-size: 15px;
-    line-height: 1.7;
-}
-
 .footer-title {
-    font-size: 18px; 
+    font-size: 20px;
-    margin-bottom: 25px; 
+    margin-bottom: 20px;
-    color: white; 
+    color: var(--accent);
     position: relative;
     padding-bottom: 10px;
-    font-weight: 600; 
-    letter-spacing: 0.5px;
 }
 
 .footer-title::after {
@@ -237,49 +209,22 @@ footer a:hover {
     width: 40px;
     height: 2px;
     background: var(--accent);
-    transition: width 0.3s ease; 
-}
-
-.footer-links-section:hover .footer-title::after {
-    width: 60px;
 }
 
 .footer-links {
     list-style: none;
-    padding: 0;
-    margin: 0;
 }
 
 .footer-links li {
-    margin-bottom: 12px; 
+    margin-bottom: 10px;
-    position: relative; 
-    padding-left: 0;
-    transition: all 0.3s ease;
-}
-
-.footer-links li::before { 
-    display: none;
 }
 
 .footer-links a {
-    color: rgba(255,255,255,0.7); 
+    color: var(--text-dark);
     text-decoration: none;
     font-size: 14px;
-    transition: all 0.3s ease; 
+    transition: var(--transition);
     display: inline-block;
-    padding: 4px 0;
-    position: relative;
-}
-
-.footer-links a::after {
-    content: '';
-    position: absolute;
-    width: 0;
-    height: 1px;
-    bottom: 0;
-    left: 0;
-    background-color: var(--accent);
-    transition: width 0.3s ease;
 }
 
 .footer-links a:hover {
@@ -287,38 +232,24 @@ footer a:hover {
     transform: translateX(5px);
 }
 
-.footer-links a:hover::after {
-    width: 100%;
-}
-
 .footer-contact p {
     display: flex;
-    align-items: flex-start; 
+    align-items: center;
-    color: rgba(255,255,255,0.7); 
+    color: var(--text-dark);
     margin-bottom: 15px;
     font-size: 14px;
-    line-height: 1.6;
-    transition: all 0.3s ease;
-}
-
-.footer-contact p:hover {
-    color: white;
 }
 
 .footer-contact i {
     color: var(--accent);
-    margin-right: 12px; 
+    margin-right: 10px;
     font-size: 16px;
-    margin-top: 3px; 
-    flex-shrink: 0; 
-    width: 16px;
-    text-align: center;
 }
 
 .social-links {
     display: flex;
-    gap: 12px; 
+    gap: 15px;
-    margin-top: 25px; 
+    margin-top: 20px;
 }
 
 .social-icon {
@@ -327,177 +258,27 @@ footer a:hover {
     justify-content: center;
     width: 40px;
     height: 40px;
-    background: rgba(201,169,95,0.1); 
+    background: rgba(255, 255, 255, 0.05);
-    border-radius: 8px; 
+    border-radius: 50%;
     color: var(--accent);
-    font-size: 16px; 
+    font-size: 18px;
-    transition: all 0.3s ease; 
+    transition: var(--transition);
     text-decoration: none;
-    border: 1px solid rgba(201,169,95,0.2);
 }
 
 .social-icon:hover {
     background: var(--accent);
     color: var(--primary);
-    transform: translateY(-3px); 
+    transform: translateY(-5px);
-    box-shadow: 0 5px 15px rgba(201,169,95,0.3); 
 }
 
-/* Category Filter in Footer */
-.category-filter { 
-    margin-bottom: 15px; 
-}
-
-.category-buttons { 
-    display: flex; 
-    flex-wrap: wrap; 
-    gap: 8px; 
-    margin-bottom: 10px; 
-}
-
-.category-btn { 
-    padding: 6px 14px; 
-    background: rgba(255,255,255,0.05); 
-    border: 1px solid rgba(255,255,255,0.1); 
-    border-radius: 20px; 
-    font-size: 12px; 
-    color: rgba(255,255,255,0.8); 
-    cursor: pointer; 
-    transition: all 0.3s ease;
-    font-weight: 500;
-    letter-spacing: 0.3px;
-}
-
-.category-btn:hover { 
-    background: rgba(201,169,95,0.2); 
-    color: white;
-    transform: translateY(-1px);
-}
-
-.category-btn.active { 
-    background: var(--accent); 
-    color: var(--primary); 
-    border-color: var(--accent);
-    font-weight: 600;
-    box-shadow: 0 4px 12px rgba(201,169,95,0.2);
-}
-
-/* Footer Bottom */
 .footer-bottom {
-    padding: 30px 0; 
+    text-align: center;
-    color: rgba(255,255,255,0.6);
+    padding-top: 40px;
-    font-size: 13px;
+    margin-top: 40px;
-    position: relative;
+    border-top: 1px solid rgba(255, 255, 255, 0.05);
-    background: rgba(0,0,0,0.1);
+    font-size: 14px;
-}
+    color: var(--text-dark);
-
-.footer-bottom-content {
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 0 20px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    flex-wrap: wrap;
-    gap: 20px;
-}
-
-.footer-copyright p {
-    margin: 0;
-    line-height: 1.7;
-}
-
-.legal-links {
-    display: flex;
-    align-items: center;
-    flex-wrap: wrap;
-    gap: 8px;
-    margin-top: 10px;
-}
-
-.legal-link {
-    color: rgba(255,255,255,0.6);
-    transition: color 0.3s ease;
-    font-size: 12px;
-}
-
-.legal-link:hover {
-    color: var(--accent);
-}
-
-.divider {
-    color: rgba(255,255,255,0.2);
-    font-size: 12px;
-}
-
-.footer-credits {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    font-size: 13px;
-}
-
-.footer-credits p {
-    margin: 0;
-    color: rgba(255,255,255,0.6);
-}
-
-.dev-link {
-    display: inline-flex;
-    align-items: center;
-    gap: 4px;
-    color: var(--accent) !important;
-    font-weight: 600;
-    transition: all 0.3s ease;
-}
-
-.dev-link:hover {
-    transform: translateY(-1px);
-}
-
-.dev-link svg {
-    transition: transform 0.3s ease;
-}
-
-.dev-link:hover svg {
-    transform: translateX(2px);
-}
-
-.back-to-top {
-    position: fixed;
-    bottom: 30px;
-    right: 30px;
-    width: 46px;
-    height: 46px;
-    border-radius: 50%;
-    background: var(--accent);
-    color: var(--primary);
-    border: none;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    cursor: pointer;
-    opacity: 0;
-    visibility: hidden;
-    transform: translateY(20px);
-    transition: all 0.3s ease;
-    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
-    z-index: 99;
-}
-
-.back-to-top.visible {
-    opacity: 1;
-    visibility: visible;
-    transform: translateY(0);
-}
-
-.back-to-top:hover {
-    transform: translateY(-3px) scale(1.05);
-    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
-}
-
-.back-to-top:active {
-    transform: translateY(0) scale(0.98);
 }
 
 /* Responsive Styles */
@@ -506,41 +287,16 @@ footer a:hover {
         grid-template-columns: repeat(2, 1fr);
         gap: 30px;
     }
-    
-    .footer-bottom-content {
-        flex-direction: column;
-        text-align: center;
-    }
-    
-    .footer-credits {
-        margin-top: 10px;
-    }
 }
 
 @media (max-width: 768px) {
     footer {
-        padding: 50px 0 0;
+        padding: 50px 0 30px;
     }
     
     .footer-container {
         grid-template-columns: 1fr;
         gap: 40px;
-        padding-bottom: 30px;
-    }
-    
-    .footer-info {
-        padding-right: 0;
-    }
-    
-    .footer-logo img {
-        max-width: 180px;
-    }
-    
-    .back-to-top {
-        width: 42px;
-        height: 42px;
-        bottom: 20px;
-        right: 20px;
     }
 }
 

o-nas.html

@@ -339,6 +339,125 @@ nav ul li a:hover::after {
     width: 20px;
 }
 
+/* Aktuality Section */
+.aktuality {
+    padding: 80px 0;
+    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), var(--primary));
+}
+
+.aktuality-container {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 20px;
+}
+
+.aktuality-title {
+    font-family: 'Playfair Display', serif;
+    font-size: 36px;
+    margin-bottom: 60px;
+    color: var(--accent);
+    text-align: center;
+}
+
+.aktuality-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
+    gap: 30px;
+}
+
+.aktuality-card {
+    background: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(245, 245, 245, 0.8));
+    backdrop-filter: blur(5px);
+    border-radius: 8px;
+    padding: 30px;
+    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
+    border: 1px solid rgba(201, 169, 95, 0.1);
+    transition: var(--transition);
+    position: relative;
+    overflow: hidden;
+}
+
+.aktuality-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
+    border-color: rgba(201, 169, 95, 0.3);
+}
+
+.aktuality-badge {
+    position: absolute;
+    top: 15px;
+    right: 15px;
+    background: var(--accent);
+    color: var(--primary);
+    padding: 5px 12px;
+    border-radius: 20px;
+    font-size: 12px;
+    font-weight: 600;
+    text-transform: uppercase;
+}
+
+.aktuality-date {
+    color: var(--text-dark);
+    font-size: 14px;
+    margin-bottom: 15px;
+    display: flex;
+    align-items: center;
+}
+
+.aktuality-date i {
+    color: var(--accent);
+    margin-right: 8px;
+}
+
+.aktuality-card h3 {
+    font-size: 22px;
+    margin-bottom: 15px;
+    color: var(--accent);
+    line-height: 1.3;
+}
+
+.aktuality-card p {
+    font-size: 16px;
+    line-height: 1.6;
+    color: var(--text-dark);
+    margin-bottom: 20px;
+}
+
+.aktuality-link {
+    color: var(--accent);
+    text-decoration: none;
+    font-weight: 600;
+    display: inline-flex;
+    align-items: center;
+    transition: var(--transition);
+}
+
+.aktuality-link:hover {
+    transform: translateX(5px);
+}
+
+.aktuality-link i {
+    margin-left: 5px;
+    transition: var(--transition);
+}
+
+.aktuality-link:hover i {
+    transform: translateX(3px);
+}
+
+.aktuality-loading,
+.aktuality-error,
+.aktuality-empty {
+    text-align: center;
+    padding: 40px;
+    color: var(--text-dark);
+    font-size: 16px;
+}
+
+.aktuality-error {
+    color: #e74c3c;
+}
+
 /* CTA Section */
 .cta {
     padding: 80px 0;
@@ -659,6 +778,9 @@ footer::before {
     .info-grid {
         grid-template-columns: 1fr;
     }
+    .aktuality-grid {
+        grid-template-columns: 1fr;
+    }
     .footer-container {
         grid-template-columns: 1fr;
     }
@@ -799,6 +921,19 @@ footer::before {
         </div>
     </section>
 
+    <!-- Aktuality Section -->
+    <section class="aktuality">
+        <div class="aktuality-container">
+            <h2 class="aktuality-title">Aktuality</h2>
+            <div class="aktuality-grid">
+                <!-- Aktuality budou načteny z XML souboru pomocí JavaScriptu -->
+                <div class="aktuality-loading">
+                    <p>Načítám aktuality...</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
     <!-- CTA Section -->
     <section class="cta">
         <div class="cta-container">
@@ -858,6 +993,7 @@ footer::before {
         </div>
     </footer>
 
+    <script src="aktuality.js"></script>
     <script>
         document.addEventListener('DOMContentLoaded', function() {
             const hamburger = document.getElementById('hamburger');