home/torsearch
1
0
Fork 0
Code Issues 22 Pull Requests 1 Actions 3 Packages Projects 4 Releases Wiki Activity

fix: animates mobile menu transition

Browse Source
This commit is contained in:
brock
2025-07-23 09:40:05 -05:00
parent df4bb3b736
commit b0d7bfefd7
3 changed files with 6 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
assets/controllers/navbar_controller.js
View File

@@ -24,6 +24,8 @@ export default class extends Controller {
toggle() { toggle() {
this.element.parentElement.classList.toggle('hidden'); this.element.parentElement.classList.toggle('hidden');
this.element.classList.toggle('animate__slideInLeft');
this.element.classList.toggle('z-30');
this.element.classList.toggle('fixed'); this.element.classList.toggle('fixed');
this.element.classList.toggle('z-20'); this.element.classList.toggle('z-20');
} }

3
tailwind.config.js
View File

@@ -34,6 +34,9 @@ module.exports = {
"rounded-sm", "rounded-sm",
"rounded-md", "rounded-md",
"r-tablecell", "r-tablecell",
"animate__animated",
"animate__slideInLeft",
"animate__animateFaster"
], ],
theme: { theme: {
extend: { extend: {

2
templates/components/NavBar.html.twig
View File

@@ -1,4 +1,4 @@
<nav id="navbar" {{ attributes }} {{ stimulus_controller('navbar') }} {{ stimulus_action('navbar', 'setActive')}} class="flex h-screen flex-col justify-between bg-cyan-950"> <nav id="navbar" {{ attributes }} {{ stimulus_controller('navbar') }} {{ stimulus_action('navbar', 'setActive')}} class="flex h-screen flex-col justify-between bg-cyan-950 animate__animated animate__animateFaster">
<div class="px-4 py-4 flex flex-col gap-12"> <div class="px-4 py-4 flex flex-col gap-12">
<h1 class="text-3xl mt-12 md:mt-0 font-extrabold text-orange-500 mb-3"><a href="{{ path('app_index') }}">Torsearch</a></h1> <h1 class="text-3xl mt-12 md:mt-0 font-extrabold text-orange-500 mb-3"><a href="{{ path('app_index') }}">Torsearch</a></h1>
<ul class="nav-list space-y-1"> <ul class="nav-list space-y-1">