Rayan545454/r444rrr at 0a87fb734dc238bc961902e4e59adff9a703d831

Ctrl+K

1 contributor

‏ ‏<!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> ‏ <style> * { ‏ margin: 0; ‏ padding: 0; ‏ box-sizing: border-box; } ‏ body { ‏ background: linear-gradient(135deg, #ffc0cb, #ff9eb0); ‏ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; ‏ min-height: 100vh; ‏ display: flex; ‏ align-items: center; ‏ justify-content: center; ‏ text-align: center; ‏ color: #333; } ‏ .container { ‏ background: white; ‏ padding: 40px; ‏ border-radius: 20px; ‏ box-shadow: 0 10px 30px rgba(0,0,0,0.1); ‏ width: 90%; ‏ max-width: 500px; ‏ transform: translateY(0); ‏ animation: float 3s ease-in-out infinite; } ‏ @keyframes float { ‏ 0%, 100% { transform: translateY(0); } ‏ 50% { transform: translateY(-10px); } } ‏ h1 { ‏ color: #e91e63; ‏ margin-bottom: 15px; ‏ font-size: 2.2em; } ‏ p { ‏ font-size: 1.2em; ‏ color: #555; ‏ margin: 15px 0; } ‏ .price { ‏ font-size: 1.8em; ‏ font-weight: bold; ‏ color: #e91e63; } ‏ img { ‏ width: 180px; ‏ margin: 20px 0; ‏ border-radius: 15px; ‏ box-shadow: 0 5px 15px rgba(0,0,0,0.1); } ‏ button { ‏ background: #e91e63; ‏ color: white; ‏ border: none; ‏ padding: 15px 40px; ‏ font-size: 1.2em; ‏ border-radius: 50px; ‏ cursor: pointer; ‏ margin-top: 20px; ‏ transition: 0.3s; ‏ box-shadow: 0 5px 15px rgba(233, 30, 99, 0.3); } ‏ button:hover { ‏ background: #c2185b; ‏ transform: scale(1.05); } ‏ </style> ‏</head> ‏<body> ‏ <div class="container"> ‏ <h1>حقيبة يد أنيقة</h1> ‏ <p>مصنوعة من الجلد الطبيعي، تصميم عصري ومساحة واسعة</p> ‏ <div class="price">199 درهم</div> ‏ <img src="https://images.unsplash.com/photo-1585334865750-77f9ecaa06cf?ixlib=rb-4.0.3&auto=format&fit=crop&w=500&q=80" alt="حقيبة يد"> ‏ <br> ‏ <a href="page2.html" style="text-decoration: none;"> ‏ <button>الشراء الآن</button> ‏ </a> ‏ </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> ‏ <style> * { ‏ margin: 0; ‏ padding: 0; ‏ box-sizing: border-box; } ‏ body { ‏ background: white; ‏ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; ‏ min-height: 100vh; ‏ display: flex; ‏ align-items: center; ‏ justify-content: center; ‏ text-align: center; ‏ color: #333; } ‏ .container { ‏ padding: 50px; ‏ border-radius: 20px; ‏ box-shadow: 0 10px 30px rgba(0,0,0,0.1); ‏ width: 90%; ‏ max-width: 500px; ‏ background: #f9f9f9; } ‏ h2 { ‏ color: #333; ‏ margin-bottom: 25px; ‏ font-size: 2em; } ‏ .form-group { ‏ margin-bottom: 20px; ‏ text-align: right; } ‏ .form-group label { ‏ display: block; ‏ margin-bottom: 8px; ‏ font-weight: bold; ‏ color: #555; } ‏ .form-group input { ‏ width: 100%; ‏ padding: 14px; ‏ border: 2px solid #e0e0e0; ‏ border-radius: 12px; ‏ font-size: 1em; ‏ transition: border 0.3s; } ‏ .form-group input:focus { ‏ border-color: #e91e63; ‏ outline: none; } ‏ button { ‏ background: #4caf50; ‏ color: white; ‏ border: none; ‏ padding: 15px 40px; ‏ font-size: 1.2em; ‏ border-radius: 50px; ‏ cursor: pointer; ‏ margin-top: 20px; ‏ transition: 0.3s; } ‏ button:hover { ‏ background: #388e3c; ‏ transform: scale(1.05); } ‏ </style> ‏</head> ‏<body> ‏ <div class="container"> ‏ <h2>أكمل بياناتك</h2> ‏ <form action="page3.html" method="get"> ‏ <div class="form-group"> ‏ <label>الاسم الكامل</label> ‏ <input type="text" name="name" placeholder="أدخل اسمك" required /> ‏ </div> ‏ <div class="form-group"> ‏ <label>البريد الإلكتروني</label> ‏ <input type="email" name="email" placeholder="[email protected]" required /> ‏ </div> ‏ <div class="form-group"> ‏ <label>رقم الجوال</label> ‏ <input type="tel" name="phone" placeholder="+971501234567" required /> ‏ </div> ‏ <div class="form-group"> ‏ <label>العنوان</label> ‏ <input type="text" name="address" placeholder="الشارقة، الإمارات" required /> ‏ </div> ‏ <button type="submit">المتابعة إلى الدفع</button> ‏ </form> ‏ </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> ‏ <style> * { ‏ margin: 0; ‏ padding: 0; ‏ box-sizing: border-box; } ‏ body { ‏ background: linear-gradient(135deg, #ff4d4d, #cc0000); ‏ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; ‏ min-height: 100vh; ‏ display: flex; ‏ align-items: center; ‏ justify-content: center; ‏ text-align: center; ‏ color: white; } ‏ .container { ‏ background: rgba(255, 255, 255, 0.2); ‏ backdrop-filter: blur(10px); ‏ padding: 50px; ‏ border-radius: 20px; ‏ box-shadow: 0 10px 30px rgba(0,0,0,0.2); ‏ width: 90%; ‏ max-width: 500px; ‏ border: 1px solid rgba(255, 255, 255, 0.3); } ‏ h2 { ‏ font-size: 2.2em; ‏ margin-bottom: 20px; } ‏ .details { ‏ background: rgba(255, 255, 255, 0.1); ‏ padding: 20px; ‏ border-radius: 15px; ‏ margin: 20px 0; ‏ text-align: right; } ‏ .details p { ‏ font-size: 1.2em; ‏ margin: 10px 0; } ‏ button { ‏ background: white; ‏ color: #ff4d4d; ‏ border: none; ‏ padding: 16px 50px; ‏ font-size: 1.3em; ‏ border-radius: 50px; ‏ cursor: pointer; ‏ margin-top: 20px; ‏ font-weight: bold; ‏ transition: 0.3s; } ‏ button:hover { ‏ background: #e0e0e0; ‏ transform: scale(1.1); } ‏ .icon { ‏ font-size: 3em; ‏ margin-bottom: 20px; } ‏ </style> ‏</head> ‏<body> ‏ <div class="container"> ‏ <div class="icon">💳</div> ‏ <h2>أتمم الدفع</h2> ‏ <div class="details"> ‏ <p><strong>المنتج:</strong> حقيبة يد أنيقة</p> ‏ <p><strong>السعر:</strong> 199 درهم</p> ‏ <p><strong>الشحن:</strong> مجاني</p> ‏ </div> ‏ <button onclick="alert('✅ تم الدفع بنجاح!\nسيتم توصيل طلبك خلال 2-3 أيام.');">ادفع الآن</button> ‏ <p style="margin-top: 20px; font-size: 0.9em; opacity: 0.8;"> نقبل: Visa, MasterCard, Apple Pay ‏ </p> ‏ </div> ‏</body> ‏</html> - Initial Deployment

0a87fb7 verified 3 days ago