custom1/login.html

187 lines
12 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="page-wrapper">
<div class="nav-1-wrapper"><nav class="nav-1-navbar"><div class="nav-1-logo">Radiance Jewels</div><ul class="nav-1-nav-links"><li><a href="index.html">Home</a></li><li><a href="product_catalog.html">Product Catalog</a></li><li><a href="shopping_cart.html">Shopping Cart</a></li><li><a href="checkout.html">Checkout</a></li><li><a href="login.html">Login</a></li><li><a href="dashboard.html">Dashboard</a></li><li><a href="order_history.html">Order History</a></li><li><a href="user_profile.html">User Profile</a></li><li><a href="sign_up.html">Sign Up</a></li></ul><div class="nav-1-nav-actions"><button class="nav-1-btn nav-1-outline">Sign Up</button><button class="nav-1-btn nav-1-solid">Login</button></div></nav></div>
<section class="login-section">
<div class="login-container">
<h2>Login to Your Account</h2>
<form class="login-form" action="#" method="POST">
<div class="form-group">
<label for="email">Email Address</label>
<input type="email" id="email" name="email" placeholder="your.email@example.com" required="" aria-label="Enter your email address">
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" id="password" name="password" placeholder="••••••••" required="" aria-label="Enter your password">
</div>
<button type="submit" class="login-button">Login</button>
<div class="form-options">
<a href="#" class="forgot-password-link">Forgot Password?</a>
<span class="separator"></span>
<a href="#" class="register-now-link">Don't have an account? Register here.</a>
</div>
</form>
</div>
</section>
<div class="forgot-password-wrapper">
<div class="forgot-password-container">
<h2 class="forgot-password-title">Forgot Your Password?</h2>
<p class="forgot-password-description">
Enter your email address below and we'll send you a link to reset it.
</p>
<form class="forgot-password-form" action="#" method="POST">
<div class="form-group">
<label for="email" class="form-label">Email Address</label>
<input type="email" id="email" name="email" class="form-input" placeholder="your.email@example.com" required="">
</div>
<button type="submit" class="btn btn-primary">Send Reset Link</button>
</form>
<div class="forgot-password-actions">
<a href="/login" class="back-to-login-link">Back to Login</a>
</div>
</div>
</div>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Social Login Options</title>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="style.css" />
<section class="social-login-section" aria-labelledby="socialLoginHeading">
<h2 id="socialLoginHeading">Or Login With</h2>
<div class="social-login-options">
<a href="#" class="social-login-button google" aria-label="Login with Google">
<span class="icon" aria-hidden="true"><i class="fab fa-google"></i></span>
<span>Continue with Google</span>
</a>
<a href="#" class="social-login-button facebook" aria-label="Login with Facebook">
<span class="icon" aria-hidden="true"><i class="fab fa-facebook-f"></i></span>
<span>Continue with Facebook</span>
</a>
<a href="#" class="social-login-button apple" aria-label="Login with Apple">
<span class="icon" aria-hidden="true"><i class="fab fa-apple"></i></span>
<span>Continue with Apple</span>
</a>
</div>
<div class="social-login-separator" aria-hidden="true">
<!-- This div is for visual separation, no meaningful content for screen readers -->
</div>
<!-- Placeholder for traditional login form, if applicable in same context -->
<p style="font-size: 0.9em; color: #555; margin-top: 20px;">
<a href="#" style="color: #007bff; text-decoration: none;">Forgot password?</a> |
<a href="#" style="color: #007bff; text-decoration: none;">Create an account</a>
</p>
</section>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to Our Store</title>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="style.css" />
<main class="container">
<section class="new-user-prompt" aria-labelledby="welcome-heading">
<h1 id="welcome-heading">Welcome to Our Exquisite Collection!</h1>
<p>
We're thrilled to have you join us. Explore our meticulously crafted jewelry, discover your next treasure, and enjoy a seamless shopping experience tailored just for you.
</p>
<div class="prompt-actions">
<a href="/catalog" class="prompt-action-button prompt-action-button--primary">
Start Shopping Now
</a>
<a href="/user-dashboard" class="prompt-action-button prompt-action-button--secondary">
Go to My Dashboard
</a>
</div>
<ul class="feature-list" aria-label="What you can do">
<li>View our stunning catalog of rings, necklaces, bangles, and earrings.</li>
<li>Securely place orders for your favorite items.</li>
<li>Track your order history and manage your profile in the user dashboard.</li>
<li>Add items to your personalized shopping cart.</li>
</ul>
</section>
</main>
<section class="security-disclaimer">
<div class="container">
<h2 class="section-title">Security Disclaimer</h2>
<p class="disclaimer-text">
At [Your Jewelry Store Name], we are committed to ensuring the highest level of security for your personal information and transactions. This section outlines our approach to security and your role in maintaining a secure online experience.
</p>
<div class="disclaimer-item">
<h3 class="section-subtitle">Data Encryption</h3>
<p class="disclaimer-text">
All sensitive data transmitted between your browser and our servers, including personal details and payment information, is protected using industry-standard SSL/TLS encryption. This ensures that your data remains private and secure during transit.
</p>
</div>
<div class="disclaimer-item">
<h3 class="section-subtitle">Secure Transactions</h3>
<p class="disclaimer-text">
Payment processing is handled by reputable third-party payment gateways compliant with PCI DSS standards. We do not store your full credit card details on our servers. All transactions are processed through secure, encrypted channels.
</p>
</div>
<div class="disclaimer-item">
<h3 class="section-subtitle">User Responsibility</h3>
<p class="disclaimer-text">
While we take extensive measures to protect your data, your cooperation is crucial. Please ensure:
</p>
<ul class="disclaimer-list">
<li>You use a strong, unique password for your account.</li>
<li>You keep your login credentials confidential and do not share them.</li>
<li>You log out of your account after each session, especially on shared computers.</li>
<li>Your device is protected with up-to-date antivirus software and a firewall.</li>
<li>You are wary of phishing attempts and suspicious emails requesting your login information.</li>
</ul>
</div>
<div class="disclaimer-item">
<h3 class="section-subtitle">Disclaimer of Liability</h3>
<p class="disclaimer-text">
[Your Jewelry Store Name] strives to maintain a secure environment, but acknowledges that no data transmission over the internet or method of electronic storage is 100% secure. Therefore, while we employ commercially acceptable means to protect your personal information, we cannot guarantee its absolute security. In the event of an unauthorized access, disclosure, or loss of information, we will take reasonable steps to mitigate the impact and comply with applicable laws.
</p>
</div>
<div class="disclaimer-item">
<h3 class="section-subtitle">Changes to this Policy</h3>
<p class="disclaimer-text">
This Security Disclaimer may be updated periodically to reflect changes in our security practices or legal requirements. We encourage you to review this section regularly. Your continued use of our services after any changes indicates your acceptance of the updated disclaimer.
</p>
</div>
<p class="disclaimer-text disclaimer-note">
For any security concerns or questions, please contact our support team.
</p>
</div>
</section>
<div class="footer-1-wrapper"><section class="footer-1-section"><div class="footer-1-top"><div class="footer-1-brand"><h3 class="footer-1-logo">Gleam Jewels</h3><p class="footer-1-newsletter-text">Unlock exclusive sparkle! Join our newsletter for dazzling new arrivals, special offers, and styling tips.</p><div class="footer-1-newsletter-form"><input type="email" placeholder="Your email address"><button class="footer-1-subscribe-btn">Shine With Us</button></div><p class="footer-1-privacy-note"><span>By subscribing you agree to with our </span><a href="#">Privacy Policy</a><span> and provide consent to receive updates from our company.</span></p></div><div class="footer-1-columns"><div class="footer-1-column"><h4>Explore</h4><ul><li><a href="rings.html">Rings</a></li><li><a href="necklaces.html">Necklaces</a></li><li><a href="bangles.html">Bangles</a></li><li><a href="earrings.html">Earrings</a></li><li><a href="new_arrivals.html">New Arrivals</a></li></ul></div><div class="footer-1-column"><h4>Support</h4><ul><li><a href="about_us.html">About Us</a></li><li><a href="contact_us.html">Contact Us</a></li><li><a href="faq.html">FAQ</a></li><li><a href="shipping_returns.html">Shipping &amp; Returns</a></li><li><a href="customer_dashboard.html">Customer Dashboard</a></li></ul></div><div class="footer-1-column footer-1-social"><h4>Follow us</h4><ul><li><i class="fab fa-facebook"></i><span>Facebook</span></li><li><i class="fab fa-instagram"></i><span>Instagram</span></li><li><i class="fab fa-x-twitter"></i><span>X</span></li><li><i class="fab fa-linkedin"></i><span>LinkedIn</span></li><li><i class="fab fa-youtube"></i><span>Youtube</span></li></ul></div></div></div><div class="footer-1-bottom"><p>© 2025 Gleam Jewels. All rights reserved.</p><ul class="footer-1-links"><li><a href="product_detail.html">Product Detail</a></li><li><a href="order_confirmation.html">Order Confirmation</a></li><li><a href="admin_login.html">Admin Login</a></li><li><a href="admin_dashboard.html">Admin Dashboard</a></li><li><a href="admin_product_management.html">Admin Product Management</a></li><li><a href="admin_add_product.html">Admin Add Product</a></li><li><a href="admin_edit_product.html">Admin Edit Product</a></li><li><a href="admin_order_management.html">Admin Order Management</a></li><li><a href="admin_user_management.html">Admin User Management</a></li></ul></div></section></div>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Social Login Options</title>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="style.css" />
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to Our Store</title>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="style.css" />
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
document.body.style.display = 'none';
setTimeout(function() { document.body.style.display = ''; }, 10);
});
</script>
</body>
</html>