|
|
<!DOCTYPE html> |
|
|
<html lang="fa" dir="rtl"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>دانژه ارومیه | کشف دوباره طلا با زیورآلات دست‌ساز ۲۴ عیار</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Noto+Naskh+Arabic:wght@400;500;600;700&display=swap'); |
|
|
|
|
|
body { |
|
|
font-family: 'Noto Naskh Arabic', serif; |
|
|
} |
|
|
|
|
|
.hero-slider { |
|
|
height: 70vh; |
|
|
} |
|
|
|
|
|
.swiper-container { |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
} |
|
|
|
|
|
.swiper-slide { |
|
|
background-size: cover; |
|
|
background-position: center; |
|
|
} |
|
|
|
|
|
.swiper-button-next, |
|
|
.swiper-button-prev { |
|
|
color: white; |
|
|
background-color: rgba(0,0,0,0.3); |
|
|
width: 50px; |
|
|
height: 50px; |
|
|
border-radius: 50%; |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.swiper-button-next:hover, |
|
|
.swiper-button-prev:hover { |
|
|
background-color: rgba(0,0,0,0.5); |
|
|
} |
|
|
|
|
|
.swiper-button-next:after, |
|
|
.swiper-button-prev:after { |
|
|
font-size: 24px; |
|
|
font-weight: bold; |
|
|
} |
|
|
|
|
|
.swiper-pagination-bullet { |
|
|
background: white; |
|
|
opacity: 0.5; |
|
|
width: 12px; |
|
|
height: 12px; |
|
|
} |
|
|
|
|
|
.swiper-pagination-bullet-active { |
|
|
background: #d4af37; |
|
|
opacity: 1; |
|
|
} |
|
|
|
|
|
.month-section { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.month-section:hover { |
|
|
transform: translateY(-5px); |
|
|
box-shadow: 0 10px 20px rgba(0,0,0,0.1); |
|
|
} |
|
|
|
|
|
.product-card { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.product-card:hover { |
|
|
transform: translateY(-5px); |
|
|
box-shadow: 0 10px 20px rgba(0,0,0,0.1); |
|
|
} |
|
|
|
|
|
.sale-badge { |
|
|
position: absolute; |
|
|
top: 10px; |
|
|
left: 10px; |
|
|
background-color: #d4af37; |
|
|
color: white; |
|
|
padding: 5px 10px; |
|
|
border-radius: 5px; |
|
|
font-weight: bold; |
|
|
z-index: 10; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-50"> |
|
|
|
|
|
<header class="bg-white shadow-md"> |
|
|
<div class="container mx-auto px-4 py-4 flex justify-between items-center"> |
|
|
<div class="flex items-center space-x-4"> |
|
|
<button class="md:hidden text-gray-700"> |
|
|
<i class="fas fa-bars text-2xl"></i> |
|
|
</button> |
|
|
<a href="#" class="text-2xl font-bold text-yellow-700">دانژه ارومیه</a> |
|
|
</div> |
|
|
|
|
|
<nav class="hidden md:flex space-x-8"> |
|
|
<a href="#" class="text-gray-700 hover:text-yellow-600">خانه</a> |
|
|
<a href="#" class="text-gray-700 hover:text-yellow-600">محصولات</a> |
|
|
<a href="#" class="text-gray-700 hover:text-yellow-600">ماه تولد</a> |
|
|
<a href="#" class="text-gray-700 hover:text-yellow-600">درباره ما</a> |
|
|
<a href="#" class="text-gray-700 hover:text-yellow-600">تماس با ما</a> |
|
|
</nav> |
|
|
|
|
|
<div class="flex items-center space-x-4"> |
|
|
<button class="text-gray-700"> |
|
|
<i class="fas fa-search text-xl"></i> |
|
|
</button> |
|
|
<button class="text-gray-700"> |
|
|
<i class="fas fa-user text-xl"></i> |
|
|
</button> |
|
|
<button class="text-gray-700 relative"> |
|
|
<i class="fas fa-shopping-cart text-xl"></i> |
|
|
<span class="absolute -top-2 -right-2 bg-yellow-600 text-white text-xs rounded-full w-5 h-5 flex items-center justify-center">3</span> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
|
|
|
<section class="hero-slider relative"> |
|
|
<div class="swiper-container h-full"> |
|
|
<div class="swiper-wrapper"> |
|
|
|
|
|
<div class="swiper-slide flex items-center" style="background-image: url('https://zarsam.com/wp-content/uploads/2025/08/slder044-min-1920x700.jpg')"> |
|
|
<div class="container mx-auto px-4 text-white"> |
|
|
<h1 class="text-4xl md:text-5xl font-bold mb-4">کشف دوباره طلا با زیورآلات دست‌ساز ۲۴ عیار</h1> |
|
|
<p class="text-xl mb-6">زیورآلات منحصر به فرد با طراحی خاص برای شما</p> |
|
|
<a href="#" class="bg-yellow-600 hover:bg-yellow-700 text-white px-6 py-3 rounded-md font-medium transition duration-300">مشاهده محصولات</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="swiper-slide flex items-center" style="background-image: url('https://zarsam.com/wp-content/uploads/2025/08/slider2-min.jpg')"> |
|
|
<div class="container mx-auto px-4 text-white"> |
|
|
<h1 class="text-4xl md:text-5xl font-bold mb-4">مجموعه جدید زودیاک</h1> |
|
|
<p class="text-xl mb-6">زیورآلات خاص بر اساس ماه تولد شما</p> |
|
|
<a href="#" class="bg-yellow-600 hover:bg-yellow-700 text-white px-6 py-3 rounded-md font-medium transition duration-300">مشاهده مجموعه</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="swiper-slide flex items-center" style="background-image: url('https://zarsam.com/wp-content/uploads/2025/08/slider3-min.jpg')"> |
|
|
<div class="container mx-auto px-4 text-white"> |
|
|
<h1 class="text-4xl md:text-5xl font-bold mb-4">حراج ویژه تابستانه</h1> |
|
|
<p class="text-xl mb-6">تا 40% تخفیف روی محصولات منتخب</p> |
|
|
<a href="#" class="bg-yellow-600 hover:bg-yellow-700 text-white px-6 py-3 rounded-md font-medium transition duration-300">مشاهده حراج</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="swiper-pagination"></div> |
|
|
|
|
|
|
|
|
<div class="swiper-button-next"></div> |
|
|
<div class="swiper-button-prev"></div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-12 bg-white"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<h2 class="text-3xl font-bold text-center mb-12">زیورآلات ماه تولد</h2> |
|
|
|
|
|
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-6"> |
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-11@3x-100.jpg" alt="فروردین" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">فروردین</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-7@3x-100.jpg" alt="اردیبهشت" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">اردیبهشت</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-9@3x-100.jpg" alt="خرداد" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">خرداد</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-4@3x-100.jpg" alt="تیر" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">تیر</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-2@3x-100.jpg" alt="مرداد" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">مرداد</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-6@3x-100.jpg" alt="شهریور" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">شهریور</h3> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-6 mt-6"> |
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-8@3x-100.jpg" alt="مهر" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">مهر</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-3@3x-100.jpg" alt="آبان" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">آبان</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-1@3x-100-1.jpg" alt="آذر" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">آذر</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-5@3x-100.jpg" alt="دی" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">دی</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-10@3x-100.jpg" alt="بهمن" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">بهمن</h3> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="month-section bg-gray-50 rounded-lg overflow-hidden text-center p-4 cursor-pointer"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-12@3x-100-1.jpg" alt="اسفند" class="w-full h-40 object-contain mb-4"> |
|
|
<h3 class="text-xl font-semibold">اسفند</h3> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-12 bg-gray-100"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="flex justify-between items-center mb-8"> |
|
|
<h2 class="text-3xl font-bold">حراج ویژه</h2> |
|
|
<a href="#" class="text-yellow-600 hover:text-yellow-700 flex items-center"> |
|
|
مشاهده همه |
|
|
<i class="fas fa-chevron-left mr-2"></i> |
|
|
</a> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6"> |
|
|
|
|
|
<div class="product-card bg-white rounded-lg overflow-hidden shadow-sm relative"> |
|
|
<span class="sale-badge">حراج</span> |
|
|
<div class="relative h-64 overflow-hidden"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2024/06/10005635-1.jpg" alt="محصول" class="w-full h-full object-cover"> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<h3 class="text-lg font-semibold mb-2">تابلو قاصدک 2525 سانتی متر</h3> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-yellow-600 font-bold">9,584,000 تومان</span> |
|
|
<button class="text-gray-500 hover:text-yellow-600"> |
|
|
<i class="far fa-heart text-xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
<button class="w-full mt-4 bg-yellow-600 hover:bg-yellow-700 text-white py-2 rounded-md transition duration-300"> |
|
|
افزودن به سبد خرید |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="product-card bg-white rounded-lg overflow-hidden shadow-sm relative"> |
|
|
<span class="sale-badge">حراج</span> |
|
|
<div class="relative h-64 overflow-hidden"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2024/06/10005674-W2.jpg" alt="محصول" class="w-full h-full object-cover"> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<h3 class="text-lg font-semibold mb-2">تابلو دریچ کچر 3522 سانتی متر</h3> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-yellow-600 font-bold">8,750,000 تومان</span> |
|
|
<button class="text-gray-500 hover:text-yellow-600"> |
|
|
<i class="far fa-heart text-xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
<button class="w-full mt-4 bg-yellow-600 hover:bg-yellow-700 text-white py-2 rounded-md transition duration-300"> |
|
|
افزودن به سبد خرید |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="product-card bg-white rounded-lg overflow-hidden shadow-sm relative"> |
|
|
<span class="sale-badge">حراج</span> |
|
|
<div class="relative h-64 overflow-hidden"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2024/06/10007325-1439608558.jpg" alt="محصول" class="w-full h-full object-cover"> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<h3 class="text-lg font-semibold mb-2">تابلو بهار زیتون</h3> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-yellow-600 font-bold">7,920,000 تومان</span> |
|
|
<button class="text-gray-500 hover:text-yellow-600"> |
|
|
<i class="far fa-heart text-xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
<button class="w-full mt-4 bg-yellow-600 hover:bg-yellow-700 text-white py-2 rounded-md transition duration-300"> |
|
|
افزودن به سبد خرید |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="product-card bg-white rounded-lg overflow-hidden shadow-sm relative"> |
|
|
<span class="sale-badge">حراج</span> |
|
|
<div class="relative h-64 overflow-hidden"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2024/06/10013201-325x325.jpg" alt="محصول" class="w-full h-full object-cover"> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<h3 class="text-lg font-semibold mb-2">تابلو بسم الله کتیبه 3</h3> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-yellow-600 font-bold">6,450,000 تومان</span> |
|
|
<button class="text-gray-500 hover:text-yellow-600"> |
|
|
<i class="far fa-heart text-xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
<button class="w-full mt-4 bg-yellow-600 hover:bg-yellow-700 text-white py-2 rounded-md transition duration-300"> |
|
|
افزودن به سبد خرید |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-12 bg-white"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
|
|
|
|
|
<div class="text-center p-6 rounded-lg bg-gray-50"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-13@5x-100.jpg" alt="شرایط بازخرید" class="w-24 h-24 mx-auto mb-4"> |
|
|
<h3 class="text-xl font-semibold mb-2">شرایط بازخرید</h3> |
|
|
<p class="text-gray-600">گارانتی بازگشت وجه و تعویض محصولات با شرایط ویژه</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="text-center p-6 rounded-lg bg-gray-50"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-14@5x-100.jpg" alt="اعتبارنامه ها" class="w-24 h-24 mx-auto mb-4"> |
|
|
<h3 class="text-xl font-semibold mb-2">اعتبارنامه ها</h3> |
|
|
<p class="text-gray-600">دارای گواهینامه های معتبر بین المللی و داخلی</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="text-center p-6 rounded-lg bg-gray-50"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-15@5x-100.jpg" alt="اعطای نمایندگی" class="w-24 h-24 mx-auto mb-4"> |
|
|
<h3 class="text-xl font-semibold mb-2">اعطای نمایندگی</h3> |
|
|
<p class="text-gray-600">فرصت سرمایه گذاری و همکاری با زرسام</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-12 bg-gray-100"> |
|
|
<div class="container mx-auto px-4 text-center"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/Asset-16@3x-100-min.jpg" alt="تابلو زودیاک" class="w-full max-w-2xl mx-auto mb-8"> |
|
|
<h2 class="text-3xl font-bold mb-4">تابلو زودیاک</h2> |
|
|
<p class="text-xl text-gray-600 mb-8">جذابیت را کشف کنید</p> |
|
|
<a href="#" class="inline-block bg-yellow-600 hover:bg-yellow-700 text-white px-6 py-3 rounded-md font-medium transition duration-300">مشاهده محصولات زودیاک</a> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-12 bg-white"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<h2 class="text-3xl font-bold text-center mb-12">جدیدترین مطالب</h2> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6"> |
|
|
|
|
|
<div class="bg-white rounded-lg overflow-hidden shadow-sm"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/08/virgo-traits-symbol-480x257.jpg" alt="نماد و خصوصیات متولد ماه شهریور" class="w-full h-48 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="text-lg font-semibold mb-2">نماد و خصوصیات متولد ماه شهریور</h3> |
|
|
<p class="text-gray-600 mb-4">هدیه خاص با طلا ۲۴ عیار دانژه ارومیه</p> |
|
|
<a href="#" class="text-yellow-600 hover:text-yellow-700 font-medium">مطالعه بیشتر</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-lg overflow-hidden shadow-sm"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/04/the-best-birthday-gift-for-sfand2-480x270.webp" alt="هدیه برای متولدین اسفند" class="w-full h-48 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="text-lg font-semibold mb-2">هدیه برای متولدین اسفند</h3> |
|
|
<p class="text-gray-600 mb-4">مناسب ترین هدایا برای متولدین اسفند ماه</p> |
|
|
<a href="#" class="text-yellow-600 hover:text-yellow-700 font-medium">مطالعه بیشتر</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-lg overflow-hidden shadow-sm"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/04/%D9%87%D8%AF%DB%8C%D9%87-%D8%A8%D8%B1%D8%A7%DB%8C-%D9%85%D8%AA%D9%88%D9%84%D8%AF%DB%8C%D9%86-%D8%A8%D9%87%D9%85%D9%86-%D9%85%D8%A7%D9%87%DB%8C1-480x320.webp" alt="هدیه برای متولدین بهمن ماهی" class="w-full h-48 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="text-lg font-semibold mb-2">هدیه برای متولدین بهمن ماهی</h3> |
|
|
<p class="text-gray-600 mb-4">مناسب ترین هدایا برای متولدین بهمن ماه</p> |
|
|
<a href="#" class="text-yellow-600 hover:text-yellow-700 font-medium">مطالعه بیشتر</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-lg overflow-hidden shadow-sm"> |
|
|
<img src="https://zarsam.com/wp-content/uploads/2025/04/2218484_265-480x320.webp" alt="بهترین هدیه برای متولدین دی ماهی" class="w-full h-48 object-cover"> |
|
|
<div class="p-4"> |
|
|
<h3 class="text-lg font-semibold mb-2">بهترین هدیه برای متولدین دی ماهی</h3> |
|
|
<p class="text-gray-600 mb-4">مناسب ترین هدایا برای متولدین دی ماه</p> |
|
|
<a href="#" class="text-yellow-600 hover:text-yellow-700 font-medium">مطالعه بیشتر</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-12 bg-yellow-600 text-white"> |
|
|
<div class="container mx-auto px-4 text-center"> |
|
|
<h2 class="text-3xl font-bold mb-4">خبرنامه دانژه ارومیه</h2> |
|
|
<p class="text-xl mb-8">با عضویت در خبرنامه دانژه از تخفیف‌ها و جدیدترین محصولات ما باخبر شوید.</p> |
|
|
|
|
|
<div class="max-w-md mx-auto flex"> |
|
|
<input type="email" placeholder="آدرس ایمیل شما" class="flex-grow px-4 py-3 rounded-r-md text-gray-800 focus:outline-none"> |
|
|
<button class="bg-yellow-700 hover:bg-yellow-800 px-6 py-3 rounded-l-md font-medium transition duration-300">عضویت</button> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<footer class="bg-gray-900 text-white py-12"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8"> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-xl font-bold mb-4">درباره زرسام</h3> |
|
|
<p class="text-gray-400">دانژه ارومیه ارائه دهنده زیورآلات طلای 24 عیار با طراحی منحصر به فرد است.</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div> |
|
|
<h3 class="text-xl font-bold mb-4">لینک های سریع</h3> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#" class="text-gray-400 hover:text-yellow-500">خانه</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-yellow-500">محصولات</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-yellow-500">ماه تولد</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-yellow-500">درباره ما</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-yellow-500">تماس با ما</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div> |
|
|
<h3 class="text-xl font-bold mb-4">تماس با ما</h3> |
|
|
<ul class="space-y-2"> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-map-marker-alt ml-2 text-yellow-500"></i> |
|
|
<span class="text-gray-400">ارومیه خیابان شهید بهشتی مجتمع تورک مال طبقه همکف واحد 204</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-phone ml-2 text-yellow-500"></i> |
|
|
<span class="text-gray-400">044-33464130</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-envelope ml-2 text-yellow-500"></i> |
|
|
<span class="text-gray-400">info@danje24.com</span> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div> |
|
|
<h3 class="text-xl font-bold mb-4">شبکه های اجتماعی</h3> |
|
|
<div class="flex space-x-4"> |
|
|
<a href="#" class="bg-gray-800 hover:bg-gray-700 w-10 h-10 rounded-full flex items-center justify-center"> |
|
|
<i class="fab fa-instagram text-lg"></i> |
|
|
</a> |
|
|
<a href="#" class="bg-gray-800 hover:bg-gray-700 w-10 h-10 rounded-full flex items-center justify-center"> |
|
|
<i class="fab fa-telegram text-lg"></i> |
|
|
</a> |
|
|
<a href="#" class="bg-gray-800 hover:bg-gray-700 w-10 h-10 rounded-full flex items-center justify-center"> |
|
|
<i class="fab fa-whatsapp text-lg"></i> |
|
|
</a> |
|
|
<a href="#" class="bg-gray-800 hover:bg-gray-700 w-10 h-10 rounded-full flex items-center justify-center"> |
|
|
<i class="fab fa-twitter text-lg"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400"> |
|
|
<p>© 2023 دانژه ارومیه. تمام حقوق محفوظ است.</p> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css"> |
|
|
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script> |
|
|
|
|
|
<script> |
|
|
|
|
|
const swiper = new Swiper('.swiper-container', { |
|
|
loop: true, |
|
|
autoplay: { |
|
|
delay: 5000, |
|
|
disableOnInteraction: false, |
|
|
}, |
|
|
pagination: { |
|
|
el: '.swiper-pagination', |
|
|
clickable: true, |
|
|
}, |
|
|
navigation: { |
|
|
nextEl: '.swiper-button-next', |
|
|
prevEl: '.swiper-button-prev', |
|
|
}, |
|
|
}); |
|
|
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
const mobileMenuButton = document.querySelector('.md\\:hidden'); |
|
|
const navMenu = document.querySelector('nav'); |
|
|
|
|
|
mobileMenuButton.addEventListener('click', function() { |
|
|
navMenu.classList.toggle('hidden'); |
|
|
navMenu.classList.toggle('flex'); |
|
|
navMenu.classList.toggle('flex-col'); |
|
|
navMenu.classList.toggle('absolute'); |
|
|
navMenu.classList.toggle('top-16'); |
|
|
navMenu.classList.toggle('left-0'); |
|
|
navMenu.classList.toggle('right-0'); |
|
|
navMenu.classList.toggle('bg-white'); |
|
|
navMenu.classList.toggle('shadow-lg'); |
|
|
navMenu.classList.toggle('p-4'); |
|
|
navMenu.classList.toggle('z-50'); |
|
|
}); |
|
|
|
|
|
|
|
|
const addToCartButtons = document.querySelectorAll('.product-card button'); |
|
|
addToCartButtons.forEach(button => { |
|
|
button.addEventListener('click', function() { |
|
|
this.innerHTML = '<i class="fas fa-check mr-2"></i> افزوده شد'; |
|
|
this.classList.add('bg-green-600'); |
|
|
this.classList.remove('bg-yellow-600', 'hover:bg-yellow-700'); |
|
|
|
|
|
setTimeout(() => { |
|
|
this.innerHTML = 'افزودن به سبد خرید'; |
|
|
this.classList.remove('bg-green-600'); |
|
|
this.classList.add('bg-yellow-600', 'hover:bg-yellow-700'); |
|
|
}, 2000); |
|
|
}); |
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Neemac/danjet" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
