fix: sidebar

bo/src/components/TopBar.vue

@@ -1,7 +1,7 @@
 <template>
   <header
     class="fixed top-0 left-0 right-0 z-50 bg-white/80 dark:bg-(--black) backdrop-blur-md border-b border-(--border-light) dark:border-(--border-dark)">
-    <div class="container mx-auto px-4">
+    <div class="px-4">
       <div class="flex items-center justify-between h-16">
         <RouterLink :to="{ name: 'home' }" class="flex items-center gap-2">
           <div class="w-8 h-8 rounded-lg bg-primary text-white flex items-center justify-center">
@@ -15,6 +15,7 @@
           list: 'gap-4 text-(--black)',
           linkLabel: 'text-(--black) text-sm!'
         }" :items="menuItems" class="" />
+        <!-- orientation="vertical" -->
         <div class="flex items-center gap-12">
           <div class="flex items-center gap-2">
             <CountryCurrencySwitch />

bo/src/components/admin/PageProducts.vue

@@ -1,15 +1,13 @@
 <template>
-    <suspense>
-        <component :is="Default || 'div'">
-            <div class="flex gap-10">
-                <CategoryMenu />
-                <div class="w-full flex flex-col items-center gap-4">
-                    <UTable :data="productsList" :columns="columns" class="flex-1 w-full" />
-                    <UPagination v-model:page="page" :total="total" :items-per-page="perPage" />
-                </div>
-            </div> 
-        </component>
-    </suspense>
+    <component :is="Default || 'div'">
+        <div class="flex gap-10">
+            <CategoryMenu />
+            <div class="w-full flex flex-col items-center gap-4">
+                <UTable :data="productsList" :columns="columns" class="flex-1 w-full" />
+                <UPagination v-model:page="page" :total="total" :items-per-page="perPage" />
+            </div>
+        </div>
+    </component>
 </template>
 
 <script setup lang="ts">
@@ -154,6 +152,12 @@ async function fetchProductList() {
 }
 
 function goToProduct(productId: number) {
+    let path = {
+        name: route.name,
+        params: route.params,
+        query: route.query
+    }
+    localStorage.setItem('back_from_product', JSON.stringify(path))
     router.push({
         name: 'customer-product-details',
         params: { product_id: productId }

bo/src/components/admin/ProductDetailView.vue

@@ -1,6 +1,6 @@
 <template>
   <component :is="Default || 'div'">
-
+    <p class="cursor-pointer" @click="backFromProduct()">Back to products</p>
     <div class="container my-10 mx-auto ">
       <div
         class="flex items-end justify-between gap-4 mb-6 bg-(--second-light) dark:bg-(--main-dark) border border-(--border-light) dark:border-(--border-dark) p-4 rounded-md">
@@ -141,7 +141,28 @@ import type { Language } from '@/types';
 import { watch } from 'vue';
 import { onMounted, ref } from 'vue';
 import { computed } from 'vue';
-import { useRoute } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
+
+const router = useRouter()
+function backFromProduct() {
+  let path = localStorage.getItem('back_from_product')
+
+  if (path) {
+    let res = JSON.parse(path)
+    router.push({
+      name: res.name,
+      params: res.params,
+      query: res.query
+    })
+
+    localStorage.removeItem('back_from_product')
+  } else {
+    router.push({
+      name: 'customer-products',
+    })
+  }
+}
+
 
 const route = useRoute()
 const settingStore = useSettingsStore()

bo/src/components/customer/CartDetails.vue

@@ -1,6 +1,6 @@
 <template>
     <component :is="Default || 'div'">
-  <div class="container mx-auto">
+  <div class="">
     <h2
       class="font-semibold text-black dark:text-white pb-6 text-2xl">
       {{ t('Cart Items') }}

bo/src/components/customer/PageAddresses.vue

@@ -1,6 +1,6 @@
 <template>
     <component :is="Default || 'div'">
-    <div class="container mx-auto">
+    <div class="">
         <div class="flex flex-col gap-5 mb-6">
             <h1 class="text-2xl font-bold text-black dark:text-white">{{ t('Addresses') }}</h1>
             <div class="flex md:flex-row flex-col justify-between items-start md:items-center gap-5 md:gap-0">

bo/src/components/customer/PageCarts.vue

@@ -1,6 +1,6 @@
 <template>
   <component :is="Default || 'div'">
-    <div class="container mx-auto flex flex-col gap-5 md:gap-10">
+    <div class="flex flex-col gap-5 md:gap-10">
       <h1 class="text-2xl font-bold text-black dark:text-white">{{ t('Shopping Cart') }}</h1>
       <div class="flex flex-col lg:flex-row gap-5 md:gap-10">
         <div class="flex-1">

bo/src/components/customer/PageProduct.vue

@@ -1,6 +1,6 @@
 <template>
     <component :is="Default || 'div'">
-    <div class="container mx-auto">
+    <div class="">
         <div class="flex md:flex-row flex-col justify-between gap-8 my-6">
             <div class="flex-1">
                 <div class="bg-gray-100 dark:bg-gray-800 rounded-lg p-8 flex items-center justify-center min-h-[300px] ">

bo/src/components/customer/PageProducts.vue

@@ -1,7 +1,7 @@
 <template>
     <suspense>
         <component :is="Default || 'div'">
-            <div class="container mx-auto">
+            <div class="">
                 <!-- <UNavigationMenu orientation="vertical" :items="listing" class="data-[orientation=vertical]:w-48">
                     <template #item="{ item, active }">
                         <div class="flex items-center gap-2 px-3 py-2">

bo/src/components/customer/PageProfileDetails.vue

@@ -1,6 +1,6 @@
 <template>
     <component :is="Default || 'div'">
-        <div class="container mx-auto">
+        <div class="">
             <div class="flex flex-col gap-5 mb-6">
                 <h1 class="text-2xl font-bold text-black dark:text-white">{{ t('Customer Data') }}</h1>
 

bo/src/components/customer/PageProfileDetailsAddInfo.vue

@@ -1,6 +1,6 @@
 <template>
     <component :is="Default || 'div'">
-        <div class="container mx-auto">
+        <div class="">
             <div class="max-w-2xl mx-auto">
                 <div class="flex flex-col gap-5 mb-6">
                     <h1 class="text-2xl font-bold text-black dark:text-white">{{ t('Create Account') }}</h1>