Firq/firq-dev-website
Firq/firq-dev-website
1
0
Fork 0
Code Issues Pull requests Projects Releases 119 Packages 1 Wiki Activity Actions

JS version

Browse source
This commit is contained in:
Firq 2024-10-30 21:24:21 +01:00
parent 7a3c4f14ae
commit 33ffa3c5ae
Signed by: Firq
GPG key ID: 3ACC61C8CEC83C20
2 changed files with 15 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -1,7 +1,7 @@
{
"name": "@firq/fgosite",
"type": "module",
"version": "0.2.0-pre.50",
"version": "0.2.0-pre.51",
"private": true,
"scripts": {
"dev": "astro dev",

16
src/components/navbar/navbarMobile.astro
View file

@ -13,6 +13,15 @@ const hamburger_src_url = `url("${hamburger.src}")`
</label>
</div>
<script>
const dropdownBtn = document.querySelector(".dropdown-btn")!;
const dropdownContent = document.querySelector(".dropdown-content")!;
dropdownBtn.addEventListener("click", () => {
dropdownContent.classList.toggle("menu-open");
});
</script>
<style define:vars={{ hamburger_src_url }}>
input[type="checkbox"] {
opacity: 0;
@ -20,9 +29,11 @@ const hamburger_src_url = `url("${hamburger.src}")`
touch-action: manipulation;
}
input[type="checkbox"]:checked ~ .dropdown-content {
.dropdown-content.menu-open {
display: flex;
height: auto;
transform: translateY(0);
transition: transform var(--a-time-default) var(--a-animation-1);
}
.dropdown-content {
@ -33,11 +44,12 @@ const hamburger_src_url = `url("${hamburger.src}")`
justify-content: center;
background-color: var(--c-primary-background);
width: 100%;
height: 0px;
list-style-type: none;
line-height: 3em;
margin: 0.5rem 0px 0px;
padding: 0;
transform: translateY(-1em);
transition: transform var(--a-time-default) var(--a-animation-1);
}
.dropdown-btn {