bruno robota

This commit is contained in:
Šimon Záriš 2024-06-09 16:24:41 +02:00
parent 230d342380
commit 950919e12b
12 changed files with 8325 additions and 14 deletions

File diff suppressed because one or more lines are too long

Binary file not shown.

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 2.3 MiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

4
assets/pico.min.css vendored Normal file

File diff suppressed because one or more lines are too long

@ -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);

@ -133,4 +133,60 @@ main {
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
text-align: center; 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;
}
.navbar #toggle_btn {
display: none;
color: #fff;
font-size: 1.5rem;
cursor: pointer;
}
/* RESPONSIVE DESIGN */
@media(max-width: 992px) {
.navbar #toggle_btn {
display: block;
}
#dropdown_menu {
gap: unset;
position: absolute;
height: 0;
right: 2rem;
top: 60px;
width: 300px;
background: rgba(255, 255, 255, 0.1);
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;
}
#dropdown_menu.open {
height: fit-content;
}
} }

@ -2,17 +2,21 @@
<h1>Bambusové ponožky od majstra</h1> <h1>Bambusové ponožky od majstra</h1>
</div> </div>
<nav> <nav>
<a href="/index" id="homeLink">Domov</a> <div id="toggle_btn">
<div class="dropdown"> <i class="toggle_btn_icon" id="ri-menu-line"></i>
<a href="#" class="dropdown">Podľa ceny</a> </div>
<div class="dropdown-content"> <div id="dropdown_menu">
<a href="/lacne" id="lacnejsieLink">Lacnejšie</a> <a href="/index" id="homeLink">Domov</a>
<a href="/stredne" id="drahsieLink">Drahšie</a> <div class="dropdown">
<a href="/drahe" id="najdrahsieLink">Najdrahšie</a> <a href="#" class="dropdown">Podľa ceny</a>
</div> <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>
<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">Tabuľka</a>
</div> </div>
<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">Tabuľka</a>
</nav> </nav>

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="sk"> <html lang="sk" data-theme="dark">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
@ -7,8 +7,10 @@
<meta name="description" content="Bambusové ponožky od majstra"> <meta name="description" content="Bambusové ponožky od majstra">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <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="stylesheet" href="/assets/style.css" />
<link rel="icon" href="360_F_125742655_7mmnRCr3o5ZPUfLOQT4exd100ICIkGOi.png" type="image/png"> <link rel="icon" href="/assets/icon.png" type="image/png">
<script src="/assets/script.js"></script> <script src="/assets/script.js"></script>
<title>Bambusové ponožky</title> <title>Bambusové ponožky</title>
__TEMPLATE_SCRIPT__ __TEMPLATE_SCRIPT__