asdas

assets/script.js

@@ -0,0 +1,14 @@
+document.addEventListener('DOMContentLoaded', function() {
+    const toggleBtn = document.getElementById('toggle_btn');
+    const toggleBtnIcon = document.getElementById('toggle_btn_icon');
+    const dropDownMenu = document.getElementById('dropdown_menu');
+
+    toggleBtn.addEventListener('click', function() {
+        dropDownMenu.classList.toggle('open');
+        const isOpen = dropDownMenu.classList.contains('open');
+
+        toggleBtnIcon.classList = isOpen
+        ? 'ri-close-line'
+        : 'ri-menu-line';
+    }, false);
+}, false);

assets/style.css

@@ -0,0 +1,303 @@
+:root {
+    --pico-background-color: #474747;
+    --pico-color: #c2c7d0;
+    --pico-text-selection-color: rgb(207, 219, 224);
+    --pico-muted-color: #7b8495;
+    --pico-muted-border-color: #202632;
+    --pico-primary: #acc487;
+    --pico-primary-background: #6e6e6e;
+    --pico-primary-border: var(--pico-primary-background);
+    --pico-primary-underline: rgba(1, 170, 255, 0.5);
+    --pico-primary-hover: #3c423a;
+    --pico-primary-hover-background: #999ea1;
+    --pico-primary-hover-border: var(--pico-primary-hover-background);
+    --pico-primary-hover-underline: var(--pico-primary-hover);
+    --pico-primary-focus: rgb(119, 119, 119);
+    --pico-primary-inverse: #fff;
+    --pico-secondary: #969eaf;
+    --pico-secondary-background: #525f7a;
+    --pico-secondary-border: var(--pico-secondary-background);
+    --pico-secondary-underline: rgba(150, 158, 175, 0.5);
+    --pico-secondary-hover: #b3b9c5;
+    --pico-secondary-hover-background: #5d6b89;
+    --pico-secondary-hover-border: var(--pico-secondary-hover-background);
+    --pico-secondary-hover-underline: var(--pico-secondary-hover);
+    --pico-secondary-focus: rgba(144, 158, 190, 0.25);
+    --pico-secondary-inverse: #fff;
+    --pico-contrast: #dfe3eb;
+    --pico-contrast-background: #eff1f4;
+    --pico-contrast-border: var(--pico-contrast-background);
+    --pico-contrast-underline: rgba(223, 227, 235, 0.5);
+    --pico-contrast-hover: #fff;
+    --pico-contrast-hover-background: #fff;
+    --pico-contrast-hover-border: var(--pico-contrast-hover-background);
+    --pico-contrast-hover-underline: var(--pico-contrast-hover);
+    --pico-contrast-focus: rgba(207, 213, 226, 0.25);
+    --pico-contrast-inverse: #000;
+    --pico-box-shadow: 0.0145rem 0.029rem 0.174rem rgba(7, 9, 12, 0.01698), 0.0335rem 0.067rem 0.402rem rgba(7, 9, 12, 0.024), 0.0625rem 0.125rem 0.75rem rgba(7, 9, 12, 0.03), 0.1125rem 0.225rem 1.35rem rgba(7, 9, 12, 0.036), 0.2085rem 0.417rem 2.502rem rgba(7, 9, 12, 0.04302), 0.5rem 1rem 6rem rgba(7, 9, 12, 0.06), 0 0 0 0.0625rem rgba(7, 9, 12, 0.015);
+    --pico-h1-color: #f0f1f3;
+    --pico-h2-color: #e0e3e7;
+    --pico-h3-color: #c2c7d0;
+    --pico-h4-color: #b3b9c5;
+    --pico-h5-color: #a4acba;
+    --pico-h6-color: #8891a4;
+    --pico-mark-background-color: #014063;
+    --pico-mark-color: #fff;
+    --pico-ins-color: #62af9a;
+    --pico-del-color: #ce7e7b;
+    --pico-blockquote-border-color: var(--pico-muted-border-color);
+    --pico-blockquote-footer-color: var(--pico-muted-color);
+    --pico-button-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+    --pico-button-hover-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+    --pico-table-border-color: var(--pico-muted-border-color);
+    --pico-table-row-stripped-background-color: rgba(111, 120, 135, 0.0375);
+    --pico-code-background-color: #1a1f28;
+    --pico-code-color: #8891a4;
+    --pico-code-kbd-background-color: var(--pico-color);
+    --pico-code-kbd-color: var(--pico-background-color);
+    --pico-form-element-background-color: #a8a8a8;
+    --pico-form-element-selected-background-color: #2a3140;
+    --pico-form-element-border-color: #2a3140;
+    --pico-form-element-color: #e0e3e7;
+    --pico-form-element-placeholder-color: #8891a4;
+    --pico-form-element-active-background-color: #424242;
+    --pico-form-element-active-border-color: var(--pico-primary-border);
+    --pico-form-element-focus-color: var(--pico-primary-border);
+    --pico-form-element-disabled-opacity: 0.5;
+    --pico-form-element-invalid-border-color: #964a50;
+    --pico-form-element-invalid-active-border-color: #b7403b;
+    --pico-form-element-invalid-focus-color: var(--pico-form-element-invalid-active-border-color);
+    --pico-form-element-valid-border-color: #2a7b6f;
+    --pico-form-element-valid-active-border-color: #16896a;
+    --pico-form-element-valid-focus-color: var(--pico-form-element-valid-active-border-color);
+    --pico-switch-background-color: #333c4e;
+    --pico-switch-checked-background-color: var(--pico-primary-background);
+    --pico-switch-color: #fff;
+    --pico-switch-thumb-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+    --pico-range-border-color: #202632;
+    --pico-range-active-border-color: #2a3140;
+    --pico-range-thumb-border-color: var(--pico-background-color);
+    --pico-range-thumb-color: var(--pico-secondary-background);
+    --pico-range-thumb-active-color: var(--pico-primary-background);
+    --pico-accordion-border-color: var(--pico-muted-border-color);
+    --pico-accordion-active-summary-color: var(--pico-primary-hover);
+    --pico-accordion-close-summary-color: var(--pico-color);
+    --pico-accordion-open-summary-color: var(--pico-muted-color);
+    --pico-card-background-color: #181c25;
+    --pico-card-border-color: var(--pico-card-background-color);
+    --pico-card-box-shadow: var(--pico-box-shadow);
+    --pico-card-sectioning-background-color: #1a1f28;
+    --pico-dropdown-background-color: #181c25;
+    --pico-dropdown-border-color: #202632;
+    --pico-dropdown-box-shadow: var(--pico-box-shadow);
+    --pico-dropdown-color: var(--pico-color);
+    --pico-dropdown-hover-background-color: #202632;
+    --pico-loading-spinner-opacity: 0.5;
+    --pico-modal-overlay-background-color: rgba(8, 9, 10, 0.75);
+    --pico-progress-background-color: #202632;
+    --pico-progress-color: var(--pico-primary-background);
+    --pico-tooltip-background-color: var(--pico-contrast-background);
+    --pico-tooltip-color: var(--pico-contrast-inverse); 
+}
+
+body, html {
+    margin: 0;
+    padding: 0;
+    font-family: Arial, sans-serif;
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+    align-items: center;
+    width: 100%;
+}
+
+header #top {
+    background-image: url(/assets/bambus.jpg);
+    background-repeat: repeat !important;
+    color: #fff;
+    text-shadow: #363636 5px 4px;
+    padding: 20px;
+    text-align: center;
+}
+
+header {
+    padding: 0 !important;
+    flex-direction: column;
+}
+
+header > * {
+    width: 100%;
+}
+
+header nav {
+    display: flex;
+    align-items: center;
+    flex-grow: 1;
+    background-color: #3d3d3d;
+    padding: 0;
+    margin: 0;
+    text-align: center;
+    text-decoration: none;
+    list-style: none;
+    box-sizing: border-box;
+}
+
+header nav > * {
+    display: flex;
+    align-items: center;
+    flex-direction: row;
+    list-style: none;
+    padding: 0;
+    justify-content: center;
+    width: 100%;
+    margin: 0 10px;
+}
+
+header nav > *, header nav > .dropdown > *, header nav > .dropdown > .dropdown-content > * {
+    color: #dfd07a !important;
+    text-decoration: none;
+    white-space: nowrap;
+    width: fit-content;
+}
+
+header nav p, header nav a {
+    text-decoration: none;
+} 
+
+nav a:hover {
+    color: rgb(189, 189, 42);
+}
+
+.dropdown {
+    position: relative;
+    display: inline-block;
+}
+
+.dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: #585a59;
+    min-width: 100px;
+    z-index: 1;
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+
+.dropdown-content a {
+    color: #fff;
+    padding: 12px 16px;
+    text-decoration: none;
+    display: block;
+}
+
+.dropdown-content a:hover {
+    background-color: #363636;
+}
+
+section {
+    padding: 20px;
+}
+
+footer {
+    background-color: #333333c7;
+    color: #fff;
+    text-align: center;
+    padding: 10px 0;
+    position: fixed;
+    width: 100%;
+    bottom: 0;
+}
+
+footer, header {
+    text-align: center;
+    padding: 10px 0;
+    display: flex;
+    align-items: center;
+    width: 100%;
+}
+
+footer > * {
+    display: inline;
+    flex: 1;
+}
+
+header {
+    padding-top: 0;
+}
+
+main {
+    display: flex;
+    flex-grow: 1;
+    align-items: center;
+    flex-direction: column;
+    width: 60%;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    text-align: center;
+}
+
+#dropdown_menu {
+    top: 0;
+    width: fit-content;
+    display: flex;
+    left: auto;
+    gap: 2rem;
+}
+
+#dropdown_menu li {
+    padding: 0.7rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+#dropdown_menu .action_btn {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+}
+
+#toggle_btn {
+    display: none;
+    color: #fff;
+    font-size: 1.5rem;
+    cursor: pointer;
+}
+
+/* RESPONSIVE DESIGN */
+@media(max-width: 500px) {
+
+    #toggle_btn {
+        display: block;
+        z-index: 200;
+    }
+
+    .dropdown-content {
+        display: block;
+        position: relative;
+    }
+
+    #dropdown_menu {
+        gap: unset;
+        position: fixed;
+        height: 0;
+        left: 0;
+        top: 0;
+        width: 100%;
+        background: rgba(0, 0, 0, 0.4);
+        backdrop-filter: blur(15px);
+        border-radius: 10px;
+        overflow: hidden;
+        flex-direction: column;
+        transition: height .2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+        z-index: 100;
+        margin: 0;
+    }
+
+    #dropdown_menu.open {
+        height: 280px;
+    }
+}

assets/tabulka.css

@@ -0,0 +1,34 @@
+body {
+    font-family: Arial, sans-serif;    
+}
+
+h1 {
+    text-align: center;
+}
+
+table {
+    width: 120%;
+    border-collapse: collapse;
+    margin: 20px 0; font-family:serif;
+    font-size: 18px;
+    text-align: left;
+}
+
+th, td {
+    color: #c2c2c2 !important;
+    padding: 13px;
+    border-bottom: 4px solid #000000;
+    border: 2px  solid #000000
+}
+
+th {
+    background-color: #3752346b;
+}
+
+tbody tr:nth-child  {
+    background-color: #c0c0c0;
+}
+
+tbody tr:hover   > td {
+    background-color: #7a7a7a;
+}

index.php

@@ -0,0 +1,37 @@
+<?php
+$skeleton = file_get_contents('templates/skeleton.html');
+
+$menu_obsah = file_get_contents('templates/header.html');
+$out = str_replace('__TEMPLATE_HEADER__', $menu_obsah, $skeleton);
+
+$footer_obsah = file_get_contents('templates/footer.html');
+$out = str_replace('__TEMPLATE_FOOTER__', $footer_obsah, $out);
+
+$nazov_stranky = basename($_SERVER['QUERY_STRING']);
+if (empty($nazov_stranky)){
+    $nazov_stranky = 'index';
+}
+
+$cesta_k_stranke = "stranky/$nazov_stranky.html";
+if (!file_exists($cesta_k_stranke)) {
+    $cesta_k_stranke = "templates/404.html";
+}
+$stranka_obsah = file_get_contents($cesta_k_stranke);
+$out = str_replace('__TEMPLATE_STRANKA__', $stranka_obsah, $out);
+
+$cesta_k_skriptu = "scripty/$nazov_stranky.js";
+$script_obsah = "<script src=\"$cesta_k_skriptu\"></script>";
+if (!file_exists($cesta_k_skriptu)){
+    $script_obsah = '';
+}
+$out = str_replace('__TEMPLATE_SCRIPT__', $script_obsah, $out);
+
+$cesta_k_stylu = "styly/$nazov_stranky.css";
+$style_obsah = "<link rel=\"stylesheet\" href=\"$cesta_k_stylu\">";
+if (!file_exists($cesta_k_stylu)){
+    $style_obsah = '';
+}
+$out = str_replace('__TEMPLATE_STYLE__', $style_obsah, $out);
+
+echo $out;
+?>

