Rename files.

Add svg icons

assets/haditha/images/fav-icons/browserconfig.xml

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig><msapplication><tile><square70x70logo src="/ms-icon-70x70.png"/><square150x150logo src="/ms-icon-150x150.png"/><square310x310logo src="/ms-icon-310x310.png"/><TileColor>#ffffff</TileColor></tile></msapplication></browserconfig>

assets/haditha/images/fav-icons/manifest.json

@@ -0,0 +1,41 @@
+{
+ "name": "App",
+ "icons": [
+  {
+   "src": "\/android-icon-36x36.png",
+   "sizes": "36x36",
+   "type": "image\/png",
+   "density": "0.75"
+  },
+  {
+   "src": "\/android-icon-48x48.png",
+   "sizes": "48x48",
+   "type": "image\/png",
+   "density": "1.0"
+  },
+  {
+   "src": "\/android-icon-72x72.png",
+   "sizes": "72x72",
+   "type": "image\/png",
+   "density": "1.5"
+  },
+  {
+   "src": "\/android-icon-96x96.png",
+   "sizes": "96x96",
+   "type": "image\/png",
+   "density": "2.0"
+  },
+  {
+   "src": "\/android-icon-144x144.png",
+   "sizes": "144x144",
+   "type": "image\/png",
+   "density": "3.0"
+  },
+  {
+   "src": "\/android-icon-192x192.png",
+   "sizes": "192x192",
+   "type": "image\/png",
+   "density": "4.0"
+  }
+ ]
+}

assets/haditha/scss/haditha.css

@@ -52,7 +52,7 @@ html {
     font-family: IRANSansX;
   }
 }
