signup button

dohinaf · Nov 14, 2024 · 148bc96 · 148bc96
1 parent a770d31
commit 148bc96
Show file tree

Hide file tree

Showing 2 changed files with 94 additions and 4 deletions.
diff --git a/index.html b/index.html
@@ -328,7 +328,7 @@ <h1 class="site-title">ArcticDelights</h1>
 <a href="offers.html">Offers</a>
 <a href="#review-section">Review</a>
 <a href="blog.html">Blogs</a>
-<a href="contact.html">Contact Us</a>
+<a href="./contact.html">Contact Us</a>
 <a href="privacy.html">Privacy Policy</a>
 <a href="#" id="my-order-btn">My Orders</a>
 </nav>

diff --git a/signup/signup.html b/signup/signup.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!-- <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
@@ -8,8 +8,8 @@
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
 </head>
 <body>
-    <!-- preloader -->
-    <div id="preloader">
+    preloader -->
+    <!-- <div id="preloader">
         <div class="wrapper">
             <div class="box-wrap">
                 <div class="box one"></div>
@@ -94,5 +94,95 @@ <h2>Create an Account</h2>
     </script>
     <script src="signup.js"></script>
 </body>
+</html> --> 
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Signup Page</title>
+    <link rel="stylesheet" href="signup.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
+</head>
+<body>
+    <!-- preloader -->
+    <div id="preloader">
+        <div class="wrapper">
+            <div class="box-wrap">
+                <div class="box one"></div>
+                <div class="box two"></div>
+                <div class="box three"></div>
+                <div class="box four"></div>
+                <div class="box five"></div>
+                <div class="box six"></div>
+            </div>
+        </div>
+    </div>
+    <div class="signup-container">
+        <div id="signup-box" class="signup-box">
+            <h2>Create an Account</h2>
+            <form action="../profile.html" method="GET" class="signup-form" id="signup-form">
+                <div class="input-group">
+                    <input type="text" name="username" required>
+                    <label for="username">Username</label>
+                </div>
+                <div class="input-group">
+                    <i class="fas fa-envelope"></i>
+                    <input type="email" id="email" name="email" required>
+                    <label for="email">Email</label>
+                </div>
+                <div class="input-group">
+                    <i class="fas fa-lock"></i>
+                    <input type="password" id="password" name="password" required>
+                    <label for="password">Password</label>
+                    <span class="toggle-password" onclick="togglePasswordVisibility()">
+                        <i class="fas fa-eye" id="eye-icon"></i>
+                    </span>
+                </div>
+                <button class="signup-btn" type="submit">Sign Up</button>
+                <div class="extra-links">
+                    <button class="home-btn"><i class="fas fa-home"></i><a href="../index.html">Home</a></button>
+                    <button class="login-btn"><i class="fas fa-sign-in-alt"></i><a href="../login/login.html">Login</a></button>
+                </div>
+            </form>
+        </div>
+    </div>
+
+    <script src="../preloader.js"></script>
+    <script>
+        // Trusted email domains
+        const trustedDomains = ["gmail.com", "outlook.com", "yahoo.com", "hotmail.com", "protonmail.com", "icloud.com", "tutanota.com"];
+
+        document.getElementById('signup-form').addEventListener('submit', function(event) {
+            const emailInput = document.getElementById('email');
+            const email = emailInput.value.trim();
+            const emailDomain = email.substring(email.lastIndexOf('@') + 1);
+
+            if (!trustedDomains.includes(emailDomain)) {
+                event.preventDefault(); // Prevent form submission
+                alert('Please use a valid email address from a trusted provider (e.g., Gmail, Outlook, Yahoo).');
+                emailInput.focus(); // Focus on the email input
+            }
+        });
+
+        function togglePasswordVisibility() {
+            const passwordInput = document.getElementById('password');
+            const eyeIcon = document.getElementById('eye-icon');
+
+            if (passwordInput.type === 'password') {
+                passwordInput.type = 'text';
+                eyeIcon.classList.remove('fa-eye');
+                eyeIcon.classList.add('fa-eye-slash');
+            } else {
+                passwordInput.type = 'password';
+                eyeIcon.classList.remove('fa-eye-slash');
+                eyeIcon.classList.add('fa-eye');
+            }
+        }
+    </script>
+    <script src="signup.js"></script>
+</body>
 </html>
 
+