Created
February 28, 2026 04:01
-
-
Save serajmoner20041-ai/4d85a79cc913bcdec1c22a1fd3609cdf to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| html> | |
| <html lang="ar" dir="rtl"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>سراج ستور | Seraj Store</title> | |
| <style> | |
| :root { | |
| --primary-color: #0d1b3e; /* اللون الكحلي من اللوجو */ | |
| --accent-color: #c5a059; /* اللون الذهبي من اللوجو */ | |
| --whatsapp-green: #25D366; /* لون واتساب الرسمي */ | |
| --light-bg: #fdfdfd; | |
| } | |
| body { | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| margin: 0; | |
| background-color: var(--light-bg); | |
| padding-bottom: 50px; | |
| } | |
| header { | |
| background-color: white; | |
| padding: 15px 5%; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| border-bottom: 3px solid var(--accent-color); | |
| box-shadow: 0 2px 10px rgba(0,0,0,0.05); | |
| } | |
| .logo-img { | |
| max-height: 100px; | |
| width: auto; | |
| } | |
| .hero { | |
| background: linear-gradient(rgba(13, 27, 62, 0.9), rgba(13, 27, 62, 0.9)), url('https://images.unsplash.com/photo-1614850523296-d8c1af93d400?auto=format&fit=crop&w=1350&q=80'); | |
| background-size: cover; | |
| color: white; | |
| text-align: center; | |
| padding: 80px 20px; | |
| } | |
| .hero h1 { font-size: 2.5rem; margin-bottom: 10px; } | |
| .btn { | |
| background-color: var(--accent-color); | |
| color: white; | |
| padding: 15px 35px; | |
| text-decoration: none; | |
| border-radius: 30px; | |
| font-weight: bold; | |
| display: inline-block; | |
| transition: 0.3s; | |
| } | |
| .btn:hover { transform: scale(1.05); background-color: #b38f48; } | |
| /* تنسيق زر واتساب العائم */ | |
| .whatsapp-float { | |
| position: fixed; | |
| width: 60px; | |
| height: 60px; | |
| bottom: 30px; | |
| left: 30px; /* جهة اليسار لأن المتصفح بالعربي */ | |
| background-color: var(--whatsapp-green); | |
| color: #FFF; | |
| border-radius: 50px; | |
| text-align: center; | |
| font-size: 30px; | |
| box-shadow: 2px 2px 10px rgba(0,0,0,0.2); | |
| z-index: 1000; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| text-decoration: none; | |
| transition: 0.3s; | |
| } | |
| .whatsapp-float:hover { | |
| transform: scale(1.1); | |
| background-color: #128C7E; | |
| } | |
| footer { | |
| text-align: center; | |
| padding: 20px; | |
| background: var(--primary-color); | |
| color: white; | |
| font-size: 0.9rem; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <header> | |
| <img src="https://ibb.co/d4NMshtd" alt="سراج ستور" class="logo-img"> | |
| </header> | |
| <section class="hero"> | |
| <h1>سراج ستور للحلول الرقمية</h1> | |
| <p>نقدم لك أفضل المنتجات الرقمية بجودة عالمية وسعر منافس.</p> | |
| <br> | |
| <a href="https://wa.me/+218915733213" class="btn">اطلب منتجك الآن</a> | |
| </section> | |
| <a href="https://wa.me/+218915733213text=مرحباً سراج ستور، أريد الاستفسار عن المنتجات الرقمية" class="whatsapp-float" target="_blank"> | |
| <svg width="35" height="35" fill="currentColor" viewBox="0 0 16 16"> | |
| <path d="M13.601 2.326A7.854 7.854 0 0 0 7.994 0C3.627 0 .068 3.558.064 7.926c0 1.399.366 2.76 1.057 3.965L0 16l4.204-1.102a7.933 7.933 0 0 0 3.79.965h.004c4.368 0 7.926-3.558 7.93-7.93A7.898 7.898 0 0 0 13.6 2.326zM7.994 14.521a6.573 6.573 0 0 1-3.356-.92l-.24-.144-2.494.654.666-2.433-.156-.251a6.56 6.56 0 0 1-1.007-3.505c0-3.626 2.957-6.584 6.591-6.584a6.56 6.56 0 0 1 4.66 1.931 6.557 6.557 0 0 1 1.928 4.66c-.004 3.639-2.961 6.592-6.592 6.592zm3.615-4.934c-.197-.099-1.17-.578-1.353-.646-.182-.065-.315-.099-.445.099-.133.197-.513.646-.627.775-.114.133-.232.148-.43.05-.197-.1-.836-.308-1.592-.985-.59-.525-.985-1.175-1.103-1.372-.114-.198-.011-.304.088-.403.087-.088.197-.232.296-.346.1-.114.133-.198.198-.33.065-.134.034-.248-.015-.347-.05-.099-.445-1.076-.612-1.47-.16-.389-.323-.335-.445-.34-.114-.007-.247-.007-.38-.007a.729.729 0 0 0-.529.247c-.182.198-.691.677-.691 1.654 0 .977.71 1.916.81 2.049.098.133 1.394 2.132 3.383 2.992.47.205.84.326 1.129.418.475.152.904.129 1.246.08.38-.058 1.171-.48 1.338-.943.164-.464.164-.86.114-.943-.049-.084-.182-.133-.38-.232z"/> | |
| </svg> | |
| </a> | |
| <footer> | |
| <p>© 2026 سراج ستور - Seraj Store</p> | |
| </footer> | |
| </body> | |
| </html> | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| html> | |
| <html lang="ar" dir="rtl"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>سراج ستور | Seraj Store</title> | |
| <style> | |
| :root { | |
| --primary-color: #0d1b3e; /* اللون الكحلي من اللوجو */ | |
| --accent-color: #c5a059; /* اللون الذهبي من اللوجو */ | |
| --whatsapp-green: #25D366; /* لون واتساب الرسمي */ | |
| --light-bg: #fdfdfd; | |
| } | |
| body { | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| margin: 0; | |
| background-color: var(--light-bg); | |
| padding-bottom: 50px; | |
| } | |
| header { | |
| background-color: white; | |
| padding: 15px 5%; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| border-bottom: 3px solid var(--accent-color); | |
| box-shadow: 0 2px 10px rgba(0,0,0,0.05); | |
| } | |
| .logo-img { | |
| max-height: 100px; | |
| width: auto; | |
| } | |
| .hero { | |
| background: linear-gradient(rgba(13, 27, 62, 0.9), rgba(13, 27, 62, 0.9)), url('https://images.unsplash.com/photo-1614850523296-d8c1af93d400?auto=format&fit=crop&w=1350&q=80'); | |
| background-size: cover; | |
| color: white; | |
| text-align: center; | |
| padding: 80px 20px; | |
| } | |
| .hero h1 { font-size: 2.5rem; margin-bottom: 10px; } | |
| .btn { | |
| background-color: var(--accent-color); | |
| color: white; | |
| padding: 15px 35px; | |
| text-decoration: none; | |
| border-radius: 30px; | |
| font-weight: bold; | |
| display: inline-block; | |
| transition: 0.3s; | |
| } | |
| .btn:hover { transform: scale(1.05); background-color: #b38f48; } | |
| /* تنسيق زر واتساب العائم */ | |
| .whatsapp-float { | |
| position: fixed; | |
| width: 60px; | |
| height: 60px; | |
| bottom: 30px; | |
| left: 30px; /* جهة اليسار لأن المتصفح بالعربي */ | |
| background-color: var(--whatsapp-green); | |
| color: #FFF; | |
| border-radius: 50px; | |
| text-align: center; | |
| font-size: 30px; | |
| box-shadow: 2px 2px 10px rgba(0,0,0,0.2); | |
| z-index: 1000; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| text-decoration: none; | |
| transition: 0.3s; | |
| } | |
| .whatsapp-float:hover { | |
| transform: scale(1.1); | |
| background-color: #128C7E; | |
| } | |
| footer { | |
| text-align: center; | |
| padding: 20px; | |
| background: var(--primary-color); | |
| color: white; | |
| font-size: 0.9rem; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <header> | |
| <img src="https://ibb.co/d4NMshtd" alt="سراج ستور" class="logo-img"> | |
| </header> | |
| <section class="hero"> | |
| <h1>سراج ستور للحلول الرقمية</h1> | |
| <p>نقدم لك أفضل المنتجات الرقمية بجودة عالمية وسعر منافس.</p> | |
| <br> | |
| <a href="https://wa.me/+218915733213" class="btn">اطلب منتجك الآن</a> | |
| </section> | |
| <a href="https://wa.me/+218915733213text=مرحباً سراج ستور، أريد الاستفسار عن المنتجات الرقمية" class="whatsapp-float" target="_blank"> | |
| <svg width="35" height="35" fill="currentColor" viewBox="0 0 16 16"> | |
| <path d="M13.601 2.326A7.854 7.854 0 0 0 7.994 0C3.627 0 .068 3.558.064 7.926c0 1.399.366 2.76 1.057 3.965L0 16l4.204-1.102a7.933 7.933 0 0 0 3.79.965h.004c4.368 0 7.926-3.558 7.93-7.93A7.898 7.898 0 0 0 13.6 2.326zM7.994 14.521a6.573 6.573 0 0 1-3.356-.92l-.24-.144-2.494.654.666-2.433-.156-.251a6.56 6.56 0 0 1-1.007-3.505c0-3.626 2.957-6.584 6.591-6.584a6.56 6.56 0 0 1 4.66 1.931 6.557 6.557 0 0 1 1.928 4.66c-.004 3.639-2.961 6.592-6.592 6.592zm3.615-4.934c-.197-.099-1.17-.578-1.353-.646-.182-.065-.315-.099-.445.099-.133.197-.513.646-.627.775-.114.133-.232.148-.43.05-.197-.1-.836-.308-1.592-.985-.59-.525-.985-1.175-1.103-1.372-.114-.198-.011-.304.088-.403.087-.088.197-.232.296-.346.1-.114.133-.198.198-.33.065-.134.034-.248-.015-.347-.05-.099-.445-1.076-.612-1.47-.16-.389-.323-.335-.445-.34-.114-.007-.247-.007-.38-.007a.729.729 0 0 0-.529.247c-.182.198-.691.677-.691 1.654 0 .977.71 1.916.81 2.049.098.133 1.394 2.132 3.383 2.992.47.205.84.326 1.129.418.475.152.904.129 1.246.08.38-.058 1.171-.48 1.338-.943.164-.464.164-.86.114-.943-.049-.084-.182-.133-.38-.232z"/> | |
| </svg> | |
| </a> | |
| <footer> | |
| <p>© 2026 سراج ستور - Seraj Store</p> | |
| </footer> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment