s.esmaeiliandClaude Opus 4.6
bb7f1e3378
Rebuild Docker setup with simplified nginx-only Dockerfile (build runs on host). Add category detail pages, IRANSans font files, product images, and update all landing sections. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
116 lines
4.3 KiB
Vue
116 lines
4.3 KiB
Vue
<script setup lang="ts">
|
||
import { AtSign, Globe, Phone, Send } from "lucide-vue-next";
|
||
import { CATEGORIES } from "#shared/data/categories";
|
||
import Logo from "~/components/ui/Logo.vue";
|
||
|
||
const QUICK_LINKS = [
|
||
{ href: "/#home", label: "خانه" },
|
||
{ href: "/#products", label: "محصولات" },
|
||
{ href: "/#about", label: "درباره ما" },
|
||
{ href: "/#services", label: "خدمات" },
|
||
{ href: "/#standards", label: "استانداردها" },
|
||
{ href: "/#industries", label: "صنایع" },
|
||
];
|
||
|
||
const PRODUCT_LINKS = CATEGORIES.map((c) => ({
|
||
label: c.name,
|
||
href: `/categories/${c.slug}`,
|
||
}));
|
||
|
||
const SOCIALS = [
|
||
{ icon: Globe, label: "وب‌سایت" },
|
||
{ icon: Send, label: "تلگرام" },
|
||
{ icon: AtSign, label: "ایمیل" },
|
||
{ icon: Phone, label: "تماس" },
|
||
];
|
||
</script>
|
||
|
||
<template>
|
||
<footer class="relative overflow-hidden border-t border-line">
|
||
<div class="hazard h-2.5" />
|
||
|
||
<div class="mx-auto max-w-[1480px] px-5 md:px-8">
|
||
<div class="grid gap-12 py-16 md:grid-cols-12 md:py-20">
|
||
<!-- brand -->
|
||
<div class="md:col-span-5">
|
||
<Logo />
|
||
<p class="mt-6 max-w-sm text-sm leading-8 text-muted">
|
||
تأمین‌کننده تخصصی تجهیزات حفاظت فردی و راهکارهای ایمنی صنعتی؛
|
||
همراه سازمان‌ها از سال ۱۳۸۶ در مسیر صفر شدن حوادث کاری.
|
||
</p>
|
||
<div class="mt-7 flex gap-3">
|
||
<a
|
||
v-for="s in SOCIALS"
|
||
:key="s.label"
|
||
href="/#contact"
|
||
:aria-label="s.label"
|
||
class="flex size-10 items-center justify-center rounded-lg border border-line text-muted transition-all duration-300 hover:border-accent hover:bg-accent hover:text-bg"
|
||
>
|
||
<component :is="s.icon" class="size-4" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- quick links -->
|
||
<div class="md:col-span-2">
|
||
<div class="font-mono text-xs tracking-[0.25em] text-accent">// دسترسی</div>
|
||
<ul class="mt-5 space-y-3">
|
||
<li v-for="l in QUICK_LINKS" :key="l.href">
|
||
<a :href="l.href" class="text-sm text-muted transition-colors hover:text-ink">
|
||
{{ l.label }}
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!-- products -->
|
||
<div class="md:col-span-2">
|
||
<div class="font-mono text-xs tracking-[0.25em] text-accent">// محصولات</div>
|
||
<ul class="mt-5 space-y-3">
|
||
<li v-for="p in PRODUCT_LINKS" :key="p.href">
|
||
<NuxtLink :to="p.href" class="text-sm text-muted transition-colors hover:text-ink">
|
||
{{ p.label }}
|
||
</NuxtLink>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!-- contact -->
|
||
<div class="md:col-span-3">
|
||
<div class="font-mono text-xs tracking-[0.25em] text-accent">// ارتباط</div>
|
||
<address class="mt-5 space-y-3 text-sm text-muted not-italic">
|
||
<p class="leading-7">
|
||
تهران، خیابان کارگر شمالی،
|
||
<br />
|
||
خیابان فر، کوچه دوم، پلاک ۱۲
|
||
</p>
|
||
<p class="font-mono tracking-wider" dir="ltr">۰۲۱ - ۹۱ ۰۰ ۸۸ ۰۰</p>
|
||
<p class="font-mono tracking-wider" dir="ltr">info@imenpishgaman.ir</p>
|
||
<p class="pt-2 text-xs leading-6">
|
||
شنبه تا پنجشنبه — ۸:۰۰ تا ۱۷:۰۰
|
||
<br />
|
||
پشتیبانی اضطراری: ۲۴/۷
|
||
</p>
|
||
</address>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- giant wordmark -->
|
||
<div aria-hidden="true" class="pointer-events-none select-none pb-6">
|
||
<div class="text-outline text-center text-[17vw] font-black leading-[0.85] md:text-[11vw]">
|
||
ایمن پیشگامان
|
||
</div>
|
||
</div>
|
||
|
||
<div
|
||
class="flex flex-wrap items-center justify-between gap-4 border-t border-line py-6 text-xs text-muted"
|
||
>
|
||
<div>© ۱۴۰۴ ایمن پیشگامان — تمامی حقوق محفوظ است.</div>
|
||
<div class="font-mono text-[10px] tracking-[0.25em]">
|
||
ISO 9001:2015 — CE CERTIFIED PPE SUPPLIER
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
</template>
|