Work on pages
This commit is contained in:
mustafa-rezae
parent
a5e20c1cd6
commit
7e9244ede8
BIN
assets/hadith/images/section-four_card-five.png
Normal file
BIN
assets/hadith/images/section-four_card-five.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.8 KiB |
BIN
assets/hadith/images/section-four_card-four.png
Normal file
BIN
assets/hadith/images/section-four_card-four.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
BIN
assets/hadith/images/section-four_card-one.png
Normal file
BIN
assets/hadith/images/section-four_card-one.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
BIN
assets/hadith/images/section-four_card-three.png
Normal file
BIN
assets/hadith/images/section-four_card-three.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.3 KiB |
BIN
assets/hadith/images/section-four_card-two.png
Normal file
BIN
assets/hadith/images/section-four_card-two.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
BIN
assets/hadith/images/section-three-bgi.png
Normal file
BIN
assets/hadith/images/section-three-bgi.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
11
assets/hadith/images/section-three-bgi.svg
Normal file
11
assets/hadith/images/section-three-bgi.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.2 MiB |
BIN
assets/hadith/images/section-three-logo.png
Normal file
BIN
assets/hadith/images/section-three-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
59
assets/hadith/images/section-three-logo.svg
Normal file
59
assets/hadith/images/section-three-logo.svg
Normal file
|
|
@ -0,0 +1,59 @@
|
|||
<svg width="49" height="20" viewBox="0 0 49 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M27.3643 13.7278C28.4451 13.7278 29.2919 13.5665 29.9049 13.2439C30.534 12.9212 30.9857 12.4373 31.2599 11.7921L29.9049 4.02504L30.897 3.51691L32.2762 11.4775C32.3891 12.0905 32.6956 12.6228 33.1956 13.0745C33.7118 13.51 34.3813 13.7278 35.2039 13.7278H36.2202C36.3654 13.7278 36.4863 13.7923 36.5831 13.9214C36.696 14.0504 36.7525 14.2037 36.7525 14.3811C36.7525 14.5585 36.696 14.7118 36.5831 14.8408C36.4863 14.9699 36.3654 15.0344 36.2202 15.0344H35.4217C34.5022 15.0344 33.7279 14.8408 33.0988 14.4537C32.4697 14.0504 32.0342 13.51 31.7922 12.8325C31.4535 13.5262 30.9212 14.0665 30.1953 14.4537C29.4694 14.8408 28.558 15.0344 27.4611 15.0344H25.1261L25.0051 13.7278H27.3643Z" fill="url(#paint0_linear_67_1937)"/>
|
||||
<path d="M36.1759 15.0344C36.0308 15.0344 35.9098 14.9699 35.813 14.8408C35.7001 14.7118 35.6436 14.5585 35.6436 14.3811C35.6436 14.1875 35.7001 14.0343 35.813 13.9214C35.9098 13.7923 36.0308 13.7278 36.1759 13.7278H45.8061L45.1286 8.74333C44.9673 7.66256 44.6044 6.85601 44.0398 6.32369C43.4913 5.77524 42.7735 5.50102 41.8863 5.50102C41.6927 5.50102 41.3862 5.53328 40.9668 5.5978L37.9907 6.08173L38.1117 4.77512L40.9426 4.31539C41.2814 4.267 41.604 4.2428 41.9105 4.2428C43.0719 4.2428 44.0317 4.59768 44.7899 5.30744C45.5641 6.00107 46.04 6.98506 46.2175 8.2594L46.9675 13.7278H49L48.6371 15.0344H36.1759Z" fill="url(#paint1_linear_67_1937)"/>
|
||||
<path d="M18.8542 13.7277C19.8221 13.7277 20.6044 13.5503 21.2012 13.1954C21.8142 12.8405 22.2336 12.3324 22.4595 11.671L21.0803 4.70247L22.1691 4.21855L23.3547 10.0983C23.4192 10.4209 23.4515 10.7758 23.4515 11.1629C23.4515 12.3405 23.0482 13.2841 22.2417 13.9939C21.4513 14.6875 20.3382 15.0343 18.9026 15.0343C15.9956 15.0343 15.9065 13.7277 18.8542 13.7277Z" fill="url(#paint2_linear_67_1937)"/>
|
||||
<path d="M12.9673 13.2438C13.5964 12.9212 14.0481 12.4373 14.3223 11.792L13.0811 5.96065L14.0732 5.45253L15.1983 10.3463L15.3386 11.4775C15.4515 12.0905 15.758 12.6228 16.258 13.0744C16.7742 13.51 17.4437 13.7277 18.2663 13.7277H19.2826C19.4278 13.7277 19.5487 13.7923 19.6455 13.9213C19.7584 14.0504 19.8149 14.2036 19.8149 14.381C19.8149 14.5585 19.7584 14.7117 19.6455 14.8408C19.5487 14.9698 19.4278 15.0343 19.2826 15.0343H18.4841C17.5646 15.0343 16.7903 14.8408 16.1612 14.4536C15.5321 14.0504 15.0966 13.51 14.8546 12.8325C14.5159 13.5261 13.9836 14.0665 13.2577 14.4536L12.9673 13.2438Z" fill="url(#paint3_linear_67_1937)"/>
|
||||
<path d="M19.2383 15.0343C19.0932 15.0343 18.9722 14.9698 18.8754 14.8408C18.7625 14.7117 18.706 14.5585 18.706 14.381C18.706 14.1875 18.7625 14.0342 18.8754 13.9213C18.9722 13.7923 19.0932 13.7277 19.2383 13.7277V15.0343Z" fill="url(#paint4_linear_67_1937)"/>
|
||||
<path d="M5.16444 15.0343C3.93849 15.0343 2.97064 14.6955 2.26087 14.018C1.55111 13.3405 1.19623 12.3646 1.19623 11.0903V2.63364L0 3.0117V1.65066L2.23668 0.927774V10.7031C2.23668 12.7195 3.2126 13.7277 5.16444 13.7277H5.72096C5.86614 13.7277 5.98712 13.7922 6.08391 13.9212C6.19682 14.0503 6.25328 14.2035 6.25328 14.381C6.25328 14.5584 6.19682 14.7117 6.08391 14.8407C5.98712 14.9697 5.86614 15.0343 5.72096 15.0343H5.16444Z" fill="url(#paint5_linear_67_1937)"/>
|
||||
<path d="M5.68996 15.0343C5.54478 15.0343 5.4238 14.9697 5.32701 14.8407C5.2141 14.7117 5.15764 14.5584 5.15764 14.381C5.15764 14.2035 5.2141 14.0503 5.32701 13.9212C5.4238 13.7922 5.54478 13.7277 5.68996 13.7277H8.71451C8.85969 13.7277 8.98067 13.7922 9.07746 13.9212C9.19037 14.0503 9.24683 14.2035 9.24683 14.381C9.24683 14.5584 9.19037 14.7117 9.07746 14.8407C8.98067 14.9697 8.85969 15.0343 8.71451 15.0343H5.68996Z" fill="url(#paint6_linear_67_1937)"/>
|
||||
<path d="M8.69031 15.0343C8.54513 15.0343 8.42415 14.9697 8.32737 14.8407C8.21445 14.7117 8.15799 14.5584 8.15799 14.381C8.15799 14.1874 8.21445 14.0342 8.32737 13.9212C8.42415 13.7922 8.54513 13.7277 8.69031 13.7277H10.6502C11.6181 13.7277 12.4004 13.5502 12.9973 13.1953C13.6102 12.8405 14.0297 12.3323 14.2555 11.671L12.9973 5.88501L14.0861 5.40108L15.1508 10.0982C15.2153 10.4208 15.2475 10.7757 15.2475 11.1628C15.2475 12.3404 14.8443 13.2841 14.0377 13.9938C13.2473 14.6875 12.1343 15.0343 10.6986 15.0343H8.69031Z" fill="url(#paint7_linear_67_1937)"/>
|
||||
<path d="M7.02673 2.44065H12.0838V3.77145H7.02673V2.44065Z" fill="url(#paint8_linear_67_1937)"/>
|
||||
<path d="M8.61989 0.253906H10.2834V1.61495H8.61989V0.253906Z" fill="url(#paint9_linear_67_1937)"/>
|
||||
<path d="M17.3661 17.8477H22.3989V19.1785H17.3661V17.8477Z" fill="url(#paint10_linear_67_1937)"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint2_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint3_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint4_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint5_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint6_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint7_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint8_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint9_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint10_linear_67_1937" x1="4.93879" y1="12.9026" x2="-7.1352" y2="-9.309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D284FF"/>
|
||||
<stop offset="1" stop-color="#4D00FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.7 KiB |
|
|
@ -207,8 +207,8 @@ const onSend = () => {
|
|||
>
|
||||
</UInputMenu>
|
||||
</div>
|
||||
<UButton class="my-trailing-button">
|
||||
<UIcon @click.prevent="onSearch" name="i-lucide-search" />
|
||||
<UButton class="my-trailing-button" @click.prevent="onSearch" icon="i-lucide-search">
|
||||
<!-- <UIcon name="i-lucide-search" /> -->
|
||||
</UButton>
|
||||
</div>
|
||||
<div class="search-filter my-3 space-x-2" v-if="props.showFilter">
|
||||
|
|
|
|||
184
components/hadith/hero-page/SectionFive.vue
Normal file
184
components/hadith/hero-page/SectionFive.vue
Normal file
|
|
@ -0,0 +1,184 @@
|
|||
<script setup>
|
||||
const state = reactive({
|
||||
items: [
|
||||
{
|
||||
img: "https://picsum.photos/640/640?random=1",
|
||||
title: "حجتالاسلام خسروپناه",
|
||||
job: "پژوهشگر",
|
||||
summary:
|
||||
"این سرویس برای هر کسی که به دنبال احادیث است، ضروری است. با این سرویس، پژوهشهای من بسیار سادهتر شده است. این سرویس برای هر کسی که به دنبال احادیث است، ضروری است. با این سرویس، پژوهشهای من بسیار سادهتر شده است.",
|
||||
},
|
||||
{
|
||||
img: "https://picsum.photos/640/640?random=1",
|
||||
title: "حجتالاسلام خسروپناه",
|
||||
job: "پژوهشگر",
|
||||
summary:
|
||||
"این سرویس برای هر کسی که به دنبال احادیث است، ضروری است. با این سرویس، پژوهشهای من بسیار سادهتر شده است. این سرویس برای هر کسی که به دنبال احادیث است، ضروری است. با این سرویس، پژوهشهای من بسیار سادهتر شده است.",
|
||||
},
|
||||
{
|
||||
img: "https://picsum.photos/640/640?random=1",
|
||||
title: "حجتالاسلام خسروپناه",
|
||||
job: "پژوهشگر",
|
||||
summary:
|
||||
"این سرویس برای هر کسی که به دنبال احادیث است، ضروری است. با این سرویس، پژوهشهای من بسیار سادهتر شده است. این سرویس برای هر کسی که به دنبال احادیث است، ضروری است. با این سرویس، پژوهشهای من بسیار سادهتر شده است.",
|
||||
},
|
||||
{
|
||||
img: "https://picsum.photos/640/640?random=1",
|
||||
title: "حجتالاسلام خسروپناه",
|
||||
job: "پژوهشگر",
|
||||
summary:
|
||||
"این سرویس برای هر کسی که به دنبال احادیث است، ضروری است. با این سرویس، پژوهشهای من بسیار سادهتر شده است. این سرویس برای هر کسی که به دنبال احادیث است، ضروری است. با این سرویس، پژوهشهای من بسیار سادهتر شده است.",
|
||||
},
|
||||
],
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<section class="section-five flex">
|
||||
<UContainer
|
||||
class="section-container mx-auto max-w-[var(--ui-container-two)] sm:px-6 lg:px-4"
|
||||
>
|
||||
<div class="header flex items-center justify-center mb-8">
|
||||
<span class="title me-1">تجربه شما با </span>
|
||||
|
||||
<NuxtImg
|
||||
width="49"
|
||||
height="18"
|
||||
fit="auto"
|
||||
quality="80"
|
||||
placeholder
|
||||
src="/img/haditha-title.svg"
|
||||
class="me-2"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- :prev="{ color: 'ghost' }"
|
||||
:next="{ variant: 'ghost' }" -->
|
||||
|
||||
<div class="content">
|
||||
<UCarousel
|
||||
loop
|
||||
arrows
|
||||
dots
|
||||
prev-icon="i-lucide-chevron-right"
|
||||
next-icon="i-lucide-chevron-left"
|
||||
v-slot="{ item }"
|
||||
:items="state.items"
|
||||
class="w-full max-w-xs mx-auto"
|
||||
:ui="{
|
||||
item: 'carousel-item flex flex-col items-center justify-center',
|
||||
root: 'root',
|
||||
viewport: 'viewport',
|
||||
container: 'container',
|
||||
controls: 'controls',
|
||||
arrows: 'arrows',
|
||||
prev: 'prev rounded-xl top-1/7',
|
||||
next: 'next rounded-xl top-1/7 ',
|
||||
dots: 'dots -bottom-10',
|
||||
dot: 'dot',
|
||||
}"
|
||||
>
|
||||
<NuxtImg
|
||||
width="100"
|
||||
height="100"
|
||||
fit="auto"
|
||||
quality="80"
|
||||
placeholder
|
||||
:src="item.img"
|
||||
class="rounded-full"
|
||||
/>
|
||||
<div class="my-6">
|
||||
<p class="title">{{ item.title }}</p>
|
||||
<p class="job">{{ item.job }}</p>
|
||||
</div>
|
||||
<p class="summary">
|
||||
{{ item.summary }}
|
||||
</p>
|
||||
</UCarousel>
|
||||
</div>
|
||||
</UContainer>
|
||||
</section>
|
||||
</template>
|
||||
<style scoped>
|
||||
.section-five {
|
||||
background: linear-gradient(329.16deg, #b9fde0 13.45%, #eefff8 63.57%);
|
||||
padding:6em 0 11.2em; /* 120px */
|
||||
|
||||
.header {
|
||||
.title {
|
||||
font-family: IRANSansX;
|
||||
font-weight: 300;
|
||||
font-size: 20px;
|
||||
line-height: 30px;
|
||||
letter-spacing: 0%;
|
||||
text-align: center;
|
||||
|
||||
color: #626b84;
|
||||
}
|
||||
}
|
||||
.carousel-item {
|
||||
.title {
|
||||
font-family: IRANSansX;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
letter-spacing: 0%;
|
||||
text-align: center;
|
||||
|
||||
/* Fallback color */
|
||||
color: #4d00ff;
|
||||
|
||||
/* Gradient background */
|
||||
background: linear-gradient(268.92deg, #d284ff 37.62%, #4d00ff 63.24%);
|
||||
|
||||
/* Clip the background to the text */
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text; /* For Safari */
|
||||
|
||||
/* Make the text transparent */
|
||||
color: transparent;
|
||||
-webkit-text-fill-color: transparent; /* For Safari */
|
||||
}
|
||||
|
||||
.job {
|
||||
font-family: IRANSansX;
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
letter-spacing: 0%;
|
||||
text-align: center;
|
||||
color: #626b84;
|
||||
}
|
||||
|
||||
.summary {
|
||||
/* padding: 2.5em 0 2.5em; */
|
||||
margin-bottom: 0.3em;
|
||||
font-family: IRANSansX;
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
letter-spacing: 0%;
|
||||
text-align: justify;
|
||||
|
||||
color: var(--ui-color-two);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style>
|
||||
.section-five {
|
||||
.prev,
|
||||
.next {
|
||||
width: 40;
|
||||
height: 56;
|
||||
padding: 1.2em 0.6em;
|
||||
border-radius: 12px;
|
||||
|
||||
background: #ffffff;
|
||||
border: 0.3px solid #e0e0e0;
|
||||
box-shadow: 0px 1px 4px 0px #0000000d;
|
||||
|
||||
color: #545aea;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
125
components/hadith/hero-page/SectionFour.vue
Normal file
125
components/hadith/hero-page/SectionFour.vue
Normal file
|
|
@ -0,0 +1,125 @@
|
|||
<script setup>
|
||||
const state = reactive({
|
||||
cards: [
|
||||
{
|
||||
img: "/img/section-four_card-one.png",
|
||||
title: "تشخیص موجودیت",
|
||||
description:
|
||||
"استخراج و شناسایی موجودیتهای مرتبط از متن حدیثی (مانند افراد، مکانها، مفاهیم کلیدی یا موضوعات)",
|
||||
},
|
||||
{
|
||||
img: "/img/section-four_card-two.png",
|
||||
title: "تشخیص موجودیت",
|
||||
description: "تجمیع نکات کلیدی از احادیث و شروح مختلف",
|
||||
},
|
||||
{
|
||||
img: "/img/section-four_card-three.png",
|
||||
title: "تشخیص موجودیت",
|
||||
description:
|
||||
"امکان تعامل مستقیم با سامانه برای پاسخ به سوالات یا دریافت توضیحات از مفاهیم حدیثی",
|
||||
},
|
||||
{
|
||||
img: "/img/section-four_card-four.png",
|
||||
title: "تشخیص کلمات کلیدی",
|
||||
description:
|
||||
"با تحلیل دقیق متن، کلمات و عبارات کلیدی هر حدیث را شناسایی و ارائه میکند",
|
||||
},
|
||||
{
|
||||
img: "/img/section-four_card-five.png",
|
||||
title: "دستهبندی هوشمند",
|
||||
description:
|
||||
"احادیث را بر اساس موضوعات، مفاهیم یا کلیدواژههای اصلی بهصورت خودکار دستهبندی میکند",
|
||||
},
|
||||
],
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<section class="section-four flex">
|
||||
<UContainer
|
||||
class="section-container mx-auto max-w-[var(--ui-container-two)] sm:px-6 lg:px-4"
|
||||
>
|
||||
<div class="header flex items-center justify-center mb-8 ">
|
||||
<span class="title me-1">امکانات </span>
|
||||
|
||||
<NuxtImg
|
||||
width="49"
|
||||
height="18"
|
||||
fit="auto"
|
||||
quality="80"
|
||||
placeholder
|
||||
src="/img/haditha-title.svg"
|
||||
class="me-2"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- grid-cols-1 md:grid-cols-2 lg:grid-cols-3 -->
|
||||
<div class="content flex justify-center flex-wrap items-start p-4 space-y-3">
|
||||
<UCard
|
||||
:ui="{
|
||||
root: 'ring ring-[white] shadow-none bg-transparent card-item flex flex-col items-center basis-[360px] p-4',
|
||||
header: 'header border-0 px-0 pb-2 pt-0',
|
||||
body: 'sm:p-0 p-0 border-0 bg-transparent body',
|
||||
footer: 'footer',
|
||||
}"
|
||||
v-for="(item, index) in state.cards"
|
||||
:key="index"
|
||||
>
|
||||
<template #header>
|
||||
<NuxtImg
|
||||
fit="auto"
|
||||
quality="100"
|
||||
:src="item.img"
|
||||
class="me-2"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<p class="mb-2 title">{{ item.title }}</p>
|
||||
<p class="description">
|
||||
{{ item.description }}
|
||||
</p>
|
||||
<!-- <template #footer> </template> -->
|
||||
</UCard>
|
||||
</div>
|
||||
</UContainer>
|
||||
</section>
|
||||
</template>
|
||||
<style scoped>
|
||||
.section-four {
|
||||
padding: 7.5em 0; /* 120px */
|
||||
|
||||
.header {
|
||||
.title {
|
||||
font-family: IRANSansX;
|
||||
font-weight: 300;
|
||||
font-size: 20px;
|
||||
line-height: 30px;
|
||||
letter-spacing: 0%;
|
||||
text-align: center;
|
||||
|
||||
color: #626b84;
|
||||
}
|
||||
}
|
||||
.card-item {
|
||||
.body {
|
||||
border: none;
|
||||
|
||||
.title {
|
||||
font-family: IRANSansX;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
letter-spacing: 0%;
|
||||
text-align: center;
|
||||
}
|
||||
.description {
|
||||
font-family: IRANSansX;
|
||||
font-weight: 300;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
letter-spacing: 0%;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -7,7 +7,7 @@
|
|||
<NuxtImg fit="auto" quality="80" placeholder src="/img/logo.png" />
|
||||
<div class="title">
|
||||
کاوش با
|
||||
<span class="badge-style"> هوش مصنوعی </span>
|
||||
<span class="badge-style me-1"> هوش مصنوعی </span>
|
||||
در احادیث اسلامی
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
107
components/hadith/hero-page/SectionThree.vue
Normal file
107
components/hadith/hero-page/SectionThree.vue
Normal file
|
|
@ -0,0 +1,107 @@
|
|||
<script setup>
|
||||
const img = useImage();
|
||||
|
||||
const backgroundImageStyle = computed(() => {
|
||||
// Use $img to generate an optimized image URL
|
||||
const optimizedImageUrl = img("/img/section-three-bgi.svg", {
|
||||
quality: 80,
|
||||
fit: "auto",
|
||||
});
|
||||
|
||||
return {
|
||||
backgroundImage: `url(${optimizedImageUrl})`,
|
||||
};
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<section class="section-three flex" :style="backgroundImageStyle">
|
||||
<div class="section-container mx-auto">
|
||||
<div class="header flex items-center mb-2">
|
||||
<NuxtImg
|
||||
width="88"
|
||||
height="34"
|
||||
fit="auto"
|
||||
quality="80"
|
||||
placeholder
|
||||
src="/img/section-three-logo.svg"
|
||||
class="me-2"
|
||||
/>
|
||||
<span class="title"> چگونه کار میکند؟ </span>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
حدیثا، پیشرفتهترین سامانه هوش مصنوعی در حوزه مفاهیم حدیثی است. این
|
||||
سامانه با تحلیل عمیق متون حدیثی و استفاده از جدیدترین فناوریهای هوش
|
||||
مصنوعی، امکان دسترسی سریع، دقیق و معنادار به احادیث و مفاهیم اسلامی را
|
||||
فراهم میکند.این سرویس با استفاده از تکنولوژیهای پیشرفتهای نظیر پردازش
|
||||
زبان طبیعی (NLP) و جستجوی معنایی، مفاهیم مرتبط را شناسایی کرده و بهترین
|
||||
نتایج را نمایش میدهد.
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
<style scoped>
|
||||
.section-three {
|
||||
padding-top: 11em; /*120px;*/
|
||||
padding-bottom: 11em; /*65px;*/
|
||||
background-repeat: no-repeat;
|
||||
|
||||
/*height: 37.5em;600px;*/
|
||||
gap: 8.75em; /*140px;*/
|
||||
padding-right: 2em; /*32px;*/
|
||||
padding-left: 2em; /*32px;*/
|
||||
background-color: #1b2132;
|
||||
|
||||
.section-container {
|
||||
width: 56.7em; /*907px;*/
|
||||
/*height: 15.5em; 249px;*/
|
||||
gap: 9px;
|
||||
|
||||
.header {
|
||||
max-width: 30em; /*480px;*/
|
||||
|
||||
background: #1b2132cc;
|
||||
width: 352.611083984375;
|
||||
height: 56;
|
||||
gap: 10px;
|
||||
padding-top: 4px;
|
||||
padding-right: 16px;
|
||||
padding-bottom: 4px;
|
||||
padding-left: 16px;
|
||||
border-radius: 16px;
|
||||
|
||||
.title {
|
||||
font-family: IRANSansX;
|
||||
font-weight: 300;
|
||||
font-size: 32px;
|
||||
line-height: 48px;
|
||||
letter-spacing: 0%;
|
||||
text-align: center;
|
||||
|
||||
color: #d9d9d9;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
max-width: 30em; /*480px;*/
|
||||
|
||||
height: 184;
|
||||
gap: 10px;
|
||||
padding-top: 8px;
|
||||
padding-right: 16px;
|
||||
padding-bottom: 8px;
|
||||
padding-left: 16px;
|
||||
border-radius: 16px;
|
||||
background: #1b2132cc;
|
||||
|
||||
font-family: IRANSansX;
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
letter-spacing: 0%;
|
||||
text-align: right;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,8 +19,10 @@
|
|||
<div class="inner-container">
|
||||
<div>
|
||||
<p class="title">جستجوی معنایی</p>
|
||||
<p class="description">ارائه نتایج دقیق و معنادار از میان</p>
|
||||
<p class="description">حجم انبوه متون حدیثی</p>
|
||||
<div class="mb-6">
|
||||
<p class="description">ارائه نتایج دقیق و معنادار از میان</p>
|
||||
<p class="description">حجم انبوه متون حدیثی</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<NuxtImg
|
||||
|
|
@ -35,8 +37,10 @@
|
|||
<div class="inner-container">
|
||||
<div class="">
|
||||
<p class="title">جستجوی مترادفها</p>
|
||||
<p class="description">یافتن سریع واژگان مرتبط برای</p>
|
||||
<p class="description">درک بهتر مفاهیم حدیثی</p>
|
||||
<div class="mb-6">
|
||||
<p class="description">یافتن سریع واژگان مرتبط برای</p>
|
||||
<p class="description">درک بهتر مفاهیم حدیثی</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<NuxtImg
|
||||
|
|
@ -53,8 +57,10 @@
|
|||
<div class="inner-container">
|
||||
<div>
|
||||
<p class="title">مشابهتیابی حدیث</p>
|
||||
<p class="description">امکان یافتن احادیث یا مفاهیمی</p>
|
||||
<p class="description">با معنای مشابه یک حدیث</p>
|
||||
<div class="mb-6">
|
||||
<p class="description">امکان یافتن احادیث یا مفاهیمی</p>
|
||||
<p class="description">با معنای مشابه یک حدیث</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<NuxtImg
|
||||
|
|
@ -87,12 +93,14 @@
|
|||
margin: auto;
|
||||
}
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-family: IRANSansX;
|
||||
font-weight: 700;
|
||||
font-size: 24px;
|
||||
line-height: 36px;
|
||||
letter-spacing: 0%;
|
||||
color: var(--ui-color-two);
|
||||
text-align: right;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.description {
|
||||
|
|
|
|||
|
|
@ -167,7 +167,7 @@ const NavigationMenu = defineAsyncComponent(() =>
|
|||
class="star-icon align-self-start mt-1"
|
||||
></UIcon>
|
||||
<p class="basis-full message">
|
||||
خلاصه این حدیث چنین است:
امام صادق (علیهالسلام) میفرمایند:
|
||||
خلاصه این حدیث چنین است:امام صادق (علیهالسلام) میفرمایند:
|
||||
انسان دانش میآموزد تا به آن عمل کند، و با عملش شناخته شود.
|
||||
شناخت، سبب پذیرش او میشود، پذیرش باعث امانیافتن او میشود، و
|
||||
این امان یافتن، در نهایت او را به بهشت میرساند.
|
||||
|
|
|
|||
|
|
@ -2,6 +2,9 @@
|
|||
<HadithLayout>
|
||||
<section-one></section-one>
|
||||
<section-two></section-two>
|
||||
<section-three></section-three>
|
||||
<section-four></section-four>
|
||||
<section-five></section-five>
|
||||
</HadithLayout>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -30,6 +33,15 @@ export default {
|
|||
SectionTwo: defineAsyncComponent(() =>
|
||||
import("@hadith/components/hadith/hero-page/SectionTwo.vue")
|
||||
),
|
||||
SectionThree: defineAsyncComponent(() =>
|
||||
import("@hadith/components/hadith/hero-page/SectionThree.vue")
|
||||
),
|
||||
SectionFour: defineAsyncComponent(() =>
|
||||
import("@hadith/components/hadith/hero-page/SectionFour.vue")
|
||||
),
|
||||
SectionFive: defineAsyncComponent(() =>
|
||||
import("@hadith/components/hadith/hero-page/SectionFive.vue")
|
||||
),
|
||||
HadithLayout: defineAsyncComponent(() =>
|
||||
import("@hadith/layouts/HadithLayout.vue")
|
||||
),
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user