custom1/login.html

151 lines
10 KiB
HTML

SafeValue must use [property]=binding:
<!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">EventVerse</div><ul class="nav-1-nav-links"><li><a href="home.html">Platform Home</a></li><li><a href="about.html">Our Vision</a></li><li><a href="contact.html">Get In Touch</a></li><li><a href="services.html">Solutions</a></li><li><a href="faq.html">Help Center</a></li><li class="nav-1-dropdown"><a href="#">Resources<i class="fas fa-chevron-down"><i class="fas fa-chevron-down">🔽</i></i></a></li></ul><div class="nav-1-nav-actions"><button class="nav-1-btn nav-1-outline">Attend Event</button><button class="nav-1-btn nav-1-solid">Host an Event</button></div></nav></div>
<div class="app-form"><h1>Join Our Vision: Your Application</h1><h2>Your Identity in Innovation</h2><div class="form-row"><div class="form-group"><label>First Name</label><input id="first-name" type="text" placeholder="Enter your first name"></input></div><div class="form-group"><label>Last Name</label><input id="last-name" type="text" placeholder="Enter your last name"></input></div></div><div class="form-group full-width"><label>Professional Email</label><input id="email" type="email" placeholder="e.g., yourname@example.com"></input></div><h2>Connecting with You</h2><div class="form-group full-width"><label>Your Best Contact Number</label><input id="phone" type="tel" placeholder="e.g., (123) 456-7890"></input></div><h2>Share Your Passion</h2><div class="form-group full-width"><textarea id="cover-letter" placeholder="Tell us what drives you to innovate in virtual events and how you envision contributing to our dynamic platform. Share your unique perspective!"></textarea></div><button type="submit">Submit Your Visionary Application</button></div>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Forgot Password</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="forgot-password-container" role="region" aria-labelledby="forgotPasswordHeading">
<header>
<h1 id="forgotPasswordHeading">Forgot Your Password?</h1>
<p>Enter your email address below and we'll send you a link to reset your password.</p>
</header>
<form action="/reset-password" method="POST">
<div class="form-group">
<label for="email">Email Address</label>
<input type="email" id="email" name="email" placeholder="e.g., your.email@example.com" required autocomplete="email">
</div>
<button type="submit" class="submit-button">Send Reset Link</button>
</form>
<a href="/login" class="back-to-login">Back to Login</a>
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Call to Action Section</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css" />
</head>
<body>
<section class="cta-section" aria-labelledby="cta-heading">
<div class="cta-container">
<div class="cta-content">
<h2 id="cta-heading" class="cta-heading">
Ready to Host Your Next Unforgettable Virtual Event?
</h2>
<p class="cta-description">
Join leading organizers who are transforming their events with immersive virtual experiences, interactive networking, and seamless streaming.
</p>
</div>
<div class="cta-button-wrapper">
<a href="#register" class="cta-button">
Register Your Interest Today
</a>
</div>
</div>
</section>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Guest Access Section</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="container">
<section class="guest-access-section" aria-labelledby="guestAccessHeading">
<header class="guest-access-section__header">
<h2 id="guestAccessHeading">Join as a Guest or Log In</h2>
<p>Access the event quickly and easily. Choose how you'd like to enter the virtual conference platform.</p>
</header>
<div class="guest-access-section__actions">
<button type="button" class="guest-access-section__button guest-access-section__button--primary">
Join Event as a Guest
</button>
<a href="#login" class="guest-access-section__link guest-access-section__link--secondary">
Already have an account? Log In
</a>
</div>
<p class="guest-access-section__info">
By joining, you agree to our <a href="#terms">Terms of Service</a> and <a href="#privacy">Privacy Policy</a>.
Guest access may have limited features.
</p>
</section>
</div>
</body>
</html>
<section id="security-message">
<div class="security-content-wrapper">
<h2 class="section-title">Your Security, Our Priority</h2>
<p class="section-description">At [Platform Name], we are committed to providing a secure and private environment for all your virtual conferences, live events, and networking. Our platform is engineered with robust measures to protect your data and interactions.</p>
<div class="security-features-grid">
<div class="feature-item">
<h3 class="feature-title">End-to-End Encryption</h3>
<p class="feature-description">All video streams, chat messages, and shared files are encrypted using industry-leading standards, protecting your communications from interception.</p>
</div>
<div class="feature-item">
<h3 class="feature-title">Granular Privacy Controls</h3>
<p class="feature-description">You have full control over your profile visibility, data sharing preferences, and interaction settings within breakout rooms and networking sessions.</p>
</div>
<div class="feature-item">
<h3 class="feature-title">Robust Data Protection</h3>
<p class="feature-description">Your personal information and event data are stored on secure servers with continuous monitoring and strict access protocols, compliant with global regulations.</p>
</div>
<div class="feature-item">
<h3 class="feature-title">Secure Authentication</h3>
<p class="feature-description">Implement multi-factor authentication (MFA) and strong password policies to safeguard your account from unauthorized access.</p>
</div>
<div class="feature-item">
<h3 class="feature-title">Regular Security Audits</h3>
<p class="feature-description">Our platform undergoes routine security assessments and penetration testing by independent experts to identify and address potential vulnerabilities.</p>
</div>
<div class="feature-item">
<h3 class="feature-title">Compliance & Trust</h3>
<p class="feature-description">We adhere to key data privacy regulations like GDPR, CCPA, and more, ensuring transparency and trust in how your data is managed.</p>
</div>
</div>
<div class="security-cta">
<p class="cta-text">Have questions or want to learn more about our commitment to your security?</p>
<a href="#security-policy" class="cta-button">View Full Security Policy</a>
</div>
</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">EventSphere</h3><p class="footer-1-newsletter-text">Stay connected with EventSphere! Join our newsletter for the latest features, event tips, and platform updates.</p><div class="footer-1-newsletter-form"><input type="email" placeholder="Enter your email"></input><button class="footer-1-subscribe-btn">Get Updates</button></div><p class="footer-1-privacy-note"><span>By subscribing, you agree to EventSphere's </span><a href="#">Privacy Policy</a><span> and provide consent to receive insightful updates and offers.</span></p></div><div class="footer-1-columns"><div class="footer-1-column"><h4>Platform</h4><ul><li><a href="#">Virtual Conferences</a></li><li><a href="#">Breakout Rooms</a></li><li><a href="#">Live Streaming</a></li><li><a href="#">Networking Tools</a></li><li><a href="#">Spatial Audio</a></li></ul></div><div class="footer-1-column"><h4>Solutions</h4><ul><li><a href="#">Enterprise Events</a></li><li><a href="#">Educational Webinars</a></li><li><a href="#">Product Launches</a></li><li><a href="#">Event Hosting Guide</a></li><li><a href="#">API & Integrations</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>© 2024 EventSphere. All rights reserved.</p><ul class="footer-1-links"><li><a href="#">Privacy Policy</a></li><li><a href="#">Terms of Service</a></li><li><a href="#">Cookies Settings</a></li></ul></div></section></div>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
document.body.style.display = 'none';
setTimeout(function() { document.body.style.display = ''; }, 10);
});
</script>
</body>
</html> (see https://g.co/ng/security#xss)