Spaces:

Rayan545454
/

vvff55

Running

App Files Files Community

Rayan545454 commited on Sep 11, 2025

Commit

630aa7f

verified ·

1 Parent(s): 78ce137

أضف زر +966 53 089 3127 بعدها الواتساب - Initial Deployment

Browse files

Files changed (3) hide show

README.md +7 -5
index.html +264 -18
prompts.txt +25 -0

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Vvff55
-emoji: 🐢
-colorFrom: purple
-colorTo: pink
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: vvff55
+emoji: 🐳
+colorFrom: green
+colorTo: purple
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,265 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
 </html>

+<!DOCTYPE html>
+<html lang="ar" dir="rtl">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>عرض اليوم الوطني - دبلومات غرفة الزلفي</title>
+    <link rel="icon" type="image/x-icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🇸🇦</text></svg>">
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
+    <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
+    <script src="https://unpkg.com/feather-icons"></script>
+    <style>
+        @keyframes float {
+            0%, 100% { transform: translateY(0px); }
+            50% { transform: translateY(-20px); }
+        }
+        .float-animation {
+            animation: float 3s ease-in-out infinite;
+        }
+        @keyframes pulse-glow {
+            0%, 100% { box-shadow: 0 0 20px rgba(59, 130, 246, 0.5); }
+            50% { box-shadow: 0 0 40px rgba(59, 130, 246, 0.8), 0 0 60px rgba(59, 130, 246, 0.4); }
+        }
+        .pulse-glow {
+            animation: pulse-glow 2s ease-in-out infinite;
+        }
+        @keyframes countdown {
+            0% { transform: scale(1); }
+            50% { transform: scale(1.05); }
+            100% { transform: scale(1); }
+        }
+        .countdown-animation {
+            animation: countdown 1s ease-in-out infinite;
+        }
+        .gradient-bg {
+            background: linear-gradient(135deg, #1e3c72 0%, #2a5298 50%, #7e22ce 100%);
+        }
+        .text-shadow {
+            text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
+        }
+        .glass-effect {
+            backdrop-filter: blur(10px);
+            background: rgba(255, 255, 255, 0.1);
+            border: 1px solid rgba(255, 255, 255, 0.2);
+        }
+        .whatsapp-button {
+            transition: all 0.3s ease;
+            background: linear-gradient(45deg, #25D366, #128C7E);
+        }
+        .whatsapp-button:hover {
+            transform: translateY(-3px);
+            box-shadow: 0 10px 25px rgba(37, 211, 102, 0.4);
+        }
+        .confetti {
+            position: absolute;
+            width: 10px;
+            height: 10px;
+            background: #fbbf24;
+            animation: confetti-fall 3s linear infinite;
+        }
+        @keyframes confetti-fall {
+            0% {
+                transform: translateY(-100vh) rotate(0deg);
+                opacity: 1;
+            }
+            100% {
+                transform: translateY(100vh) rotate(360deg);
+                opacity: 0;
+            }
+        }
+    </style>
+</head>
+<body class="gradient-bg min-h-screen overflow-x-hidden">
+    <!-- Confetti Animation -->
+    <div id="confetti-container"></div>
+    <!-- Hero Section -->
+    <section class="relative min-h-screen flex items-center justify-center px-4">
+        <div class="absolute inset-0 opacity-10">
+            <div class="absolute top-1/4 left-1/4 w-96 h-96 bg-green-500 rounded-full filter blur-3xl animate-pulse"></div>
+            <div class="absolute top-3/4 right-1/4 w-96 h-96 bg-white rounded-full filter blur-3xl animate-pulse delay-1000"></div>
+        </div>
+        <div class="text-center z-10 max-w-4xl mx-auto" data-aos="fade-up">
+            <!-- Saudi Flag Emoji -->
+            <div class="text-8xl mb-6 float-animation">🇸🇦</div>
+            <!-- Main Title -->
+            <h1 class="text-4xl md:text-6xl lg:text-7xl font-bold text-white mb-6 text-shadow">
+                عرض اليوم الوطني
+            </h1>
+            <!-- Subtitle -->
+            <p class="text-xl md:text-2xl text-yellow-300 mb-8 font-semibold">
+                دبلومات غرفة الزلفي - خصم خاص بمناسبة اليوم الوطني
+            </p>
+            <!-- Offer Badge -->
+            <div class="inline-block bg-red-600 text-white px-8 py-4 rounded-full text-2xl font-bold mb-8 pulse-glow">
+                <i data-feather="percent" class="inline-block w-6 h-6 ml-2"></i>
+                خصم اليوم الوطني
+            </div>
+            <!-- Instructions Card -->
+            <div class="glass-effect rounded-2xl p-8 mb-8 max-w-2xl mx-auto">
+                <h2 class="text-2xl font-bold text-white mb-4">للاستفادة من العرض:</h2>
+                <div class="text-white text-lg space-y-3">
+                    <p class="flex items-center justify-center">
+                        <i data-feather="message-circle" class="w-5 h-5 ml-2"></i>
+                        أرسل على الواتساب: <span class="mr-1 font-bold text-yellow-300">"سجل الآن"</span>
+                    </p>
+                    <p class="text-sm text-gray-200">واذكر البيانات التالية:</p>
+                    <div class="bg-white/20 rounded-lg p-4 mt-4">
+                        <p class="text-xl font-bold text-yellow-300">
+                            • الاسم: ريان بن خالد
+                        </p>
+                    </div>
+                    <p class="text-lg text-green-300 font-semibold">
+                        وبإذن الله يوصلك الخصم
+                    </p>
+                </div>
+            </div>
+            <!-- Countdown Timer -->
+            <div class="mb-8">
+                <p class="text-white text-xl mb-4">العرض ينتهي خلال:</p>
+                <div id="countdown" class="flex justify-center space-x-4 space-x-reverse text-center">
+                    <div class="bg-white/20 rounded-lg p-4 countdown-animation">
+                        <div id="days" class="text-3xl font-bold text-white">00</div>
+                        <div class="text-sm text-gray-300">يوم</div>
+                    </div>
+                    <div class="bg-white/20 rounded-lg p-4 countdown-animation" style="animation-delay: 0.1s;">
+                        <div id="hours" class="text-3xl font-bold text-white">00</div>
+                        <div class="text-sm text-gray-300">ساعة</div>
+                    </div>
+                    <div class="bg-white/20 rounded-lg p-4 countdown-animation" style="animation-delay: 0.2s;">
+                        <div id="minutes" class="text-3xl font-bold text-white">00</div>
+                        <div class="text-sm text-gray-300">دقيقة</div>
+                    </div>
+                    <div class="bg-white/20 rounded-lg p-4 countdown-animation" style="animation-delay: 0.3s;">
+                        <div id="seconds" class="text-3xl font-bold text-white">00</div>
+                        <div class="text-sm text-gray-300">ثانية</div>
+                    </div>
+                </div>
+            </div>
+            <!-- WhatsApp Button -->
+            <div class="flex flex-col items-center space-y-4">
+                <a href="tel:+966530893127" class="bg-green-600 inline-flex items-center text-white font-bold py-4 px-8 rounded-full text-xl shadow-lg transform transition-all duration-300 hover:scale-110">
+                    <i data-feather="phone" class="w-6 h-6 ml-2"></i>
+                    +966 53 089 3127
+                </a>
+                <a href="https://wa.me/966530893127?text=%D8%B3%D8%AC%D9%84%20%D8%A7%D9%84%D8%A2%D9%86%0A%0A%D8%A7%D9%84%D8%A7%D8%B3%D9%85%3A%20%D8%B1%D9%8A%D8%A7%D9%86%20%D8%A8%D9%86%20%D8%AE%D8%A7%D9%84%D8%AF"
+                   class="whatsapp-button inline-flex items-center text-white font-bold py-4 px-8 rounded-full text-xl shadow-lg transform transition-all duration-300 hover:scale-110">
+                    <i data-feather="send" class="w-6 h-6 ml-2"></i>
+                    واتساب
+                </a>
+            </div>
+        </div>
+    </section>
+    <!-- Contact Section -->
+    <section class="py-16 bg-white/10">
+        <div class="container mx-auto px-4 text-center">
+            <h3 class="text-3xl font-bold text-white mb-8" data-aos="fade-up">تواصل مباشرة</h3>
+            <div class="bg-white rounded-2xl p-8 max-w-md mx-auto" data-aos="fade-up" data-aos-delay="200">
+                <p class="text-gray-700 text-2xl font-bold mb-4">+966 53 089 3127</p>
+                <div class="flex flex-col sm:flex-row gap-4 justify-center">
+                    <a href="tel:+966530893127" class="bg-green-600 text-white px-6 py-3 rounded-lg hover:bg-green-700 transition">
+                        <i data-feather="phone" class="w-5 h-5 inline-block ml-2"></i>
+                        اتصال مباشر
+                    </a>
+                    <button onclick="copyToClipboard()" class="bg-blue-600 text-white px-6 py-3 rounded-lg hover:bg-blue-700 transition">
+                        <i data-feather="copy" class="w-5 h-5 inline-block ml-2"></i>
+                        نسخ الرقم
+                    </button>
+                </div>
+            </div>
+        </div>
+    </section>
+    <script>
+        // Initialize AOS
+        AOS.init({
+            duration: 1000,
+            once: true
+        });
+        // Initialize Feather Icons
+        feather.replace();
+        // Countdown Timer
+        function updateCountdown() {
+            const endDate = new Date();
+            endDate.setDate(endDate.getDate() + 7); // 7 days from now
+            const now = new Date().getTime();
+            const distance = endDate - now;
+            const days = Math.floor(distance / (1000 * 60 * 60 * 24));
+            const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+            const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
+            const seconds = Math.floor((distance % (1000 * 60)) / 1000);
+            document.getElementById('days').textContent = days.toString().padStart(2, '0');
+            document.getElementById('hours').textContent = hours.toString().padStart(2, '0');
+            document.getElementById('minutes').textContent = minutes.toString().padStart(2, '0');
+            document.getElementById('seconds').textContent = seconds.toString().padStart(2, '0');
+        }
+        setInterval(updateCountdown, 1000);
+        updateCountdown();
+        // Copy to Clipboard
+        function copyToClipboard() {
+            const text = '+966530893127';
+            navigator.clipboard.writeText(text).then(() => {
+                alert('تم نسخ الرقم بنجاح!');
+            });
+        }
+        // Create Confetti
+        function createConfetti() {
+            const container = document.getElementById('confetti-container');
+            const colors = ['#fbbf24', '#ef4444', '#10b981', '#3b82f6', '#8b5cf6'];
+            for (let i = 0; i < 50; i++) {
+                const confetti = document.createElement('div');
+                confetti.className = 'confetti';
+                confetti.style.left = Math.random() * 100 + 'vw';
+                confetti.style.backgroundColor = colors[Math.floor(Math.random() * colors.length)];
+                confetti.style.animationDelay = Math.random() * 3 + 's';
+                container.appendChild(confetti);
+                setTimeout(() => confetti.remove(), 3000);
+            }
+        }
+        // Create confetti every 3 seconds
+        setInterval(createConfetti, 3000);
+        createConfetti();
+        // Add floating animation to button on hover
+        document.querySelector('.whatsapp-button').addEventListener('mouseenter', function() {
+            this.classList.add('float-animation');
+        });
+        document.querySelector('.whatsapp-button').addEventListener('mouseleave', function() {
+            this.classList.remove('float-animation');
+        });
+    </script>
+</body>
 </html>

prompts.txt ADDED Viewed

	@@ -0,0 +1,25 @@

+صفحة أولى دبلومات غرفة الزلفي بعرض اليوم الوطني فقط
+ للاستفادة من العرض:  أرسل على الواتساب: سجل الأن زر متحرك
+‏https://scan.page/u0GcAf
+اذكر البيانات التالية:
+• الاسم: ريان بن خالد
+وبإذن اللّٰه يوصلك الخصم.
+العرض لفترة محدودة فقط
+صفحة أولى دبلومات غرفة الزلفي بعرض اليوم الوطني فقط
+ للاستفادة من العرض:  أرسل على الواتساب: سجل الأن زر متحرك
+‏https://scan.page/u0GcAf
+اذكر البيانات التالية:
+• الاسم: ريان بن خالد
+وبإذن اللّٰه يوصلك الخصم.
+العرض لفترة محدودة فقط
+صفحة أولى دبلومات غرفة الزلفي بعرض اليوم الوطني فقط
+ للاستفادة من العرض:  أرسل على الواتساب: سجل الأن زر متحرك
+‏https://scan.page/u0GcAf
+اذكر البيانات التالية:
+• الاسم: ريان بن خالد
+وبإذن اللّٰه يوصلك الخصم.
+العرض لفترة محدودة فقط
+زر واتساب https://scan.page/u0GcAf
+زر الواتساب في الرابط https://scan.page/u0GcAf
++966 53 089 3127
+أضف زر +966 53 089 3127 بعدها الواتساب