Files
steven 4d30803b60 Initial commit: AIFO official portal web.
Add static site, shared layout, and Node dev server with standard .gitignore.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-30 15:29:50 +08:00

284 lines
14 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>contact page</title>
<link type="text/css" href="../assets/vendor/icon/iconfont.css" rel="stylesheet">
<link type="text/css" href="../assets/css/style.css" rel="stylesheet">
<!-- Theme CSS -->
<link type="text/css" href="../assets/css/theme.css" rel="stylesheet">
<link type="text/css" href="../assets/css/index.css" rel="stylesheet">
<link type="text/css" href="../assets/css/academy.css" rel="stylesheet">
<style>
.info-block .media-nav-link {
padding: 0 .3rem;
}
</style>
</head>
<body class="aifo-bg-primary">
<div id="nav-container"></div>
<main class="main" id="contact">
<div class="academy-block-1">
<div class="contact-page">
<div class="container contact-wrap">
<div class="row align-items-start d-flex justify-content-between">
<div class="col-lg-5 col-md-6 info-column">
<div class="title-wrapper">
<h1 class="main-title">
<span class="line1" id="contact-line1">Contact</span>
<span class="line2" id="contact-line2">Us <img src="../assets/images/backgrounds/icon/contact-icon.svg" class="heading-icon floating-img"></span>
</h1>
<!-- <div class="title-icon">
<i class="fas fa-paper-plane"></i>
</div> -->
</div>
<div class="contact-details">
<p><strong>Email:</strong> <a href="mailto:support@AIFO.com" id="email-link">support@AIFO.com</a></p>
<p><strong>Landline Number:</strong> <a href="tel:+35725255160" id="phone-link">+35725255160</a></p>
</div>
<div class="info-block">
<h3>Business Hours</h3>
<p id="business-hours-text">We're just one click away You may contact us 24/7 via Email or Live Chat.</p>
</div>
<div class="info-block">
<h3>Address</h3>
<p id="address-text">Flat/RM A, 12/F ZJ 300,300 Lockhart Road, Wan Chai Hong Kong</p>
</div>
<div class="info-block">
<h3>Follow Us</h3>
<div class="social-icons">
<ul class="nav social">
<li class="nav-item">
<a class="media-nav-link" href="" target="_blank">
<i class="icon-media-box discord"></i>
</a>
</li>
<li class="nav-item">
<a class="media-nav-link" href="" target="_blank">
<i class="icon-media-box telegram"></i>
</a>
</li>
<li class="nav-item">
<a class="media-nav-link" href="" target="_blank">
<i class="icon-media-box facebook"></i>
</a>
</li>
<li class="nav-item">
<a class="media-nav-link" href="" target="_blank">
<i class="icon-media-box x"></i>
</a>
</li>
<li class="nav-item">
<a class="media-nav-link" href="" target="_blank">
<i class="icon-media-box instagram"></i>
</a>
</li>
<li class="nav-item">
<a class="media-nav-link" href="" target="_blank"><i class="icon-media-box youtu"></i></a>
</li>
<li class="nav-item">
<a class="media-nav-link" href="" target="_blank"> <i class="icon-media-box linkedin"></i></a>
</li>
</ul>
<!-- <a href="#" class="social-icon" aria-label="Facebook">
<i class="fab fa-facebook-f"></i></a>
<a href="#" class="social-icon" aria-label="Twitter"><i class="fab fa-x-twitter"></i>
</a> <a href="#" class="social-icon" aria-label="Instagram">
<i class="fab fa-instagram"></i></a>
<a href="#" class="social-icon" aria-label="YouTube">
<i class="fab fa-youtube"></i></a>
<a href="#" class="social-icon" aria-label="LinkedIn">
<i class="fab fa-linkedin-in"></i>
</a> -->
</div>
</div>
</div>
<div class="col-lg-7 col-md-6 contact-form-ringht">
<div class="form-card">
<h2 id="form-title">Send Us a Message!</h2>
<p class="form-description" id="form-description">If you have any questions and need our assistance, kindly submit a message via the form. One of our support agents will get back to you as soon as possible!</p>
<div class="success-hint" id="success-message"><span class="success-icon">!</span> <span class="success-text">Your message has sent successfully!</span>
</div>
<form id="contact-form" novalidate>
<div class="form-group"><label for="name">Your fullname</label> <input type="text" class="form-control" id="name" placeholder="Enter your name" required>
<div class="invalid-feedback">
Please enter your name.
</div>
</div>
<div class="form-group"><label for="email">Email address</label> <input type="email" class="form-control" id="email" placeholder="Enter your email" required>
<div class="invalid-feedback">
Please enter a valid email address.
</div>
</div>
<div class="form-group"><label for="subject">Subject</label> <input type="text" class="form-control" id="subject" placeholder="Enter your email" required>
<div class="invalid-feedback">
Please enter a subject.
</div>
</div>
<div class="form-group"><label for="message">Message</label> <textarea class="form-control" id="message" placeholder="Message" required></textarea>
<div class="invalid-feedback">
Please enter your message.
</div>
</div><button type="submit" class="btn btn-submit">Submit</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<section id="section-10" class="slice slice-lg" data-delimiter="1">
<div class="bg_light">
<div class="container">
<div class="mb-md text-center fade-in">
<h1 class="heading h1">Join <img src="../assets/images/backgrounds/Frame 1000008381.png" alt="Funded Trading" class="tx-img floating-img"></h1>
<h1 class="heading h1"> <img src="../assets/images/backgrounds/Frame 1000008386.png" alt="Funded Trading" class="zfj-img floating-img"><span class="text-orange">Our Community</span></h1>
<div class="fluid-paragraph text-center mt-4">
<p class="lead lh-180">
Join a <span class="text-orange">supportive network</span> of traders where you can <br>share insights, learn together, and celebrate <br>every step of your journey.
</p>
</div>
</div>
<div class="row justify-content-center ">
<div class="col-auto">
<div class="hero-buttons d-flex flex-wrap justify-content-center fade-in">
<a href="#" class="btn btn-start-challenge"><img src="../assets/images/backgrounds/btn-icon-1.png" alt="Funded Trading" class="floating-img"> Join Discord</a>
<a href="#" class="btn btn-free-trial"><img src="../assets/images/backgrounds/btn-icon-2.png" alt="Funded Trading" class="floating-img">
Join Telegram
</a>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<div id="footer-container"></div>
<!-- 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 -->
<script src="/js/layout.js"></script>
</body>
<script>
$(document).ready(function() {
const defaultConfig = {
contact_title: "Contact",
contact_title_2: "Us",
email_address: "support@AIFO.com",
phone_number: "+35725255160",
business_hours_text: "We're just one click away You may contact us 24/7 via Email or Live Chat.",
address_text: "Flat/RM A, 12/F ZJ 300,300 Lockhart Road, Wan Chai Hong Kong",
form_title: "Send Us a Message!",
form_description: "If you have any questions and need our assistance, kindly submit a message via the form. One of our support agents will get back to you as soon as possible!"
};
async function onConfigChange(config) {
$('#contact-line1').text(config.contact_title || defaultConfig.contact_title);
$('#contact-line2').text(config.contact_title_2 || defaultConfig.contact_title_2);
const emailAddr = config.email_address || defaultConfig.email_address;
$('#email-link').text(emailAddr).attr('href', 'mailto:' + emailAddr);
const phoneNum = config.phone_number || defaultConfig.phone_number;
$('#phone-link').text(phoneNum).attr('href', 'tel:' + phoneNum);
$('#business-hours-text').text(config.business_hours_text || defaultConfig.business_hours_text);
$('#address-text').text(config.address_text || defaultConfig.address_text);
$('#form-title').text(config.form_title || defaultConfig.form_title);
$('#form-description').text(config.form_description || defaultConfig.form_description);
}
function mapToCapabilities() {
return {
recolorables: [],
borderables: [],
fontEditable: undefined,
fontSizeable: undefined
};
}
function mapToEditPanelValues(config) {
return new Map([
["contact_title", config.contact_title || defaultConfig.contact_title],
["contact_title_2", config.contact_title_2 || defaultConfig.contact_title_2],
["email_address", config.email_address || defaultConfig.email_address],
["phone_number", config.phone_number || defaultConfig.phone_number],
["business_hours_text", config.business_hours_text || defaultConfig.business_hours_text],
["address_text", config.address_text || defaultConfig.address_text],
["form_title", config.form_title || defaultConfig.form_title],
["form_description", config.form_description || defaultConfig.form_description]
]);
}
if (window.elementSdk) {
window.elementSdk.init({
defaultConfig: defaultConfig,
onConfigChange: onConfigChange,
mapToCapabilities: mapToCapabilities,
mapToEditPanelValues: mapToEditPanelValues
});
}
$('#contact-form').on('submit', function(e) {
e.preventDefault();
const form = this;
if (!form.checkValidity()) {
$(form).addClass('was-validated');
return;
}
const $submitBtn = $(form).find('.btn-submit');
$submitBtn.prop('disabled', true).text('Sending...');
setTimeout(function() {
$(form).removeClass('was-validated');
form.reset();
$('#success-message').addClass('show');
$submitBtn.prop('disabled', false).text('Submit');
setTimeout(function() {
$('#success-message').removeClass('show');
}, 5000);
}, 800);
});
$('.form-control').on('input', function() {
if ($(this).closest('form').hasClass('was-validated')) {
this.checkValidity();
}
});
});
</script>
</html>