steven
4d30803b60
Add static site, shared layout, and Node dev server with standard .gitignore. Co-authored-by: Cursor <cursoragent@cursor.com>
582 lines
33 KiB
HTML
582 lines
33 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 signup 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="https://cdn.jsdelivr.net/gh/lipis/flag-icons@7.3.2/css/flag-icons.min.css"
|
|
onerror="this.onerror=null;this.href='/assets/flag-icons.min.css';">
|
|
<!-- <link rel="stylesheet"
|
|
href="../assets/flagicon/css/flag-icons.min.css"> -->
|
|
<link rel="stylesheet" href="../assets/css/login.css" rel="">
|
|
</head>
|
|
|
|
<style>
|
|
|
|
|
|
@media (max-width: 768px) {
|
|
|
|
}
|
|
</style>
|
|
<body class="aifo-bg-primary">
|
|
|
|
<main class="main register-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 signup-form">
|
|
<div class="login-card card-base">
|
|
<div class="signup-header">
|
|
<h1 class="signup-title" id="page-title">Create Your New Profile</h1>
|
|
</div>
|
|
<form id="login-form" class="needs-validation" novalidate>
|
|
<div class="form-group">
|
|
<label class="form-label" id="username-label" for="username">User name</label>
|
|
<input type="text" class="form-control" name="username" id="username" placeholder="Enter your name" required>
|
|
<div class="invalid-feedback">
|
|
Please enter your name.
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="form-label" id="useremial-label" for="email">Email Address</label>
|
|
<input type="email" class="form-control" name="email" id="email" placeholder="Enter your email" required>
|
|
<div class="invalid-feedback">
|
|
Please enter your email.
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="phone" class="form-label" id="phone-label">Phone Number</label>
|
|
<div class="phone-wrapper ">
|
|
|
|
<!-- Country Selector -->
|
|
<div
|
|
class="country-select dropdown-toggle"
|
|
data-toggle="dropdown"
|
|
aria-haspopup="true">
|
|
<span class="fi fi-au"></span>
|
|
<span class="country-code">+61</span>
|
|
<span class="arrow icon iconfont icon-downarrow"></span>
|
|
</div>
|
|
|
|
<!-- Dropdown list -->
|
|
<div class="dropdown-menu w-100">
|
|
<!-- Search -->
|
|
<div class="country-search-wrapper">
|
|
<input
|
|
type="text"
|
|
class="country-search-input"
|
|
placeholder="Search country..."
|
|
id="country-search"
|
|
>
|
|
</div>
|
|
|
|
<!-- Country list -->
|
|
<div class="country-list" id="country-list"></div>
|
|
</div>
|
|
|
|
<!-- Phone input -->
|
|
<input
|
|
type="tel"
|
|
class="phone-input"
|
|
placeholder="Enter your phone number"
|
|
required
|
|
pattern="^[0-9]{6,15}$">
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label" id="password-label" for="password">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" class="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>
|
|
<div class="form-group">
|
|
<label class="form-label" for="confirm_password">Confirm Password</label>
|
|
<div class="password-wrapper">
|
|
<input type="password" class="form-control" id="confirm_password" placeholder="Enter your password" required>
|
|
<button type="button" class="password-toggle" id="confirm-password-toggle" aria-label="Toggle password visibility">
|
|
<svg id="eye-icon" class="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 confirm Password.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="remember-forgot custom-control">
|
|
|
|
<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">Sign up</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="checkbox-group">
|
|
<div class="checkbox-wrapper">
|
|
<div class="custom-checkbox"><input type="checkbox" id="terms-checkbox" required> <span class="checkbox-box"></span>
|
|
</div><label for="terms-checkbox" class="checkbox-label"> I confirm that I am not located in a country where AIFO's services are unavailable, and that the information I've provided is accurate and matches my government-issued ID. </label>
|
|
</div>
|
|
<div class="checkbox-wrapper">
|
|
<div class="custom-checkbox"><input type="checkbox" id="newsletter-checkbox"> <span class="checkbox-box"></span>
|
|
</div><label for="newsletter-checkbox" class="checkbox-label"> Would you like to receive updates about our project? Join our newsletter and receive the latest news delivered to your inbox. </label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="signup-prompt">
|
|
<span id="signup-prompt-text">Already have an account?</span>
|
|
<a href="#" class="signup-link text-orange" id="signup-link">Log in</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);
|
|
})();
|
|
</script>
|
|
|
|
<script>
|
|
/* ===============================
|
|
Country JSON (can be auto-generated/extended)
|
|
================================ */
|
|
const countries = [
|
|
{"name": "Afghanistan", "iso": "af", "dial": "+93"},
|
|
{"name": "Albania", "iso": "al", "dial": "+355"},
|
|
{"name": "Algeria", "iso": "dz", "dial": "+213"},
|
|
{"name": "Andorra", "iso": "ad", "dial": "+376"},
|
|
{"name": "Angola", "iso": "ao", "dial": "+244"},
|
|
{"name": "Argentina", "iso": "ar", "dial": "+54"},
|
|
{"name": "Armenia", "iso": "am", "dial": "+374"},
|
|
{"name": "Australia", "iso": "au", "dial": "+61"},
|
|
{"name": "Austria", "iso": "at", "dial": "+43"},
|
|
{"name": "Azerbaijan", "iso": "az", "dial": "+994"},
|
|
{"name": "Bahamas", "iso": "bs", "dial": "+1242"},
|
|
{"name": "Bahrain", "iso": "bh", "dial": "+973"},
|
|
{"name": "Barbados", "iso": "bb", "dial": "+1246"},
|
|
{"name": "Belgium", "iso": "be", "dial": "+32"},
|
|
{"name": "Benin", "iso": "bj", "dial": "+229"},
|
|
{"name": "Bhutan", "iso": "bt", "dial": "+975"},
|
|
{"name": "Bolivia", "iso": "bo", "dial": "+591"},
|
|
{"name": "Bosnia and Herzegovina", "iso": "ba", "dial": "+387"},
|
|
{"name": "Botswana", "iso": "bw", "dial": "+267"},
|
|
{"name": "Brazil", "iso": "br", "dial": "+55"},
|
|
{"name": "Brunei", "iso": "bn", "dial": "+673"},
|
|
{"name": "Bulgaria", "iso": "bg", "dial": "+359"},
|
|
{"name": "Burkina Faso", "iso": "bf", "dial": "+226"},
|
|
{"name": "Cambodia", "iso": "kh", "dial": "+855"},
|
|
{"name": "Cameroon", "iso": "cm", "dial": "+237"},
|
|
{"name": "Canada", "iso": "ca", "dial": "+1"},
|
|
{"name": "Central African Republic", "iso": "cf", "dial": "+236"},
|
|
{"name": "Chile", "iso": "cl", "dial": "+56"},
|
|
{"name": "China", "iso": "cn", "dial": "+86"},
|
|
{"name": "Colombia", "iso": "co", "dial": "+57"},
|
|
{"name": "Congo", "iso": "cg", "dial": "+242"},
|
|
{"name": "Costa Rica", "iso": "cr", "dial": "+506"},
|
|
{"name": "Croatia", "iso": "hr", "dial": "+385"},
|
|
{"name": "Cuba", "iso": "cu", "dial": "+53"},
|
|
{"name": "Cyprus", "iso": "cy", "dial": "+357"},
|
|
{"name": "Czech Republic", "iso": "cz", "dial": "+420"},
|
|
{"name": "Denmark", "iso": "dk", "dial": "+45"},
|
|
{"name": "Djibouti", "iso": "dj", "dial": "+253"},
|
|
{"name": "Dominica", "iso": "dm", "dial": "+1767"},
|
|
{"name": "Dominican Republic", "iso": "do", "dial": "+1809"},
|
|
{"name": "Ecuador", "iso": "ec", "dial": "+593"},
|
|
{"name": "Egypt", "iso": "eg", "dial": "+20"},
|
|
{"name": "El Salvador", "iso": "sv", "dial": "+503"},
|
|
{"name": "Equatorial Guinea", "iso": "gq", "dial": "+240"},
|
|
{"name": "Estonia", "iso": "ee", "dial": "+372"},
|
|
{"name": "Eswatini", "iso": "sz", "dial": "+268"},
|
|
{"name": "Ethiopia", "iso": "et", "dial": "+251"},
|
|
{"name": "Finland", "iso": "fi", "dial": "+358"},
|
|
{"name": "France", "iso": "fr", "dial": "+33"},
|
|
{"name": "Gabon", "iso": "ga", "dial": "+241"},
|
|
{"name": "Gambia", "iso": "gm", "dial": "+220"},
|
|
{"name": "Georgia", "iso": "ge", "dial": "+995"},
|
|
{"name": "Germany", "iso": "de", "dial": "+49"},
|
|
{"name": "Ghana", "iso": "gh", "dial": "+233"},
|
|
{"name": "Greece", "iso": "gr", "dial": "+30"},
|
|
{"name": "Guatemala", "iso": "gt", "dial": "+502"},
|
|
{"name": "Guinea", "iso": "gn", "dial": "+224"},
|
|
{"name": "Guinea-Bissau", "iso": "gw", "dial": "+245"},
|
|
{"name": "Guyana", "iso": "gy", "dial": "+592"},
|
|
{"name": "Haiti", "iso": "ht", "dial": "+509"},
|
|
{"name": "Honduras", "iso": "hn", "dial": "+504"},
|
|
{"name": "Hong Kong", "iso": "hk", "dial": "+852"},
|
|
{"name": "Hungary", "iso": "hu", "dial": "+36"},
|
|
{"name": "Iceland", "iso": "is", "dial": "+354"},
|
|
{"name": "India", "iso": "in", "dial": "+91"},
|
|
{"name": "Indonesia", "iso": "id", "dial": "+62"},
|
|
{"name": "Iran", "iso": "ir", "dial": "+98"},
|
|
{"name": "Iraq", "iso": "iq", "dial": "+964"},
|
|
{"name": "Ireland", "iso": "ie", "dial": "+353"},
|
|
{"name": "Israel", "iso": "il", "dial": "+972"},
|
|
{"name": "Italy", "iso": "it", "dial": "+39"},
|
|
{"name": "Ivory Coast", "iso": "ci", "dial": "+225"},
|
|
{"name": "Jamaica", "iso": "jm", "dial": "+1876"},
|
|
{"name": "Japan", "iso": "jp", "dial": "+81"},
|
|
{"name": "Jordan", "iso": "jo", "dial": "+962"},
|
|
{"name": "Kazakhstan", "iso": "kz", "dial": "+7"},
|
|
{"name": "Kenya", "iso": "ke", "dial": "+254"},
|
|
{"name": "Kiribati", "iso": "ki", "dial": "+686"},
|
|
{"name": "Kosovo", "iso": "xk", "dial": "+383"},
|
|
{"name": "Kuwait", "iso": "kw", "dial": "+965"},
|
|
{"name": "Kyrgyzstan", "iso": "kg", "dial": "+996"},
|
|
{"name": "Laos", "iso": "la", "dial": "+856"},
|
|
{"name": "Latvia", "iso": "lv", "dial": "+371"},
|
|
{"name": "Lebanon", "iso": "lb", "dial": "+961"},
|
|
{"name": "Lesotho", "iso": "ls", "dial": "+266"},
|
|
{"name": "Liberia", "iso": "lr", "dial": "+231"},
|
|
{"name": "Libya", "iso": "ly", "dial": "+218"},
|
|
{"name": "Liechtenstein", "iso": "li", "dial": "+423"},
|
|
{"name": "Lithuania", "iso": "lt", "dial": "+370"},
|
|
{"name": "Luxembourg", "iso": "lu", "dial": "+352"},
|
|
{"name": "Macao", "iso": "mo", "dial": "+853"},
|
|
{"name": "Madagascar", "iso": "mg", "dial": "+261"},
|
|
{"name": "Malawi", "iso": "mw", "dial": "+265"},
|
|
{"name": "Malaysia", "iso": "my", "dial": "+60"},
|
|
{"name": "Maldives", "iso": "mv", "dial": "+960"},
|
|
{"name": "Mali", "iso": "ml", "dial": "+223"},
|
|
{"name": "Malta", "iso": "mt", "dial": "+356"},
|
|
{"name": "Marshall Islands", "iso": "mh", "dial": "+692"},
|
|
{"name": "Mauritania", "iso": "mr", "dial": "+222"},
|
|
{"name": "Mauritius", "iso": "mu", "dial": "+230"},
|
|
{"name": "Mexico", "iso": "mx", "dial": "+52"},
|
|
{"name": "Micronesia", "iso": "fm", "dial": "+691"},
|
|
{"name": "Moldova", "iso": "md", "dial": "+373"},
|
|
{"name": "Monaco", "iso": "mc", "dial": "+377"},
|
|
{"name": "Mongolia", "iso": "mn", "dial": "+976"},
|
|
{"name": "Montenegro", "iso": "me", "dial": "+382"},
|
|
{"name": "Morocco", "iso": "ma", "dial": "+212"},
|
|
{"name": "Mozambique", "iso": "mz", "dial": "+258"},
|
|
{"name": "Myanmar", "iso": "mm", "dial": "+95"},
|
|
{"name": "Namibia", "iso": "na", "dial": "+264"},
|
|
{"name": "Nauru", "iso": "nr", "dial": "+674"},
|
|
{"name": "Nepal", "iso": "np", "dial": "+977"},
|
|
{"name": "Netherlands", "iso": "nl", "dial": "+31"},
|
|
{"name": "New Zealand", "iso": "nz", "dial": "+64"},
|
|
{"name": "Nicaragua", "iso": "ni", "dial": "+505"},
|
|
{"name": "Niger", "iso": "ne", "dial": "+227"},
|
|
{"name": "Nigeria", "iso": "ng", "dial": "+234"},
|
|
{"name": "North Macedonia", "iso": "mk", "dial": "+389"},
|
|
{"name": "Norway", "iso": "no", "dial": "+47"},
|
|
{"name": "Oman", "iso": "om", "dial": "+968"},
|
|
{"name": "Pakistan", "iso": "pk", "dial": "+92"},
|
|
{"name": "Palau", "iso": "pw", "dial": "+680"},
|
|
{"name": "Palestine", "iso": "ps", "dial": "+970"},
|
|
{"name": "Panama", "iso": "pa", "dial": "+507"},
|
|
{"name": "Papua New Guinea", "iso": "pg", "dial": "+675"},
|
|
{"name": "Paraguay", "iso": "py", "dial": "+595"},
|
|
{"name": "Peru", "iso": "pe", "dial": "+51"},
|
|
{"name": "Philippines", "iso": "ph", "dial": "+63"},
|
|
{"name": "Poland", "iso": "pl", "dial": "+48"},
|
|
{"name": "Portugal", "iso": "pt", "dial": "+351"},
|
|
{"name": "Qatar", "iso": "qa", "dial": "+974"},
|
|
{"name": "Romania", "iso": "ro", "dial": "+40"},
|
|
{"name": "Russia", "iso": "ru", "dial": "+7"},
|
|
{"name": "Rwanda", "iso": "rw", "dial": "+250"},
|
|
{"name": "Saint Kitts and Nevis", "iso": "kn", "dial": "+1869"},
|
|
{"name": "Saint Lucia", "iso": "lc", "dial": "+1758"},
|
|
{"name": "Saint Vincent and the Grenadines", "iso": "vc", "dial": "+1784"},
|
|
{"name": "Samoa", "iso": "ws", "dial": "+685"},
|
|
{"name": "San Marino", "iso": "sm", "dial": "+378"},
|
|
{"name": "Sao Tome and Principe", "iso": "st", "dial": "+239"},
|
|
{"name": "Saudi Arabia", "iso": "sa", "dial": "+966"},
|
|
{"name": "Senegal", "iso": "sn", "dial": "+221"},
|
|
{"name": "Serbia", "iso": "rs", "dial": "+381"},
|
|
{"name": "Seychelles", "iso": "sc", "dial": "+248"},
|
|
{"name": "Sierra Leone", "iso": "sl", "dial": "+232"},
|
|
{"name": "Singapore", "iso": "sg", "dial": "+65"},
|
|
{"name": "Slovakia", "iso": "sk", "dial": "+421"},
|
|
{"name": "Slovenia", "iso": "si", "dial": "+386"},
|
|
{"name": "Solomon Islands", "iso": "sb", "dial": "+677"},
|
|
{"name": "Somalia", "iso": "so", "dial": "+252"},
|
|
{"name": "South Africa", "iso": "za", "dial": "+27"},
|
|
{"name": "South Korea", "iso": "kr", "dial": "+82"},
|
|
{"name": "South Sudan", "iso": "ss", "dial": "+211"},
|
|
{"name": "Spain", "iso": "es", "dial": "+34"},
|
|
{"name": "Sudan", "iso": "sd", "dial": "+249"},
|
|
{"name": "Suriname", "iso": "sr", "dial": "+597"},
|
|
{"name": "Sweden", "iso": "se", "dial": "+46"},
|
|
{"name": "Switzerland", "iso": "ch", "dial": "+41"},
|
|
{"name": "Taiwan", "iso": "tw", "dial": "+886"},
|
|
{"name": "Tajikistan", "iso": "tj", "dial": "+992"},
|
|
{"name": "Tanzania", "iso": "tz", "dial": "+255"},
|
|
{"name": "Thailand", "iso": "th", "dial": "+66"},
|
|
{"name": "Timor-Leste", "iso": "tl", "dial": "+670"},
|
|
{"name": "Togo", "iso": "tg", "dial": "+228"},
|
|
{"name": "Tonga", "iso": "to", "dial": "+676"},
|
|
{"name": "Trinidad and Tobago", "iso": "tt", "dial": "+1868"},
|
|
{"name": "Tunisia", "iso": "tn", "dial": "+216"},
|
|
{"name": "Turkey", "iso": "tr", "dial": "+90"},
|
|
{"name": "Turkmenistan", "iso": "tm", "dial": "+993"},
|
|
{"name": "Uganda", "iso": "ug", "dial": "+256"},
|
|
{"name": "Ukraine", "iso": "ua", "dial": "+380"},
|
|
{"name": "United Arab Emirates", "iso": "ae", "dial": "+971"},
|
|
{"name": "United Kingdom", "iso": "gb", "dial": "+44"},
|
|
{"name": "United States", "iso": "us", "dial": "+1"},
|
|
{"name": "Uruguay", "iso": "uy", "dial": "+598"},
|
|
{"name": "Uzbekistan", "iso": "uz", "dial": "+998"},
|
|
{"name": "Vanuatu", "iso": "vu", "dial": "+678"},
|
|
{"name": "Vatican City", "iso": "va", "dial": "+379"},
|
|
{"name": "Venezuela", "iso": "ve", "dial": "+58"},
|
|
{"name": "Vietnam", "iso": "vn", "dial": "+84"},
|
|
{"name": "Yemen", "iso": "ye", "dial": "+967"},
|
|
{"name": "Zambia", "iso": "zm", "dial": "+260"},
|
|
{"name": "Zimbabwe", "iso": "zw", "dial": "+263"}
|
|
];
|
|
|
|
/* ===============================
|
|
Build dropdown list
|
|
================================ */
|
|
const $countryList = $('#country-list');
|
|
|
|
// countries.forEach(c => {
|
|
// $menu.append(`
|
|
// <a class="dropdown-item" href="#" data-iso="${c.iso}" data-dial="${c.dial}">
|
|
// <span class="fi fi-${c.iso}"></span>
|
|
// <span>${c.name} (${c.dial})</span>
|
|
// </a>
|
|
// `);
|
|
// });
|
|
|
|
|
|
function renderCountries(list) {
|
|
$countryList.empty();
|
|
|
|
list.forEach(c => {
|
|
$countryList.append(`
|
|
<a class="dropdown-item" href="#" data-iso="${c.iso}" data-dial="${c.dial}">
|
|
<span class="fi fi-${c.iso}"></span>
|
|
<span>${c.name} (${c.dial})</span>
|
|
</a>
|
|
`);
|
|
});
|
|
}
|
|
|
|
|
|
renderCountries(countries);
|
|
|
|
|
|
/* ===============================
|
|
Select country
|
|
================================ */
|
|
$countryList.on('click', '.dropdown-item', function (e) {
|
|
e.preventDefault();
|
|
$('.country-select .fi')
|
|
.attr('class', 'fi fi-' + $(this).data('iso'));
|
|
$('.country-code').text($(this).data('dial'));
|
|
});
|
|
|
|
/* ===============================
|
|
Search country
|
|
================================
|
|
|
|
*/
|
|
|
|
$("#country-search").on("input",function(){
|
|
|
|
const keyword = $(this).val().toLowerCase();
|
|
|
|
filtered = countries.filter(function(c){
|
|
return c.name.toLowerCase().includes(keyword) ||
|
|
c.dial.includes(keyword)
|
|
});
|
|
|
|
renderCountries(self.filtered);
|
|
|
|
});
|
|
|
|
$(document).on('click', '.password-toggle', function () {
|
|
const $toggle = $(this);
|
|
const $wrapper = $toggle.closest('.password-wrapper');
|
|
const $input = $wrapper.find('input[type="password"], input[type="text"]').first();
|
|
const $eyeIcon = $toggle.find('.eye-icon');
|
|
const isPassword = $input.attr('type') === 'password';
|
|
|
|
|
|
$input.attr('type', isPassword ? 'text' : 'password');
|
|
|
|
if (isPassword) {
|
|
$eyeIcon.html(`
|
|
<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.html(`
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M13.875 18.825A10.05 10.05 0 0112 19
|
|
c-4.478 0-8.268-2.943-9.543-7
|
|
a9.97 9.97 0 011.563-3.029
|
|
m5.858.908a3 3 0 114.243 4.243
|
|
M9.878 9.878l4.242 4.242
|
|
M9.88 9.88l-3.29-3.29
|
|
m7.532 7.532l3.29 3.29
|
|
M3 3l3.59 3.59
|
|
m0 0A9.953 9.953 0 0112 5
|
|
c4.478 0 8.268 2.943 9.543 7
|
|
a10.025 10.025 0 01-4.132 5.411
|
|
m0 0L21 21"/>
|
|
`);
|
|
}
|
|
});
|
|
|
|
</script>
|
|
|
|
</html>
|