Merge pull request #918 from w3bdesign/dev

Version 1.1.9
w3bdesign · May 31, 2023 · bf4c468 · bf4c468
2 parents 4e72e0e + c33ccc1
commit bf4c468
Show file tree

Hide file tree

Showing 7 changed files with 97,583 additions and 71,398 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "private": true,
-    "version": "1.1.8",
+    "version": "1.1.9",
     "scripts": {
         "dev": "npm run development",
         "development": "mix",

diff --git a/public/js/app.js b/public/js/app.js
diff --git a/resources/js/components/Header/Navbar.vue b/resources/js/components/Header/Navbar.vue
@@ -1,51 +1,78 @@
 <template>
-    <header role="banner" class="container flex flex-col justify-center px-0 pt-6 mx-auto mb-6">
+    <header
+        role="banner"
+        class="container flex flex-col justify-center px-0 pt-6 mx-auto mb-6"
+    >
         <div class="flex flex-wrap justify-between">
             <div class="pr-2 my-2 overflow-hidden">
                 <div class="ml-4 lg:ml-0 hidden md:block">
                     <router-link to="/">
-                        <img alt="Logo" class="h-20 lg:h-24" aria-label="Nettbutikk logo" src="../../../img/svg/Logo.svg" />
+                        <img
+                            alt="Logo"
+                            class="h-20 lg:h-24"
+                            aria-label="Nettbutikk logo"
+                            src="../../../img/svg/Logo.svg"
+                        />
                     </router-link>
                 </div>
                 <router-link to="/">
-                    <img alt="Mobile logo" class="h-16 md:hidden block w-32" aria-label="Nettbutikk logo"
-                        src="../../../img/svg/MobileLogo.svg" />
+                    <img
+                        alt="Mobile logo"
+                        class="h-16 md:hidden block w-32"
+                        aria-label="Nettbutikk logo"
+                        src="../../../img/svg/MobileLogo.svg"
+                    />
                 </router-link>
-
-
-
-
             </div>
             <div class="lg:hidden block">
                 <cart-component />
             </div>
             <mobile-menu />
             <div class="hidden lg:w-1/12 lg:block" />
-            <div id="nav-content" class="hidden w-full mt-4 bg-black lg:w-8/12 lg:block lg:bg-white lg:mt-0 lg:text-right"
-                aria-expanded="false">
+            <div
+                id="nav-content"
+                class="hidden w-full mt-4 bg-black lg:w-8/12 lg:block lg:bg-white lg:mt-0 lg:text-right"
+                aria-expanded="false"
+            >
                 <div class="px-6 lg:px-0 lg:pt-5 xl:pt-7">
-                    <nav id="block-main" role="navigation" aria-labelledby="block-main-menu">
-                        <ul class="items-center justify-end flex-1 pr-4 -mr-4 list-reset lg:flex">
-                            <li class="inline-block py-2 text-xl font-semibold no-underline lg:text-base pl-6">
+                    <nav
+                        id="block-main"
+                        role="navigation"
+                        aria-labelledby="block-main-menu"
+                    >
+                        <ul
+                            class="items-center justify-end flex-1 pr-4 -mr-4 list-reset lg:flex"
+                        >
+                            <li
+                                class="inline-block py-2 text-xl font-semibold no-underline lg:text-base pl-6"
+                            >
                                 <search />
                             </li>
-                            <li class="inline-block py-2 text-xl font-semibold no-underline lg:text-base pl-6">
+                            <li
+                                class="inline-block py-2 text-xl font-semibold no-underline lg:text-base pl-6"
+                            >
                                 <router-link tabindex="0" to="/">
                                     <span
-                                        class="text-2xl text-white no-underline lg:text-black link-underline link-underline-blue">
+                                        class="text-2xl text-white no-underline lg:text-black link-underline link-underline-blue"
+                                    >
                                         Home
                                     </span>
                                 </router-link>
                             </li>
-                            <li class="inline-block py-2 text-xl font-semibold no-underline lg:text-base pl-6">
+                            <li
+                                class="inline-block py-2 text-xl font-semibold no-underline lg:text-base pl-6"
+                            >
                                 <router-link tabindex="0" to="/products">
                                     <span
-                                        class="text-2xl text-white no-underline lg:text-black link-underline link-underline-blue">
+                                        class="text-2xl text-white no-underline lg:text-black link-underline link-underline-blue"
+                                    >
                                         Products
                                     </span>
                                 </router-link>
                             </li>
-                            <li class="inline-block py-2 text-xl font-semibold no-underline lg:text-base pl-6">
+                            <li
+                                class="inline-block py-2 text-xl font-semibold no-underline lg:text-base pl-6"
+                            >
                                 <cart-component />
                             </li>
                         </ul>

diff --git a/resources/js/components/Header/Search.vue b/resources/js/components/Header/Search.vue
@@ -1,26 +1,42 @@
 <template>
     <input
         class="w-full px-3 py-2 my-2 border-2 border-gray-300 rounded-md text-sm focus:border-blue-500 focus:outline-none transition-all duration-300"
-        type="text" v-model="searchTerm" placeholder="Search" />
+        type="text"
+        v-model="searchTerm"
+        placeholder="Search"
+    />
 
     <div v-if="data && data.length > 0 && searchTerm.length > 0">
         <div
-            class="flex justify-center absolute bg-white left-0 right-0 h-auto mx-auto py-16 px-8 shadow-md overflow-y-auto overflow-x-hidden scrolling-touch z-50 max-w-screen-md">
+            class="flex justify-center absolute bg-white left-0 right-0 h-auto mx-auto py-16 px-8 shadow-md overflow-y-auto overflow-x-hidden scrolling-touch z-50 max-w-screen-md"
+        >
             <div class="w-full">
-                <div v-for="product in data" :key="product.id" class="border-t-2 border-b-2 border-grey-500 py-4 w-full">
-                    <RouterLink :to="{
-                        name: 'single.product',
-                        params: { slug: product.slug },
-                    }">
+                <div
+                    v-for="product in data"
+                    :key="product.id"
+                    class="border-t-2 border-b-2 border-grey-500 py-4 w-full"
+                >
+                    <RouterLink
+                        :to="{
+                            name: 'single.product',
+                            params: { slug: product.slug },
+                        }"
+                    >
                         <div class="flex justify-end">
                             <div class="mr-8 md:mr-0">
