steven
4d30803b60
Add static site, shared layout, and Node dev server with standard .gitignore. Co-authored-by: Cursor <cursoragent@cursor.com>
231 lines
15 KiB
HTML
231 lines
15 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
<meta name="description" content="Probably the most complete UI kit out there. Multiple functionalities and controls added, extended color palette and beautiful typography, designed as its own extended version of Bootstrap at the highest level of quality. ">
|
|
<meta name="author" content="Webpixels">
|
|
<title>user login Page</title>
|
|
<!-- Fonts -->
|
|
<!-- <link href="https://fonts.googleapis.com/css?family=Nunito:400,600,700,800|Roboto:400,500,700" rel="stylesheet"> -->
|
|
<link type="text/css" href="../assets/vendor/icon/iconfont.css" rel="stylesheet">
|
|
<link href="../assets/css/style.css" rel="stylesheet">
|
|
<!-- Theme CSS -->
|
|
<link type="text/css" href="../assets/css/theme.css" rel="stylesheet">
|
|
<!-- Demo CSS - No need to use these in your project -->
|
|
<!-- <link type="text/css" href="../assets/css/demo.css" rel="stylesheet"> -->
|
|
|
|
<link rel="stylesheet" href="../assets/css/login.css" rel="">
|
|
</head>
|
|
<body class="aifo-bg-primary">
|
|
|
|
<main class="main login-page d-flex align-items-center" id="login">
|
|
|
|
<div class="container">
|
|
<div class="container-fluid">
|
|
<div class="row main-row align-items-start justify-content-between">
|
|
<!-- Left Column: Login Card -->
|
|
<div class="col-lg-5 col-xl-4 left-block">
|
|
<div class="login-card card-base">
|
|
<div class="logo-container">
|
|
<a class="navbar-brand" href="../index.html">
|
|
<img src="../assets/images/brand/logo_1.svg" alt="" />
|
|
</a>
|
|
</div>
|
|
<h1 class="login-title" id="login-title">Log in to AIFO</h1>
|
|
<form id="login-form" class="needs-validation" novalidate>
|
|
<div class="form-group">
|
|
<label class="form-label" id="username-label">User name</label>
|
|
<input type="text" class="form-control" id="username" placeholder="Username / email address" required>
|
|
<div class="invalid-feedback">
|
|
Please enter an username or email address.
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="form-label" id="password-label">Password</label>
|
|
<div class="password-wrapper">
|
|
<input type="password" class="form-control" id="password" placeholder="Enter your password" required>
|
|
<button type="button" class="password-toggle" id="password-toggle" aria-label="Toggle password visibility">
|
|
<svg id="eye-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21" />
|
|
</svg>
|
|
</button>
|
|
<div class="invalid-feedback">
|
|
Please enter password.
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- <div class="error-message" id="password-error"><span class="error-icon">!</span> <span>Please enter your password.</span>
|
|
</div> -->
|
|
</div>
|
|
<div class="remember-forgot custom-control">
|
|
<!-- <label class="remember-check">
|
|
<input type="checkbox" id="remember">
|
|
<span id="remember-text">Remember Me</span>
|
|
</label> -->
|
|
<input type="checkbox" class="custom-control-input" id="remember">
|
|
<label class="custom-control-label" for="remember">
|
|
<span class="svg-check">
|
|
<svg viewBox="0 0 24 24">
|
|
<polyline points="5 13 10 18 19 7"></polyline>
|
|
</svg>
|
|
</span>
|
|
Remember Me
|
|
</label>
|
|
<a href="#" class="forgot-link" id="forgot-link">Forgot password?</a>
|
|
</div>
|
|
<button type="submit" class="btn-aifo-primary" id="login-button">Log in</button>
|
|
</form>
|
|
<div class="divider">
|
|
<div class="divider-line"></div><span class="divider-text" id="divider-text">or continue with</span>
|
|
<div class="divider-line"></div>
|
|
</div>
|
|
<div class="social-buttons"><button class="social-btn" aria-label="Continue with Google">
|
|
<svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" fill="#4285F4" /> <path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853" /> <path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" fill="#FBBC05" /> <path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" fill="#EA4335" />
|
|
</svg></button> <button class="social-btn" aria-label="Continue with Facebook">
|
|
<svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" fill="#1877F2" />
|
|
</svg></button> <button class="social-btn" aria-label="Continue with Apple">
|
|
<svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M17.05 20.28c-.98.95-2.05.88-3.08.4-1.09-.5-2.08-.48-3.24 0-1.44.62-2.2.44-3.06-.4C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z" fill="#000000" />
|
|
</svg></button>
|
|
</div>
|
|
<div class="signup-prompt"><span id="signup-prompt-text">Do not have an account yet?</span> <a href="#" class="signup-link text-orange" id="signup-link">Sign Up</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Right Column: Feature Cards -->
|
|
<div class="col-lg-7 col-xl-8 right-block mb-hidden">
|
|
<div class="features-column"><!-- Large Card 1: Academy -->
|
|
<div class="feature-card feature-card-large school">
|
|
<div class="feature-icon-container">
|
|
<div class="feature-icon">
|
|
<img src="../assets/images/backgrounds/icon/school.svg">
|
|
</div>
|
|
</div>
|
|
<div class="feature-content">
|
|
<div class="feature-title text-orange" id="academy-title">
|
|
AIFO Academy
|
|
</div>
|
|
<div class="feature-subtitle" id="academy-subtitle">
|
|
Learn, then earn
|
|
</div>
|
|
<div class="feature-description" id="academy-description">
|
|
Access step-by-step courses on strategy, risk management and trading psychology, designed to help you pass challenges more consistently.
|
|
</div>
|
|
</div>
|
|
</div><!-- Large Card 2: Free Trial -->
|
|
<div class="feature-card feature-card-large feature-card-trial">
|
|
<div class="feature-content">
|
|
<div class="feature-title" id="trial-title">
|
|
Free Trial
|
|
</div>
|
|
<div class="feature-subtitle" id="trial-subtitle">
|
|
Try before you commit
|
|
</div>
|
|
<div class="feature-description" id="trial-description">
|
|
Open a free practice account to experience our rules, platform flow and risk limits before purchasing any
|
|
</div>
|
|
</div>
|
|
|
|
</div><!-- Small Cards Row -->
|
|
<div class="small-cards-row"><!-- Small Card 1: Refer Friends -->
|
|
<div class="feature-card feature-card-small">
|
|
<div class="feature-card-small-header">
|
|
<div class="feature-icon">
|
|
<img src="../assets/images/backgrounds/icon/icon-arrows_left_right.svg">
|
|
</div>
|
|
<div class="feature-title" id="refer-title">
|
|
Refer Friends
|
|
</div>
|
|
</div>
|
|
<div class="feature-subtitle-small" id="refer-subtitle">
|
|
Grow together, earn rewards
|
|
</div>
|
|
<div class="feature-description" id="refer-description">
|
|
Invite friends who love trading. When they join and start challenges, you get exclusive rewards and benefits.
|
|
</div>
|
|
</div><!-- Small Card 2: Help -->
|
|
<div class="feature-card feature-card-small">
|
|
<div class="feature-card-small-header align-items-start">
|
|
<div class="feature-icon">
|
|
<img src="../assets/images/backgrounds/icon/icon-help.svg">
|
|
</div>
|
|
<div class="feature-title" id="help-title">
|
|
Help when you need it
|
|
</div>
|
|
</div>
|
|
<div class="feature-description" id="help-description">
|
|
Our team is here to assist you with registration, challenge selection and account setup.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</main>
|
|
|
|
<!-- Core -->
|
|
<script src="../assets/vendor/jquery/jquery-3.7.1.min.js"></script>
|
|
<script src="../assets/vendor/popper/popper.min.js"></script>
|
|
<script src="../assets/js/bootstrap/bootstrap.min.js"></script>
|
|
<!-- FontAwesome 5 -->
|
|
<script src="../assets/vendor/fontawesome/js/fontawesome-all.min.js" defer></script>
|
|
<!-- Page plugins -->
|
|
<script src="../assets/vendor/bootstrap-select/js/bootstrap-select.min.js"></script>
|
|
<script src="../assets/vendor/bootstrap-tagsinput/bootstrap-tagsinput.min.js"></script>
|
|
<script src="../assets/vendor/input-mask/input-mask.min.js"></script>
|
|
<script src="../assets/vendor/nouislider/js/nouislider.min.js"></script>
|
|
<script src="../assets/vendor/textarea-autosize/textarea-autosize.min.js"></script>
|
|
<!-- Theme JS -->
|
|
<script src="../assets/js/theme.js"></script>
|
|
<!-- Top code bar behavior -->
|
|
|
|
</body>
|
|
|
|
|
|
|
|
<script>
|
|
// Prevent form submission if validation fails
|
|
(function() {
|
|
'use strict';
|
|
window.addEventListener('load', function() {
|
|
// Get form validation styles
|
|
var forms = document.getElementsByClassName('needs-validation');
|
|
// Loop and prevent submission
|
|
var validation = Array.prototype.filter.call(forms, function(form) {
|
|
form.addEventListener('submit', function(event) {
|
|
if (form.checkValidity() === false) {
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
}
|
|
form.classList.add('was-validated');
|
|
}, false);
|
|
});
|
|
}, false);
|
|
})();
|
|
|
|
|
|
// Password toggle functionality
|
|
const passwordToggle = document.getElementById('password-toggle');
|
|
const passwordInput = document.getElementById('password');
|
|
const eyeIcon = document.getElementById('eye-icon');
|
|
|
|
passwordToggle.addEventListener('click', function () {
|
|
const isPassword = passwordInput.type === 'password';
|
|
passwordInput.type = isPassword ? 'text' : 'password';
|
|
|
|
if (isPassword) {
|
|
eyeIcon.innerHTML = '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />';
|
|
} else {
|
|
eyeIcon.innerHTML = '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21" />';
|
|
}
|
|
});
|
|
|
|
</script>
|
|
|
|
</html>
|