Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Sanctuary of Secrets - Sign Up</title> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <link href="https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&family=Cormorant:wght@300;400&display=swap" rel="stylesheet"> | |
| <link rel="stylesheet" href="signup-styles.css"> | |
| </head> | |
| <body> | |
| <div class="mystical-login-container"> | |
| <div class="magical-form-wrapper"> | |
| <div class="rune-border"></div> | |
| <form class="ancient-access-form"> | |
| <h1>Create Your Realm</h1> | |
| <div class="mystical-input-group"> | |
| <input type="text" placeholder="CHOSEN NAME" required> | |
| <input type="email" placeholder="MYSTICAL EMAIL" required> | |
| <div class="password-container"> | |
| <input type="password" placeholder="SACRED CIPHER" required> | |
| <button type="button" class="toggle-password" aria-label="Toggle password visibility"> | |
| <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="eye-icon"> | |
| <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path> | |
| <circle cx="12" cy="12" r="3"></circle> | |
| </svg> | |
| </button> | |
| </div> | |
| <div class="password-container"> | |
| <input type="password" placeholder="CONFIRM SACRED CIPHER" required> | |
| <button type="button" class="toggle-password" aria-label="Toggle password visibility"> | |
| <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="eye-icon"> | |
| <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path> | |
| <circle cx="12" cy="12" r="3"></circle> | |
| </svg> | |
| </button> | |
| </div> | |
| </div> | |
| <button type="submit" class="mystical-enter-btn">Forge Destiny</button> | |
| <div class="mystic-links"> | |
| <a href="signin.html" class="mystic-link">Already Initiated?</a> | |
| <a href="#" class="mystic-link">Need Guidance</a> | |
| </div> | |
| </form> | |
| </div> | |
| <div class="magical-background"></div> | |
| </div> | |
| <script src="signup.js"></script> | |
| </body> | |
| </html> |