-                                <img v-if="product.imageUrl"
+                                <img
+                                    v-if="product.imageUrl"
                                     class="transform scale-70 max-w-[90px] max-h-full transition ease-in-out duration-200 transform-origin-center left-0 w-65 h-auto object-contain"
-                                    :alt="product.name" :src="product.imageUrl" />
+                                    :alt="product.name"
+                                    :src="product.imageUrl"
+                                />
                             </div>
                             <div class="w-[170px]">
                                 <div class="product__name">
-                                    <div class="product__title" :title="product.name">
+                                    <div
+                                        class="product__title"
+                                        :title="product.name"
+                                    >
                                         {{ product.name }}
                                     </div>
                                 </div>

diff --git a/resources/js/components/Products/ShowAllProducts.vue b/resources/js/components/Products/ShowAllProducts.vue
@@ -1,16 +1,28 @@
 <template>
     <div v-if="data && data.length">
         <div id="product-container" class="flex flex-wrap items-center">
-            <div v-for="product in data" :key="product.id"
-                class="flex flex-col mt-6 md:pr-6 xl:pr-6 sm:w1/2 md:w-1/3 lg:w-1/4 xl:w-1/4">
-                <router-link :to="{
-                    name: 'single.product',
-                    params: { slug: product.slug },
-                }" class="group">
-                    <img v-if="product.imageUrl" class="productImage" :alt="product.name" :src="product.imageUrl" />
+            <div
+                v-for="product in data"
+                :key="product.id"
+                class="flex flex-col mt-6 md:pr-6 xl:pr-6 sm:w1/2 md:w-1/3 lg:w-1/4 xl:w-1/4"
+            >
+                <router-link
+                    :to="{
+                        name: 'single.product',
+                        params: { slug: product.slug },
+                    }"
+                    class="group"
+                >
+                    <img
+                        v-if="product.imageUrl"
+                        class="productImage"
+                        :alt="product.name"
+                        :src="product.imageUrl"
+                    />
                     <div class="flex justify-center pt-3">
                         <p
-                            class="text-xl font-bold text-center cursor-pointer transition-colors duration-300 ease-in-out group-hover:text-blue-600">
+                            class="text-xl font-bold text-center cursor-pointer transition-colors duration-300 ease-in-out group-hover:text-blue-600"
+                        >
                             {{ product.name }}
                         </p>
                     </div>
@@ -41,6 +53,4 @@ import formatPrice from "../../utils/functions";
 
 const fetcher = (key) => fetch(key).then((res) => res.json());
 const { data, error } = useSWRV("/api/products", fetcher);
-
-
 </script>
diff --git a/tailwind.config.js b/tailwind.config.js
@@ -10,9 +10,9 @@ module.exports = {
     },
     variants: {
         extend: {
-          textColor: ['group-hover'],
-          // Add any other group-hover variants you need
+            textColor: ["group-hover"],
+            // Add any other group-hover variants you need
         },
-      },
+    },
     plugins: ["flowbite/plugin"],
 };