simonja/ponozky
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bruno robota

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
assets/fonts/remixicon/remixicon.css Normal file
View File

File diff suppressed because one or more lines are too long

BIN
assets/fonts/remixicon/remixicon.eot Normal file
View File

Binary file not shown.

8230
assets/fonts/remixicon/remixicon.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 2.3 MiB

BIN
assets/fonts/remixicon/remixicon.ttf Normal file
View File

Binary file not shown.

BIN
assets/fonts/remixicon/remixicon.woff Normal file
View File

Binary file not shown.

BIN
assets/fonts/remixicon/remixicon.woff2 Normal file
View File

Binary file not shown.

0
assets/360_F_125742655_7mmnRCr3o5ZPUfLOQT4exd100ICIkGOi.jpg → assets/icon.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

4
assets/pico.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

14
assets/script.js
View File

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

56
assets/style.css
View File

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

28
templates/header.html
View File

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

6
templates/skeleton.html
View File

@ -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__