haditha_ui/pages/haditha/public-pages/contactus.vue

190 lines
4.6 KiB
Vue
Raw Normal View History

2025-02-26 07:52:21 +00:00
<script setup>
definePageMeta({
layout: false,
2025-03-06 11:28:20 +00:00
name: "hadithaContact",
2025-02-26 07:52:21 +00:00
});
useHead({
2025-03-06 11:28:20 +00:00
name: "hadithaContact",
2025-02-26 07:52:21 +00:00
title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | تماس با ما`,
meta: [
{ name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
],
bodyAttrs: {
class: import.meta.env.VITE_HADITH_SYSTEM,
},
});
// components declaration
2025-03-06 11:28:20 +00:00
const HadithaLayout = defineAsyncComponent(() =>
import("@haditha/layouts/HadithaLayout.vue")
2025-02-26 07:52:21 +00:00
);
const NavigationMenu = defineAsyncComponent(() =>
2025-03-06 11:28:20 +00:00
import("@haditha/components/haditha/NavigationMenu.vue")
2025-02-26 07:52:21 +00:00
);
</script>
<template>
2025-03-06 11:28:20 +00:00
<HadithaLayout>
2025-02-26 07:52:21 +00:00
<div class="page-container h-full">
<!-- max-w-[var(--ui-container-two)] -->
<UContainer class="page-inner-container sm:px-6 lg:px-4">
<span class="top-left-bgi z-0"></span>
<navigation-menu></navigation-menu>
<div class="page-header pt-38 pb-4 flex justify-between items-center">
<div class="flex items-center">
<h1 class="m-0 title">تماس با ما</h1>
</div>
</div>
<div class="page-content p-6">
<div class="mb-4">
<span class="label">تلفن ثابت</span>
<span class="value"> ۰۲۵۳۲۹۰۶۴۵۲</span>
</div>
<div class="mb-4">
<span class="label">تلفن همراه </span>
<span class="value">۰۹۱۲۷۵۰۵۰۵۰ </span>
</div>
<div class="mb-4">
<span class="label">پشتیبان ایتا </span>
<span class="value"> ۰۹۱۲۷۵۰۵۰۵۰</span>
</div>
<div class="mb-4">
<span class="label">کدپستی </span>
<span class="value">۱۲۳۴۵۶۷۸ </span>
</div>
<div class="mb-4">
<span class="label"> آدرس</span>
<span class="value">
دفتر مرکزی: قم، خیابان معلم، کوچه ۱۰، فرعی ۳ پلاک ۵۵ ساختمان
اشراق، واحد ۳۰۵</span
>
</div>
<div class="location">
<NuxtImg
fit="auto"
quality="80"
placeholder
2025-03-06 11:28:20 +00:00
src="/img/haditha/location.png"
2025-02-26 07:52:21 +00:00
/>
</div>
</div>
</UContainer>
</div>
2025-03-06 11:28:20 +00:00
</HadithaLayout>
2025-02-26 07:52:21 +00:00
</template>
<style scoped>
.page-container {
background: #f7fffd;
position: relative;
z-index: 1;
.top-left-bgi {
position: absolute;
top: 0;
left: 0;
2025-03-06 11:28:20 +00:00
background-image: url("../../../assets/haditha/images/modal-top-bgi.png");
2025-02-26 07:52:21 +00:00
backdrop-filter: blur(54px);
width: 447px;
height: 447px;
top: 0;
left: 0;
background-repeat: no-repeat;
background-size: auto;
z-index: -1;
}
&::before {
content: "";
position: absolute;
right: 0;
bottom: 0;
2025-03-06 11:28:20 +00:00
background-image: url("../../../assets/haditha/images/modal-bttom-right-bgi.png");
2025-02-26 07:52:21 +00:00
backdrop-filter: blur(54px);
width: 438px;
height: 238px;
mix-blend-mode: Multiply;
background-repeat: no-repeat;
background-size: cover;
z-index: -1;
}
&::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 458px;
height: 239px;
mix-blend-mode: Multiply;
2025-03-06 11:28:20 +00:00
background-image: url("../../../assets/haditha/images/modal-bottom-left-bgi.png");
2025-02-26 07:52:21 +00:00
background-repeat: no-repeat;
background-size: cover;
backdrop-filter: blur(54px);
z-index: -1;
}
.page-inner-container {
.page-header {
color: var(--ui-color-two);
.title {
font-family: IRANSansX;
font-weight: 300;
font-size: 24px;
line-height: 36px;
letter-spacing: 0%;
text-align: center;
}
}
.page-content {
color: var(--ui-color-two);
.label {
display: inline-block;
margin-inline-end: 1em;
font-family: IRANSansX;
font-weight: 300;
font-size: 14px;
line-height: 21px;
letter-spacing: 0%;
text-align: right;
color: #626b84;
width: 77px;
height: 21;
}
.value {
font-family: IRANSansX;
font-weight: 300;
font-size: 14px;
line-height: 21px;
letter-spacing: 0%;
text-align: right;
color: #1b2132;
}
.location {
width: 672;
height: 348;
border-width: 1px;
border-radius: 16px;
border: 1px solid;
border-image-source: linear-gradient(
102.02deg,
#4be8ae 7.38%,
#00a762 91.78%
);
}
}
}
}
</style>