bruno robota
This commit is contained in:
parent
230d342380
commit
950919e12b
1
assets/fonts/remixicon/remixicon.css
Normal file
1
assets/fonts/remixicon/remixicon.css
Normal file
File diff suppressed because one or more lines are too long
BIN
assets/fonts/remixicon/remixicon.eot
Normal file
BIN
assets/fonts/remixicon/remixicon.eot
Normal file
Binary file not shown.
8230
assets/fonts/remixicon/remixicon.svg
Normal file
8230
assets/fonts/remixicon/remixicon.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 2.3 MiB |
BIN
assets/fonts/remixicon/remixicon.ttf
Normal file
BIN
assets/fonts/remixicon/remixicon.ttf
Normal file
Binary file not shown.
BIN
assets/fonts/remixicon/remixicon.woff
Normal file
BIN
assets/fonts/remixicon/remixicon.woff
Normal file
Binary file not shown.
BIN
assets/fonts/remixicon/remixicon.woff2
Normal file
BIN
assets/fonts/remixicon/remixicon.woff2
Normal file
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
4
assets/pico.min.css
vendored
Normal file
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);
|
||||
@ -134,3 +134,59 @@ main {
|
||||
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;
|
||||
}
|
||||
|
||||
.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>
|
||||
</div>
|
||||
<nav>
|
||||
<a href="/index" id="homeLink">Domov</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 id="toggle_btn">
|
||||
<i class="toggle_btn_icon" id="ri-menu-line"></i>
|
||||
</div>
|
||||
<div id="dropdown_menu">
|
||||
<a href="/index" id="homeLink">Domov</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>
|
||||
<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>
|
||||
<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>
|
||||
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="sk">
|
||||
<html lang="sk" data-theme="dark">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
@ -7,8 +7,10 @@
|
||||
<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="360_F_125742655_7mmnRCr3o5ZPUfLOQT4exd100ICIkGOi.png" type="image/png">
|
||||
<link rel="icon" href="/assets/icon.png" type="image/png">
|
||||
<script src="/assets/script.js"></script>
|
||||
<title>Bambusové ponožky</title>
|
||||
__TEMPLATE_SCRIPT__
|
||||
|
||||
Loading…
Reference in New Issue
Block a user