-.hadith-system {
+.haditha-system {
   height: 100%;
   display: flex;
   flex-direction: column;
@@ -60,9 +60,8 @@ html {
   .isolate {
     flex-grow: 1;
   }
-  [class*="i-haditha"] {
-    /* font-size: 1.3em !important; */
-    /* width: 2rem !important; */
-    /* height: 2rem !important; */
-  }
+}
+.firefox-scrollbar {
+  scrollbar-width: thin;
+  scrollbar-color: #ccc #eee;
 }

components/haditha/AutoComplation.vue

@@ -142,7 +142,7 @@ const onUpdateModel = (newVal: string) => {
 const onSearch = () => {
   console.info("onSearch");
   router.push({
-    name: "hadithSearch",
+    name: "hadithaSearch",
   });
 };
 const onKeyDown = () => {
@@ -162,8 +162,8 @@ const onSend = () => {
 </script>
 
 <template>
-  <div class="hadith-search-root-wrapper">
-    <div class="hadith-search-root">
+  <div class="haditha-search-root-wrapper">
+    <div class="haditha-search-root">
       <div v-if="showPrevSearch" class="prev-search-item flex items-center">
         <span class="total">۴۷ مشابه </span>
         <span class="text me-auto">
@@ -186,7 +186,7 @@ const onSend = () => {
           v-model:search-term="searchTerm"
           placeholder="هوشمند جستجو کنید..."
           :ui="{
-            base: ['hadith-search-input'],
+            base: ['haditha-search-input'],
           }"
           :content="{
             align: 'start',
@@ -207,7 +207,7 @@ const onSend = () => {
         >
         </UInputMenu>
       </div>
-      <UButton class="my-trailing-button" @click.prevent="onSearch" icon="i-lucide-search">
+      <UButton class="my-trailing-button" @click.prevent="onSearch" icon="i-haditha-search">
         <!-- <UIcon  name="i-lucide-search" /> -->
       </UButton>
     </div>
@@ -227,7 +227,7 @@ const onSend = () => {
         <UButton
           class="filter-item"
           :label="filter.label"
-          :trailingIcon="filter.items?.length ? 'i-lucide-chevron-down' : ''"
+          :trailingIcon="filter.items?.length ? 'i-haditha-chevron-down' : ''"
         />
       </UDropdownMenu>
     </div>
@@ -235,12 +235,12 @@ const onSend = () => {
 </template>
 
 <style scoped>
-.hadith-search-root-wrapper {
+.haditha-search-root-wrapper {
   max-width: 656px;
   width: 100%;
   margin: 0 1em;
 
-  .hadith-search-root {
+  .haditha-search-root {
     position: relative;
 
     &::before {
@@ -358,10 +358,10 @@ const onSend = () => {
         content: none;
       }
       .my-trailing-button {
-        width: 32px;
-        height: 32px;
+        /* width: 32px; */
+        /* height: 32px; */
       }
-      .hadith-search-input {
+      .haditha-search-input {
         height: 56px;
       }
     }
@@ -370,7 +370,7 @@ const onSend = () => {
 </style>
 
 <style>
-.hadith-search-root-wrapper {
+.haditha-search-root-wrapper {
   .my-trailing-button {
     position: absolute;
 
@@ -395,17 +395,17 @@ const onSend = () => {
     }
 
     & > span {
-      width: 18px;
-      height: 18px;
+      /* width: 18px; */
+      /* height: 18px; */
 
-      background-image: linear-gradient(
+      /* background-image: linear-gradient(
         102.02deg,
         #4be8ae 7.38%,
         #00a762 91.78%
-      );
+      ); */
     }
   }
-  .hadith-search-input {
+  .haditha-search-input {
     z-index: 0;
 
     height: 72px;

components/haditha/CardList.vue

@@ -9,7 +9,7 @@ const props = defineProps({
     default: "نتیجه‌ای یافت نشد!",
   },
   noDataIcon: {
-    default: "/img/no-data.png",
+    default: "/img/haditha/no-data.png",
   },
 });
 </script>
@@ -22,7 +22,7 @@ const props = defineProps({
         fit="auto"
         quality="80"
         placeholder
-        src="/img/haditha-title.svg"
+        src="/img/haditha/haditha-title.svg"
       />
     </div>
 
@@ -43,7 +43,7 @@ const props = defineProps({
 
         <ULink
           :to="{
-            name:'hadithLibraryShow',
+            name:'hadithaLibraryShow',
             params:{
               id:1,
               slug:'اصول کافی-جلد 1'
@@ -60,7 +60,7 @@ const props = defineProps({
             fit="auto"
             quality="80"
             placeholder
-            src="/img/sample-bgi.svg"
+            src="/img/haditha/sample-bgi.svg"
           />
           <p class="title">اصول کافی</p>
           <p class="version">جلد 1</p>

components/haditha/Dropdown.vue

@@ -64,7 +64,7 @@ const items = [
     <UButton
       color="white"
       label="Options"
-      trailing-icon="i-heroicons-chevron-down-20-solid"
+      trailing-icon="i-haditha-chevron-down"
     />
 
     <!-- <template #account="{ item }">

components/haditha/NavigationMenu.vue

@@ -3,28 +3,28 @@ const items = ref([
   {
     label: "حانه",
     icon: "i-haditha-home",
-    to: "/hadith",
+    to: "/haditha",
     descrption: "صفحه اصلی",
     class: "flex flex-col lg:flex-row justify-center items-center hide-label",
   },
   {
     label: "جستجو",
     icon: "i-haditha-search",
-    to: "/hadith/search",
+    to: "/haditha/search",
     slot: "search",
     class: "flex flex-col lg:flex-row justify-center items-center",
   },
   {
     label: "چت بات",
     icon: "i-haditha-chat-bot",
-    to: "/hadith/chat-bot",
+    to: "/haditha/chat-bot",
     slot: "chat-bot",
     class: "flex flex-col lg:flex-row justify-center items-center",
   },
   {
     label: "کتابخانه",
     icon: "i-haditha-library",
-    to: "/hadith/library",
+    to: "/haditha/library",
     slot: "library",
     class: "flex flex-col lg:flex-row justify-center items-center",
   },
@@ -32,7 +32,7 @@ const items = ref([
   {
     label: "نشان شده ها",
     icon: "i-haditha-bookmark",
-    to: "/hadith/favorites",
+    to: "/haditha/favorites",
     class: "flex flex-col lg:hidden justify-center items-center",
   },
 
@@ -44,22 +44,22 @@ const items = ref([
       {
         label: "در باره ما",
         icon: "i-haditha-about-us",
-        to: "/hadith/about-us",
+        to: "/haditha/about-us",
       },
       {
         label: "تماس با ما",
         icon: "i-haditha-contact-us",
-        to: "/hadith/contact-us",
+        to: "/haditha/contact-us",
       },
       {
         label: "قوانین و مقررات",
         icon: "i-haditha-copyright",
-        to: "/hadith/rules",
+        to: "/haditha/rules",
       },
       {
         label: "خروج از حساب",
         icon: "i-haditha-logout",
-        to: "/hadith/logout",
+        to: "/haditha/logout",
       },
     ],
   },
@@ -69,7 +69,7 @@ const leftItem = ref([
   {
     label: "نشان شده ها",
     icon: "i-haditha-bookmark",
-    to: "/hadith/favorites",
+    to: "/haditha/favorites",
   },
 
   {
@@ -78,23 +78,23 @@ const leftItem = ref([
     children: [
       {
         label: "در باره ما",
-        icon: "i-haditha-about-us size-4",
-        to: "/hadith/about-us",
+        icon: "i-haditha-about-us",
+        to: "/haditha/about-us",
       },
       {
         label: "تماس با ما",
         icon: "i-haditha-contact-us",
-        to: "/hadith/contact-us",
+        to: "/haditha/contact-us",
       },
       {
         label: "قوانین و مقررات",
         icon: "i-haditha-copyright",
-        to: "/hadith/rules",
+        to: "/haditha/rules",
       },
       {
         label: "خروج از حساب",
         icon: "i-haditha-logout",
-        to: "/hadith/logout",
+        to: "/haditha/logout",
       },
     ],
   },
@@ -108,7 +108,7 @@ onMounted(() => {
     isMobile.value = true;
     console.info("is less than 576");
 
-    items.value = items.value.filter((item) => item.to != "/hadith/favorites");
+    items.value = items.value.filter((item) => item.to != "/haditha/favorites");
     rerenderNavigation.value++;
   }
 });

components/haditha/hero-page/SectionFive.vue

@@ -46,7 +46,7 @@ const state = reactive({
           fit="auto"
           quality="80"
           placeholder
-          src="/img/haditha-title.svg"
+          src="/img/haditha/haditha-title.svg"
           class="me-2"
         />
       </div>

components/haditha/hero-page/SectionFour.vue

@@ -2,30 +2,30 @@
 const state = reactive({
   cards: [
     {
-      img: "/img/section-four_card-one.png",
+      img: "/img/haditha/section-four_card-one.png",
       title: "تشخیص موجودیت",
       description:
         "استخراج و شناسایی موجودیت‌های مرتبط از متن حدیثی (مانند افراد، مکان‌ها، مفاهیم کلیدی یا موضوعات)",
     },
     {
-      img: "/img/section-four_card-two.png",
+      img: "/img/haditha/section-four_card-two.png",
       title: "تشخیص موجودیت",
       description: "تجمیع نکات کلیدی از احادیث و شروح مختلف",
     },
     {
-      img: "/img/section-four_card-three.png",
+      img: "/img/haditha/section-four_card-three.png",
       title: "تشخیص موجودیت",
       description:
         "امکان تعامل مستقیم با سامانه برای پاسخ به سوالات یا دریافت توضیحات از مفاهیم حدیثی",
     },
     {
-      img: "/img/section-four_card-four.png",
+      img: "/img/haditha/section-four_card-four.png",
       title: "تشخیص کلمات کلیدی",
       description:
         "با تحلیل دقیق متن، کلمات و عبارات کلیدی هر حدیث را شناسایی و ارائه می‌کند",
     },
     {
-      img: "/img/section-four_card-five.png",
+      img: "/img/haditha/section-four_card-five.png",
       title: "دسته‌بندی هوشمند",
       description:
         "احادیث را بر اساس موضوعات، مفاهیم یا کلیدواژه‌های اصلی به‌صورت خودکار دسته‌بندی می‌کند",
@@ -47,7 +47,7 @@ const state = reactive({
           fit="auto"
           quality="80"
           placeholder
-          src="/img/haditha-title.svg"
+          src="/img/haditha/haditha-title.svg"
           class="me-2"
         />
       </div>

components/haditha/hero-page/SectionOne.vue

@@ -1,10 +1,32 @@
+<script setup>
+const img = useImage();
+
+const backgroundImageStyle = computed(() => {
+  // Use $img to generate an optimized image URL
+  const optimizedImageUrl = img("/img/haditha/background.png", {
+    quality: 80,
+    fit: "auto",
+  });
+
+  return {
+    backgroundImage: `url(${optimizedImageUrl}), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
+  };
+});
+
+const NavigationMenu = defineAsyncComponent(() =>
+  import("@haditha/components/haditha/NavigationMenu.vue")
+);
+const AutoComplation = defineAsyncComponent(() =>
+  import("@haditha/components/haditha/AutoComplation.vue")
+);
+</script>
 <template>
   <section class="section-one flex flex-col justify-center">
     <div class="background-image h-full" :style="backgroundImageStyle">
       <navigation-menu></navigation-menu>
 
       <div class="logo-container flex justify-center flex-col items-center">
-        <NuxtImg fit="auto" quality="80" placeholder src="/img/logo.png" />
+        <NuxtImg fit="auto" quality="80" placeholder src="/img/haditha/logo.png" />
         <div class="title">
           کاوش با
           <span class="badge-style me-1"> هوش مصنوعی </span>
@@ -17,36 +39,7 @@
     </div>
   </section>
 </template>
-<script>
-export default {
-  data() {
-    return {
-      logo: "",
-    };
-  },
 
-  computed: {
-    backgroundImageStyle() {
-      // Use $img to generate an optimized image URL
-      const optimizedImageUrl = this.$img("/img/background.png", {
-        quality: 60,
-      });
-
-      return {
-        backgroundImage: `url(${optimizedImageUrl}), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
-      };
-    },
-  },
-  components: {
-    NavigationMenu: defineAsyncComponent(() =>
-      import("@hadith/components/hadith/NavigationMenu.vue")
-    ),
-    AutoComplation: defineAsyncComponent(() =>
-      import("@hadith/components/hadith/AutoComplation.vue")
-    ),
-  },
-};
-</script>
 <style scoped>
 .section-one {
   .background-image {
@@ -54,7 +47,7 @@ export default {
     background-size: 100% auto;
     background-repeat: no-repeat;
     background-attachment: fixed;
-    /* background-image: url("/img/background.svg"),
+    /* background-image: url("/img/haditha/background.svg"),
         linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%); */
   }
 

components/haditha/hero-page/SectionThree.vue

@@ -3,7 +3,7 @@ const img = useImage();
 
 const backgroundImageStyle = computed(() => {
   // Use $img to generate an optimized image URL
-  const optimizedImageUrl = img("/img/section-three-bgi.svg", {
+  const optimizedImageUrl = img("/img/haditha/section-three-bgi.png", {
     quality: 80,
     fit: "auto",
   });
@@ -23,7 +23,7 @@ const backgroundImageStyle = computed(() => {
           fit="auto"
           quality="80"
           placeholder
-          src="/img/section-three-logo.svg"
+          src="/img/haditha/section-three-logo.svg"
           class="me-2"
         />
         <span class="title"> چگونه کار می‌کند؟ </span>

components/haditha/hero-page/SectionTwo.vue

@@ -9,7 +9,7 @@
           fit="auto"
           quality="80"
           placeholder
-          src="/img/chevron-down.svg"
+          src="/img/haditha/chevron-down.svg"
         />
       </div>
     </div>
@@ -29,7 +29,7 @@
             fit="auto"
             quality="80"
             placeholder
-            src="/img/card-one.png"
+            src="/img/haditha/card-one.png"
           />
         </div>
       </div>
@@ -47,7 +47,7 @@
             fit="auto"
             quality="80"
             placeholder
-            src="/img/card-two.png"
+            src="/img/haditha/card-two.png"
           />
         </div>
       </div>
@@ -67,7 +67,7 @@
             fit="auto"
             quality="80"
             placeholder
-            src="/img/card-three.png"
+            src="/img/haditha/card-three.png"
           />
         </div>
       </div>
@@ -113,15 +113,15 @@
     }
 
     &.card-one {
-      background-image: url("/img/card-one-bgi.png"),
+      background-image: url("/img/haditha/card-one-bgi.png"),
         linear-gradient(134.17deg, #ffffff -9.81%, #e5e0ff 87.62%);
     }
     &.card-two {
-      background-image: url("/img/card-two-bgi.png"),
+      background-image: url("/img/haditha/card-two-bgi.png"),
         linear-gradient(329.16deg, #b9fde0 13.45%, #eefff8 63.57%);
     }
     &.card-three {
-      background-image: url("/img/card-three-bgi.png"),
+      background-image: url("/img/haditha/card-three-bgi.png"),
         linear-gradient(134.17deg, #ffffff -9.81%, #e5e0ff 87.62%);
     }
   }

components/haditha/library-show/AccordionMenu..vue

@@ -9,7 +9,7 @@ const props = defineProps({
     default: "نتیجه‌ای یافت نشد!",
   },
   noDataIcon: {
-    default: "/img/no-data.png",
+    default: "/img/haditha/no-data.png",
   },
 });
 

components/haditha/login/EnterMobile.vue

@@ -4,7 +4,7 @@ import type { FormSubmitEvent } from "@nuxt/ui";
 
 definePageMeta({
   layout: false,
-  name: "hadithLogin",
+  name: "hadithaLogin",
 });
 useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | ورود`,
@@ -45,17 +45,17 @@ async function onSubmit(event: FormSubmitEvent<Schema>) {
 }
 
 // components declaration
-const HadithLayout = defineAsyncComponent(
-  () => import("@hadith/layouts/HadithLayout.vue")
+const HadithaLayout = defineAsyncComponent(
+  () => import("@haditha/layouts/HadithaLayout.vue")
 );
 const NavigationMenu = defineAsyncComponent(
-  () => import("@hadith/components/hadith/NavigationMenu.vue")
+  () => import("@haditha/components/haditha/NavigationMenu.vue")
 );
 </script>
 
 <template>
-  <HadithLayout>
-    <div class="hadith-login-page h-full">
+  <HadithaLayout>
+    <div class="haditha-login-page h-full">
       <div class="page-container pt-20 h-full">
         <navigation-menu></navigation-menu>
 
@@ -113,11 +113,11 @@ const NavigationMenu = defineAsyncComponent(
         </UContainer>
       </div>
     </div>
-  </HadithLayout>
+  </HadithaLayout>
 </template>
 
 <style scoped>
-.hadith-login-page {
+.haditha-login-page {
   background: #f7fffd;
 
   .page-container {
@@ -165,7 +165,7 @@ const NavigationMenu = defineAsyncComponent(
 </style>
 
 <style>
-.hadith-login-page {
+.haditha-login-page {
   .page-container {
     .page-inner-container {
       .input-elem {