old/bambus.jpg

@@ -0,0 +1 @@
+$R<18>0<EFBFBD><30><EFBFBD>h<EFBFBD>v<EFBFBD><76>>-<2D><>h<EFBFBD>$<24>Z)ݣ6<>]4<>}6ӎ<36><D38E>M<EFBFBD><4D>Mt<4D>m5<6D>N<EFBFBD><4E>m8<6D>N<EFBFBD><4E>1<EFBFBD>$R#<23><>

old/index.html

@@ -2,7 +2,7 @@
     <meta charset="UTF-8">
     <meta name="keywords" content="Bambusove ponozky, ponozky, bambusove ponozky za dobru cenu" viewport="">
     <title>Bambusové ponožky</title>
-    
+    <link rel="icon" type="image/x-icon" href="ponozka.png">
 
     <style>
         body {
@@ -170,7 +170,7 @@
         <h2>Lacnejšie</h2>
         <p>Tu môžete nájsť Lacnejšie ponožky:</p>
         <ul>
-            <li><a href="https://example.com/cheap-bamboo-socks-1">Lacnejšie ponožky</a></li>
+            <li><a href="https://ecobamboo.sk/sk-SK/product/82003P-W/Bambusove-klasicke-ponozky-damske">Lacnejšie ponožky</a></li>
         </ul>
     </section>
 
@@ -178,7 +178,7 @@
         <h2>Drahšie</h2>
         <p>Tu môžete nájsť Drahšie ponožky:</p>
         <ul>
-            <li><a href="https://example.com/Quite expensive-bamboo-socks-1">Drahšie ponožky</a></li>
+            <li> <a href="https://www.trenirkaren.sk/panske-ponozky/163729-10pack-ponozky-styx-nizke-bambusove-cierne-10hbn960.html?gad_source=1&gclid=CjwKCAjwmYCzBhA6EiwAxFwfgExqTdhD8HGqHI4OafdxnkXdGbxlYoJLlT5uy__0LdTcjw8IjrTvrBoC7fgQAvD_BwE#/22-velkost-m">Drahšie ponožky</a></li>
         </ul>
     </section>
 
@@ -186,7 +186,7 @@
         <h2>Najdrahšie</h2>
         <p>Tu môžete nájsť Najdrahšie ponožky:</p>
         <ul>
-            <li><a href="https://example.com/Expensive-bamboo-socks-1">Najdrahšie ponožky</a></li>
+            <li><a href="https://www.trenirkaren.sk/panske-ponozky/162497-10pack-ponozky-styx-clenkove-bambusove-cierne-10hbk960.html?gad_source=1&gclid=CjwKCAjwmYCzBhA6EiwAxFwfgFD14oeQOxriGY8n4Gd-7CbWGguXAlA81t3KvUPqpVvP25RXSlahQxoC9dsQAvD_BwE#/21-velkost-l">Najdrahšie ponožky</a></li>
         </ul>
     </section>
 
@@ -198,7 +198,7 @@
         </ul>
     </section>
     <footer>
-        © 2024 Moje bambusove ponožky. Všetok copyright je môj :P .
+        © 2024 Moje bambusove ponožky. Copyright rezervovaný.
     </footer>
 
     <script>
@@ -252,20 +252,20 @@
     
 <div class="wrapper">
     <form action="">
-        <h1>Login</h1>
+        <h1>Prihlásenie do účtu</h1>
         <div class="input-box">
-            <input type="text" placeholder="Username">
+            <input type="text" placeholder="Používateľské meno">
         </div>
         <div class="input-box">
             <input type="password"
-            placeholder="Password" required>
+            placeholder="Heslo" required>
         </div>
         <div class="remember-forgot">
-            <label><input type="checkbox">Remember me </label>
-            <a href="#">Forgot password? </a>
-            <button type="submit" class="btn">Login</button>
+            <label><input type="checkbox">Zapamätať si ma </label>
+            <a href="#">Zabudli ste heslo? </a>
+            <button type="submit" class="btn">Prihlásiť sa</button>
             <div class="register-link">
-                <p>Dont have an account? <a href="#">Register</a></p>
+                <p>Nemáte účet? <a href="#">Zaregistrovať sa</a></p>
             </div>
         </div>
     </form>

old/ponozka.png

@@ -0,0 +1 @@
+<1F><>aH<61><15>N:<3A><>

stranky/drahe.html

@@ -0,0 +1,9 @@
+<h2>Najdrahšie</h2>
+        <p>Tu môžete nájsť Najdrahšie ponožky:</p>
+        <ul>
+            <a href="https://trenirkaren.vshcdn.net/782101-large_default/10pack-ponozky-styx-clenkove-bambusove-cierne-10hbk960.jpg"
+                download><img
+                    src="https://trenirkaren.vshcdn.net/782101-large_default/10pack-ponozky-styx-clenkove-bambusove-cierne-10hbk960.jpg" width="300" height="350"></a>
+            <li><a href="https://www.trenirkaren.sk/panske-ponozky/162497-10pack-ponozky-styx-clenkove-bambusove-cierne-10hbk960.html?gad_source=1&gclid=CjwKCAjwmYCzBhA6EiwAxFwfgFD14oeQOxriGY8n4Gd-7CbWGguXAlA81t3KvUPqpVvP25RXSlahQxoC9dsQAvD_BwE#/21-velkost-l">Najdrahšie ponožky</a>
+            </li>
+        </ul>

stranky/formular.html

@@ -0,0 +1,58 @@
+<form method="get">
+    <br>
+    <label for="email">Tu si môžete zadať email:</label><br>
+    <br>
+    <input type="email" id="email" name="email">
+    <input type="submit" value="Odoslať">
+    <hr>
+</form>
+<form method="get">
+    <br>
+    <label>Prihlásenie sa</label><br><br>
+        <label for="username">Používateľské meno:</label><br>
+        <input type="text" id="username" name="username"><br>
+        <label for="pwd">Heslo:</label><br>
+        <input type="password" id="pwd" name="pwd">
+        <input type="submit" value="Odoslať">
+    </form>
+    <hr>
+<form action="/action_page.php" method="get" name="prihlasenie">
+    <!-- method moze naberat dve hodnoty post alebo algebricky, default je get-->
+    <br>
+    <label>Tu si zadajte meno a priezvisko</label>
+    <br>
+    <br>
+    <label for="name">Meno</label><br>
+    <input type="text" id="name" name="fname" value="Fero"><br>
+    <br>
+    <label for="name1">Priezvisko</label><br>
+    <input type="text" id="name1" name="1name" value="Mrkvicka"><br><br>
+    <input type="submit" value="Odoslať">
+    <hr>
+
+    <br>
+        <label for="gender">Pohlavie</label><br><br>
+        <input type="radio" id="idmale" name="gender" value="male">
+        <label for="idmale">Muž</label><br>
+        <input type="radio" id="idfemale" name="gender" value="female">
+        <label for="idfemale">Žena</label><br>
+        <input type="radio" id="idother" name="gender" value="other">
+        <label for="idother">Iné</label><br><br>
+        <input type="submit" value="Odoslať">
+        <hr>
+
+
+        
+            <laber for="roknarodenia">Rok narodenia</laber>
+            <br><br>
+            <input type="date" id="datemin" name="datemin" min="1000-01-01"><br><br>
+            <input type="submit" value="Odoslať">
+        <hr>
+        </form>  <br>
+        <form>
+            <label for="favcolor">Select your favorite color:</label><br>
+            <br>
+            <input type="color" id="favcolor" name="favcolor">
+            <br><br>
+            <input type="submit" value="Odoslať">
+        </form>

stranky/index.html

@@ -0,0 +1,6 @@
+<h1>O nás</h1>
+        <p>Vitajte na našej stránke s najlepšími bambusovými ponožkami.<br><br>
+                <h2>Prečo Bambus?</h2><br>
+              <p> Bambus je úžasný materiál, ktorý je nielen neuveriteľne mäkký a prievzdušný, ale aj prirodzene antibakteriálny a hypoalergénny. 
+                Naše bambusové ponožky vám poskytujú maximálne pohodlie počas celého dňa, pričom zároveň pomáhajú chrániť našu planétu. 
+                Bambus rastie rýchlo a nevyžaduje chemické pesticídy ani hnojivá, čo z neho robí ideálny udržateľný zdroj.</p>

stranky/kontakt.html

@@ -0,0 +1,7 @@
+<h1>Kontakty</h1>
+        <p><h2>Tu nás môžete kontaktovať:</h2></p>
+        Email: BambusPonozky@gmail.com <br>
+        Ig: BambusovePonozky.majstrovke<br>
+        TT: Majster_a_ponozky
+<br> <br>
+        <iframe width="560" height="315" src="https://www.youtube.com/embed/aiGdn6T21RE?si=hctZiODvAZUoyOsZ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

stranky/lacne.html

@@ -0,0 +1,9 @@
+<h2>Lacnejšie</h2>
+<p>Tu môžete nájsť Lacnejšie ponožky:</p>
+<ul>
+    <a href="https://ecobamboo.sk/_next/image?url=https%3A%2F%2Fcdn.ecobm.cz%2Fcore%2Fmedia%2Fproducts%2F82003P%2FW%2F82003_DxG_W1.jpg&w=1920&q=75"
+        download><img
+            src="https://ecobamboo.sk/_next/image?url=https%3A%2F%2Fcdn.ecobm.cz%2Fcore%2Fmedia%2Fproducts%2F82003P%2FW%2F82003_DxG_W1.jpg&w=1920&q=75" width="300" height="350"></a>
+    <li><a href="https://ecobamboo.sk/sk-SK/product/82003P-W/Bambusove-klasicke-ponozky-damske">Lacnejšie ponožky</a>
+    </li>
+</ul>

stranky/stredne.html

@@ -0,0 +1,9 @@
+<h2>Drahšie</h2>
+        <p>Tu môžete nájsť Drahšie ponožky:</p>
+        <ul>
+            <a href="https://trenirkaren.vshcdn.net/782100-large_default/10pack-ponozky-styx-nizke-bambusove-cierne-10hbn960.jpg"
+                download><img
+                    src="https://trenirkaren.vshcdn.net/782100-large_default/10pack-ponozky-styx-nizke-bambusove-cierne-10hbn960.jpg" width="300" height="350"></a>
+            <li><a href="https://www.trenirkaren.sk/panske-ponozky/163729-10pack-ponozky-styx-nizke-bambusove-cierne-10hbn960.html?gad_source=1&gclid=CjwKCAjwmYCzBhA6EiwAxFwfgExqTdhD8HGqHI4OafdxnkXdGbxlYoJLlT5uy__0LdTcjw8IjrTvrBoC7fgQAvD_BwE#/22-velkost-m">Drahsie ponožky</a>
+            </li>
+        </ul>

stranky/tabulka.html

@@ -0,0 +1,32 @@
+<head>  
+    <link rel="stylesheet" href="../assets/tabulka.css">
+</head>
+<body>
+    <h1>Dodávanie tovaru</h1><br>
+    <table>
+        <thead>
+            <tr>
+                <th>Typ</th>
+                <th>Čas</th>
+                <th>Kedy</th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr>
+                <td>Lacnejšie</td>
+                <td>Pred otvorením</td>
+                <td>Každý tretí deň</td>
+            </tr>
+            <tr>
+                <td>Drahšie</td>
+                <td>Pred otvorením - do obeda</td>
+                <td>Každý tretí deň</td>
+            </tr>
+            <tr>
+                <td>Najdrahšie</td>
+                <td>Na objednávku</td>
+                <td>Podľa zákazníka</td>
+            </tr>
+        </tbody>
+    </table>
+</body>

templates/404.html

@@ -0,0 +1 @@
+<h1>zlý request</h1>

templates/footer.html

@@ -0,0 +1,3 @@
+<footer>
+<p class="copyright"> 2024 Moje bambusove ponožky.</p>
+</footer>

templates/header.html

@@ -0,0 +1,22 @@
+<div id="top">
+    <h1>Bambusové ponožky od majstra</h1>
+</div>
+<nav>
+    <div id="toggle_btn">
+        <i id="toggle_btn_icon" class="ri-menu-line"></i>
+    </div>
+    <div id="dropdown_menu">
+        <a href="/index" id="homeLink">Domov</a>
+        <a href="/kontakt" class="socklink" data-idcko="contactLinkCont" id="contactLink">Kontakty</a>
+        <a href="/formular" class="socklink" data-idcko="formularLinkCont" id="formularLink">Formular</a>
+        <a href="/tabulka" class="socklink" data-idcko="tabulkaLinkCont" id="tabulkaLink">Dodávanie</a>
+        <div class="dropdown">
+            <a href="#" class="dropdown">Podľa ceny</a>
+            <div class="dropdown-content">
+                <a href="/lacne" id="lacnejsieLink">Lacnejšie</a>
+                <a href="/stredne" id="drahsieLink">Drahšie</a>
+                <a href="/drahe" id="najdrahsieLink">Najdrahšie</a>
+            </div>
+        </div>
+    </div>
+</nav>

templates/skeleton.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="sk" data-theme="dark">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="keywords" content="Bambusove ponozky, ponozky, bambusove ponozky za dobru cenu" viewport="">
+    <meta name="description" content="Bambusové ponožky od majstra">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <link rel="stylesheet" href="/assets/pico.min.css">
+    <link rel="stylesheet" href="/assets/fonts/remixicon/remixicon.css">
+    <link rel="stylesheet" href="/assets/style.css" />
+    <link rel="icon" href="/assets/icon.png" type="image/png">
+    <script src="/assets/script.js"></script>
+    <title>Bambusové ponožky</title>
+    __TEMPLATE_SCRIPT__
+    __TEMPLATE_STYLE__
+</head>
+
+<body>
+    <header>
+        __TEMPLATE_HEADER__
+    </header>
+    <main>
+        __TEMPLATE_STRANKA__
+    </main>
+    <footer>
+        __TEMPLATE_FOOTER__
+    </footer>
+</body>
+
+</html>