diff --git a/about_us_image.json b/about_us_image.json new file mode 100644 index 00000000..29f681b9 --- /dev/null +++ b/about_us_image.json @@ -0,0 +1 @@ +{"id":34942790,"local_path":"assets\/images\/pexels\/about-us-34942790.jpg","photographer":"Blanca Isela","photographer_url":"https:\/\/www.pexels.com\/@blanca-isela-2156722885","original_url":"https:\/\/images.pexels.com\/photos\/34942790\/pexels-photo-34942790.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940"} \ No newline at end of file diff --git a/api/get_pexels_image.php b/api/get_pexels_image.php new file mode 100644 index 00000000..ad928ba4 --- /dev/null +++ b/api/get_pexels_image.php @@ -0,0 +1,78 @@ +'Failed to fetch video from Pexels.']); + exit; + } + $video = $data['videos'][0]; + $src = ''; + // Find the best quality mp4 link + foreach($video['video_files'] as $file) { + if ($file['file_type'] === 'video/mp4' && (strpos($file['link'], 'external') !== false)) { + $src = $file['link']; + break; + } + } + if (empty($src)) { + echo json_encode(['error'=>'No suitable video file found.']); + exit; + } + + $target_dir = __DIR__ . '/../assets/videos/'; + $target_filename = $video['id'] . '.mp4'; + $target_path = $target_dir . $target_filename; + + if (!is_dir($target_dir)) { + mkdir($target_dir, 0775, true); + } + + if (download_to($src, $target_path)) { + echo json_encode([ + 'id' => $video['id'], + 'local_path' => 'assets/videos/' . $target_filename, + 'original_url' => $src + ]); + } else { + echo json_encode(['error'=>'Failed to download and save video.']); + } + +} else { // It's a photo + $url = 'https://api.pexels.com/v1/search?query=' . urlencode($query) . '&orientation=' . urlencode($orientation) . '&per_page=1&page=1'; + $data = pexels_get($url); + + if (!$data || empty($data['photos'])) { + echo json_encode(['error'=>'Failed to fetch image from Pexels.']); + exit; + } + + $photo = $data['photos'][0]; + $src = $photo['src']['large2x'] ?? ($photo['src']['large'] ?? $photo['src']['original']); + $target_dir = __DIR__ . '/../assets/images/pexels/'; + $target_filename = 'about-us-' . $photo['id'] . '.jpg'; + $target_path = $target_dir . $target_filename; + + if (!is_dir($target_dir)) { + mkdir($target_dir, 0775, true); + } + + if (download_to($src, $target_path)) { + echo json_encode([ + 'id' => $photo['id'], + 'local_path' => 'assets/images/pexels/' . $target_filename, + 'photographer' => $photo['photographer'] ?? null, + 'photographer_url' => $photo['photographer_url'] ?? null, + 'original_url' => $src + ]); + } else { + echo json_encode(['error'=>'Failed to download and save image.']); + } +} diff --git a/assets/css/custom.css b/assets/css/custom.css index a21856f2..b650755b 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -100,6 +100,9 @@ html.dark .btn-primary { box-shadow: 0 2px 15px rgba(0,0,0,0.05); border-bottom: 1px solid var(--border-color); transition: background-color 0.3s ease; + position: sticky; + top: 0; + z-index: 1020; } html.dark .site-header { @@ -228,9 +231,7 @@ html.dark .color-swatches [style*="#000000"] + label { .bg-dark { background-color: var(--background-color) !important; } -.text-white { - color: var(--text-color) !important; -} + .bg-dark-2 { background-color: var(--surface-color) !important; } @@ -262,20 +263,22 @@ html.dark .color-swatches [style*="#000000"] + label { /* --- Responsive Design --- */ @media (max-width: 768px) { + + + /* About Us Mobile */ + #about-us .display-5 { + font-size: 2rem; + } + #about-us .fs-5 { + font-size: 1.1rem; + } + .display-3 { font-size: 2.5rem; } .display-4 { font-size: 2rem; } - .display-5 { - font-size: 1.75rem; - } - - .hero-section { - height: auto; /* Adjust height for mobile */ - padding: 100px 0; - } .product-card .product-info { padding: 15px; @@ -288,4 +291,87 @@ html.dark .color-swatches [style*="#000000"] + label { .site-footer .col-lg-2, .site-footer .col-lg-3, .site-footer .col-lg-4 { margin-bottom: 30px; } -} \ No newline at end of file +} + +/* --- Header Icon Fixes for Dark Mode --- */ + +/* Ensure theme toggle and other header buttons are visible in dark mode */ +html.dark .site-header .btn { + color: var(--text-color); /* Use the light text color from dark theme variables */ +} + +html.dark .site-header .btn:hover { + color: var(--primary-color); /* Use a hover color */ +} + +/* Fix for bootstrap's default hamburger icon in dark mode */ +html.dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); +} + +/* Fix for the border color of the toggler button itself */ +html.dark .navbar-toggler { + border-color: rgba(255, 255, 255, 0.15); +} + +@media (max-width: 767.98px) { + .social-icons { + justify-content: center; + } +} + +/* --- Custom Gold Button --- */ +.btn-outline-gold { + border-color: #D4AF37; /* Gold */ + color: #D4AF37; + padding: 12px 30px; + font-weight: 600; + border-radius: 50px; + transition: all 0.3s ease-in-out; +} + +.btn-outline-gold:hover { + background-color: #D4AF37; + color: var(--white-color); +} + +html.dark .btn-outline-gold { + border-color: var(--accent-color); + color: var(--accent-color); +} + +html.dark .btn-outline-gold:hover { + background-color: var(--accent-color); + color: var(--heading-color); +} + +/* --- Hero Section Text --- */ +.hero-section { + position: relative; + height: 70vh; + display: flex; + align-items: center; + background: url('../assets/pasted-20251201-135328-2aedc448.jpg') no-repeat center center/cover; +} + +.hero-section .container { + width: 100%; + text-align: center; +} + +.hero-section .row { + justify-content: flex-end; +} +.hero-section h1, +.hero-section p { + color: #FFFFFF; + text-shadow: 0 2px 8px rgba(0,0,0,0.5); +} + +/* --- About Us Section Text Color Fix for Dark Mode --- */ +html.dark #about-us h2, +html.dark #about-us p { + color: var(--heading-color) !important; /* Use a light, readable color */ +} + + diff --git a/assets/images/pexels/about-us-34942790.jpg b/assets/images/pexels/about-us-34942790.jpg new file mode 100644 index 00000000..ed8b3044 Binary files /dev/null and b/assets/images/pexels/about-us-34942790.jpg differ diff --git a/assets/js/main.js b/assets/js/main.js index 6130445d..e9f42b87 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1 +1,51 @@ // Custom JavaScript will go here + +document.addEventListener('DOMContentLoaded', () => { + // --- Theme Toggle Functionality --- + const themeToggleButton = document.getElementById('theme-toggle'); + const htmlElement = document.documentElement; + const prefersDarkScheme = window.matchMedia('(prefers-color-scheme: dark)'); + + function applyTheme(theme) { + if (theme === 'dark') { + htmlElement.classList.add('dark'); + if (themeToggleButton) themeToggleButton.innerHTML = ''; + } else { + htmlElement.classList.remove('dark'); + if (themeToggleButton) themeToggleButton.innerHTML = ''; + } + } + + function initializeTheme() { + const savedTheme = localStorage.getItem('theme'); + if (savedTheme) { + applyTheme(savedTheme); + } else { + applyTheme(prefersDarkScheme.matches ? 'dark' : 'light'); + } + } + + if (themeToggleButton) { + themeToggleButton.addEventListener('click', () => { + const newTheme = htmlElement.classList.contains('dark') ? 'light' : 'dark'; + localStorage.setItem('theme', newTheme); + applyTheme(newTheme); + }); + } + + prefersDarkScheme.addEventListener('change', (e) => { + if (!localStorage.getItem('theme')) { + applyTheme(e.matches ? 'dark' : 'light'); + } + }); + + initializeTheme(); + + // --- AOS Initialization --- + AOS.init({ + duration: 800, + once: true, + }); + + +}); diff --git a/assets/pasted-20251201-132552-31c63669.jpg b/assets/pasted-20251201-132552-31c63669.jpg new file mode 100644 index 00000000..e13b52be Binary files /dev/null and b/assets/pasted-20251201-132552-31c63669.jpg differ diff --git a/assets/pasted-20251201-133153-936f72d3.jpg b/assets/pasted-20251201-133153-936f72d3.jpg new file mode 100644 index 00000000..20b33090 Binary files /dev/null and b/assets/pasted-20251201-133153-936f72d3.jpg differ diff --git a/assets/pasted-20251201-133805-eb28435e.jpg b/assets/pasted-20251201-133805-eb28435e.jpg new file mode 100644 index 00000000..2e53680c Binary files /dev/null and b/assets/pasted-20251201-133805-eb28435e.jpg differ diff --git a/assets/pasted-20251201-135328-2aedc448.jpg b/assets/pasted-20251201-135328-2aedc448.jpg new file mode 100644 index 00000000..0ee64f05 Binary files /dev/null and b/assets/pasted-20251201-135328-2aedc448.jpg differ diff --git a/hero_video.json b/hero_video.json new file mode 100644 index 00000000..29f681b9 --- /dev/null +++ b/hero_video.json @@ -0,0 +1 @@ +{"id":34942790,"local_path":"assets\/images\/pexels\/about-us-34942790.jpg","photographer":"Blanca Isela","photographer_url":"https:\/\/www.pexels.com\/@blanca-isela-2156722885","original_url":"https:\/\/images.pexels.com\/photos\/34942790\/pexels-photo-34942790.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940"} \ No newline at end of file diff --git a/includes/footer.php b/includes/footer.php index a4a48646..1941d4a2 100644 --- a/includes/footer.php +++ b/includes/footer.php @@ -36,7 +36,7 @@
ما را دنبال کنید

از جدیدترین محصولات و تخفیف‌ها باخبر شوید.

-
+ - - - - - + + + +
\ No newline at end of file diff --git a/includes/header.php b/includes/header.php index 6cdcbefe..e713bbbf 100644 --- a/includes/header.php +++ b/includes/header.php @@ -6,7 +6,7 @@ $cart_item_count = isset($_SESSION['cart']) ? array_sum(array_column($_SESSION[' $page_title = $page_title ?? 'فروشگاه آتیمه'; // Default title ?> - + @@ -29,12 +29,29 @@ $page_title = $page_title ?? 'فروشگاه آتیمه'; // Default title + + +
+