From e907c350f7274a9acff1f86da835de3ec611f807 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Mon, 27 Oct 2025 12:34:12 +0330
Subject: [PATCH 1/3] Fix categories link condition Close categories mega menu
 after click on categories item

---
 frontend/components/global/Header.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/frontend/components/global/Header.vue b/frontend/components/global/Header.vue
index 55a4ff1..9583300 100644
--- a/frontend/components/global/Header.vue
+++ b/frontend/components/global/Header.vue
@@ -133,9 +133,10 @@ const megaMenuCategories = computed(() => {
                         v-for="(link, index) in NAV_LINKS"
                         :key="index"
                         :to="link.path"
+                        @click="isCategoriesMenuOpen = false"
                         class="underline-offset-[10px]"
-                        :activeClass="isCategoriesMenuOpen && link.title !== 'دسته بندی ها' ? 'underline' : ''"
-                        :class="isCategoriesMenuOpen ? 'underline' : ''"
+                        :activeClass="isCategoriesMenuOpen ? 'no-underline' : 'underline'"
+                        :class="isCategoriesMenuOpen && link.title === 'دسته بندی ها' ? 'underline' : ''"
                         @mouseenter="link.title === 'دسته بندی ها' ? (isCategoriesMenuOpen = true) : undefined"
                     >
                         {{ link.title }}

From f04b7050723393c5ea546ea6c914beac808d11c6 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Mon, 27 Oct 2025 12:34:25 +0330
Subject: [PATCH 2/3] Fix mega menu animation and style

---
 frontend/components/global/MegaMenu.vue | 148 +++++++++++++++++-------
 1 file changed, 105 insertions(+), 43 deletions(-)

diff --git a/frontend/components/global/MegaMenu.vue b/frontend/components/global/MegaMenu.vue
index b428108..253f780 100644
--- a/frontend/components/global/MegaMenu.vue
+++ b/frontend/components/global/MegaMenu.vue
@@ -31,6 +31,14 @@ const isScrollLocked = useScrollLock(window);
 const navbarEl = ref<HTMLElement | null>(null);
 const { height: navbarHeight } = useElementSize(navbarEl);
 
+const { $gsap: gsap } = useNuxtApp();
+let gsapTimeline: gsap.core.Timeline;
+
+const prevNavbarStyle = ref({
+    itemFilter: "",
+    background: "",
+});
+
 // computed
 
 const selectedItemSubItems = computed(() => {
@@ -55,6 +63,14 @@ const menuTabMouseLeave = () => {
     selectTabTimer.value = null;
 };
 
+const updatePrevStyle = () => {
+    const headerNavbarEl = document.querySelector<HTMLDivElement>("#header-navbar")!;
+    const headerNavbarItemEl = document.querySelector<HTMLDivElement>(".header-navbar-item")!;
+
+    prevNavbarStyle.value.background = getComputedStyle(headerNavbarEl).backgroundColor;
+    prevNavbarStyle.value.itemFilter = getComputedStyle(headerNavbarItemEl).filter;
+};
+
 // watches
 
 watch(
@@ -71,10 +87,54 @@ watch(
     }
 );
 
+watch(isOpen, async (newValue) => {
+    if (newValue) {
+        updatePrevStyle();
+
+        gsapTimeline
+            .to(
+                ".header-navbar-item",
+                {
+                    filter: "invert(0%)",
+                }
+            )
+            .to(
+                "#header-navbar",
+                {
+                    background: "white",
+                },
+                "="
+            );
+    } else {
+        gsapTimeline
+            .fromTo(
+                ".header-navbar-item",
+                {
+                    filter: "invert(0%)",
+                },
+                {
+                    filter: prevNavbarStyle.value.itemFilter,
+                }
+            )
+            .fromTo(
+                "#header-navbar",
+                {
+                    background: "white",
+                },
+                {
+                    background: prevNavbarStyle.value.background,
+                },
+                "="
+            );
+    }
+});
+
 // lifecycle
 
 onMounted(() => {
-    navbarEl.value = document.querySelector("#header-navbar");
+    gsapTimeline = gsap.timeline();
+
+    navbarEl.value = document.querySelector<HTMLDivElement>("#header-navbar");
 });
 </script>
 
@@ -86,51 +146,53 @@ onMounted(() => {
         <div
             v-if="isOpen"
             :style="{ marginTop: `${navbarHeight}px` }"
-            class="fixed right-0 top-0 w-full z-999 bg-black/50 h-svh border-t border-slate-200"
+            class="fixed right-0 top-0 w-full z-999 bg-black/50 h-svh border-t border-slate-200 flex justify-center"
         >
-            <div
-                class="flex h-200 bg-white"
-                @mouseleave="$emit('update:isOpen', false)"
-            >
-                <div class="bg-slate-100 p-4 flex flex-col overflow-y-auto mask-b-from-90% pb-8">
-                    <button
-                        v-for="(item, index) in items"
-                        :key="item.title"
-                        class="text-black transition-all p-4 rounded-xl cursor-default"
-                        :class="index === selectedItem ? 'bg-blue-100 text-blue-500' : 'bg-slate-100'"
-                        :id="`mega-menu-tab-${index}`"
-                        @mouseenter="menuTabMouseEnter(index)"
-                        @click="selectedItem = index"
-                        @mouseleave="menuTabMouseLeave"
-                    >
-                        {{ item.title }}
-                    </button>
-                </div>
-                <div class="overflow-y-auto w-full mask-b-from-90% pb-8">
-                    <Transition
-                        name="fade"
-                        mode="out-in"
-                        :duration="150"
-                    >
-                        <div
-                            :key="selectedItem"
-                            class="grid grid-cols-4 p-4 text-back w-full h-fit"
-                            :style="{
-                                // gridTemplateRows: 'repeat(5, auto)',
-                                // justifyContent: 'center',
-                            }"
+            <div class="container">
+                <div
+                    class="flex h-200 bg-white rounded-b-2xl"
+                    @mouseleave="$emit('update:isOpen', false)"
+                >
+                    <div class="bg-slate-100 p-4 flex flex-col overflow-y-auto mask-b-from-90% pb-8">
+                        <button
+                            v-for="(item, index) in items"
+                            :key="item.title"
+                            class="text-black transition-all p-4 rounded-xl cursor-default text-start"
+                            :class="index === selectedItem ? 'bg-blue-100 text-blue-500' : 'bg-slate-100'"
+                            :id="`mega-menu-tab-${index}`"
+                            @mouseenter="menuTabMouseEnter(index)"
+                            @click="selectedItem = index"
+                            @mouseleave="menuTabMouseLeave"
                         >
-                            <NuxtLink
-                                v-for="item in selectedItemSubItems"
-                                :to="'https://google.com'"
-                                class="p-4 whitespace-nowrap h-fit text-slate-500 flex items-center justify-between hover:text-blue-500 hover:-translate-x-1.5 transition-all"
+                            {{ item.title }}
+                        </button>
+                    </div>
+                    <div class="overflow-y-auto w-full mask-b-from-90% pb-8">
+                        <Transition
+                            name="fade"
+                            mode="out-in"
+                            :duration="150"
+                        >
+                            <div
+                                :key="selectedItem"
+                                class="grid grid-cols-4 p-4 text-back w-full h-fit"
+                                :style="{
+                                    // gridTemplateRows: 'repeat(5, auto)',
+                                    // justifyContent: 'center',
+                                }"
                             >
-                                <span class="truncate w-[90%]">
-                                    {{ item.title }}
-                                </span>
-                            </NuxtLink>
-                        </div>
-                    </Transition>
+                                <NuxtLink
+                                    v-for="item in selectedItemSubItems"
+                                    :to="'https://google.com'"
+                                    class="p-4 whitespace-nowrap h-fit text-slate-500 flex items-center justify-between hover:text-blue-500 hover:-translate-x-1.5 transition-all"
+                                >
+                                    <span class="truncate w-[90%]">
+                                        {{ item.title }}
+                                    </span>
+                                </NuxtLink>
+                            </div>
+                        </Transition>
+                    </div>
                 </div>
             </div>
         </div>

From b2c6aa8a0eae12b2dbe676733c231f6ea422cf85 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Mon, 27 Oct 2025 12:34:29 +0330
Subject: [PATCH 3/3] Removed

---
 frontend/components/server-logs/LogDate.vue | 28 ---------------------
 1 file changed, 28 deletions(-)
 delete mode 100644 frontend/components/server-logs/LogDate.vue

diff --git a/frontend/components/server-logs/LogDate.vue b/frontend/components/server-logs/LogDate.vue
deleted file mode 100644
index 2026092..0000000
--- a/frontend/components/server-logs/LogDate.vue
+++ /dev/null
@@ -1,28 +0,0 @@
-<script lang="ts" setup>
-
-// import
-
-import { usePersianTimeAgo } from "~/composables/global/usePersianTimeAgo";
-
-// type
-
-type Props = {
-    date: string
-}
-
-// props
-
-const props = defineProps<Props>();
-const { date } = toRefs(props);
-
-// state
-
-const timeAgo = usePersianTimeAgo(new Date(date.value));
-
-</script>
-
-<template>
-    <div class="px-3 pb-1 pt-1.5 rounded-lg bg-neutral-600 text-white" dir="rtl">
-        {{ timeAgo }}
-    </div>
-</template>
\ No newline at end of file