Spaces:

Rayan545454
/

fffff444

Running

11.6 kB

Ctrl+K

1 contributor

<!DOCTYPE html> <html lang="ar"> <head> <meta charset="UTF-8"> <title>طبق الكباب والارز</title> <style> body { margin: 0; padding: 20px; display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #f5f5f5; font-family: Arial, sans-serif; } .image-container { text-align: center; } img { max-width: 100%; height: auto; border-radius: 10px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); } h1 { color: #333; margin-bottom: 10px; } </style> </head> <body> <div class="image-container"> <h1>طبق الكباب والارز</h1> <img src="https://i.imgur.com/9aXzYdK.jpg" alt="كباب دجاج مع أرز"> </div> </body> </html> <img src="رابط_الصورة_المباشر" alt="وصف الصورة"> - Follow Up Deployment

f1a8e54 verified 8 months ago

.gitattributes

1.52 kB
initial commit 8 months ago
README.md

212 Bytes
<!DOCTYPE html> <html lang="ar" dir="rtl"> <head> <meta charset="UTF-8"> <title>موقعي</title> <style> body, html { margin: 0; padding: 0; width: 100%; height: 100%; font-family: Arial, sans-serif; overflow: hidden; } .screen { width: 100%; height: 100%; position: fixed; display: flex; justify-content: center; align-items: center; font-size: 50px; font-weight: bold; z-index: 1000; transition: opacity 0.5s ease; } #yellow { background-color: yellow; color: black; } #red { background-color: red; color: white; } #x-screen { background-color: black; color: white; } #x-btn { font-size: 80px; cursor: pointer; } .content { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; font-size: 30px; background-color: #f0f0f0; color: #333; z-index: 1; position: relative; } </style> </head> <body>  <div id="yellow" class="screen">تحديث جديد!</div> <div id="red" class="screen" style="opacity: 0;">خصم 50%</div> <div id="x-screen" class="screen" style="opacity: 0;"> <div id="x-btn" onclick="closeIntro()">X</div> </div>  <div class="content" id="main-content" style="display: none;"> مرحباً في موقعك!<br> تم "بطيه" بنجاح ✅ </div> <script> // الانتقال من صفراء إلى حمراء setTimeout(() => { document.getElementById("yellow").style.opacity = "0"; setTimeout(() => { document.getElementById("red").style.opacity = "1"; }, 500); }, 2000); // من حمراء إلى X setTimeout(() => { document.getElementById("red").style.opacity = "0"; setTimeout(() => { document.getElementById("x-screen").style.opacity = "1"; }, 500); }, 4000); // عند الضغط على X: "بطيه" وإظهار المحتوى function closeIntro() { document.getElementById("x-screen").style.opacity = "0"; setTimeout(() => { document.querySelector('.screen').style.display = "none"; document.getElementById("main-content").style.display = "flex"; }, 500); } </script> </body> </html> - Initial Deployment 8 months ago
index.html

9.52 kB
<!DOCTYPE html> <html lang="ar"> <head> <meta charset="UTF-8"> <title>طبق الكباب والارز</title> <style> body { margin: 0; padding: 20px; display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #f5f5f5; font-family: Arial, sans-serif; } .image-container { text-align: center; } img { max-width: 100%; height: auto; border-radius: 10px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); } h1 { color: #333; margin-bottom: 10px; } </style> </head> <body> <div class="image-container"> <h1>طبق الكباب والارز</h1> <img src="https://i.imgur.com/9aXzYdK.jpg" alt="كباب دجاج مع أرز"> </div> </body> </html> <img src="رابط_الصورة_المباشر" alt="وصف الصورة"> - Follow Up Deployment 8 months ago
style.css

388 Bytes
initial commit 8 months ago