142 lines
6.3 KiB
PHP
142 lines
6.3 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<!-- SEO and Meta Tags -->
|
|
<title>UBPay - Welcome</title>
|
|
<meta name="description" content="Join UBPay, the future of payments in Southern Africa. Built with Flatlogic Generator.">
|
|
<meta name="keywords" content="fintech africa, mobile payments, p2p transfer, merchant services, financial inclusion, unbanked, cross-border payments, digital wallet, south africa fintech, Built with Flatlogic Generator">
|
|
|
|
<!-- Open Graph / Facebook -->
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:title" content="UBPay - Secure & Instant Payments">
|
|
<meta property="og:description" content="The leading fintech platform for Southern Africa, enabling financial inclusion for everyone.">
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
|
|
<!-- Platform-managed Meta Tags -->
|
|
<?php if (getenv('PROJECT_IMAGE_URL')): ?>
|
|
<meta property="og:image" content="<?= htmlspecialchars(getenv('PROJECT_IMAGE_URL')) ?>">
|
|
<meta name="twitter:image" content="<?= htmlspecialchars(getenv('PROJECT_IMAGE_URL')) ?>">
|
|
<?php endif; ?>
|
|
|
|
<!-- Stylesheets -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="assets/css/custom.css?v=<?php echo time(); ?>" rel="stylesheet">
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Toast Container -->
|
|
<div class="toast-container position-fixed top-0 end-0 p-3">
|
|
<div id="notificationToast" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
|
|
<div class="toast-header">
|
|
<strong class="me-auto" id="toastTitle"></strong>
|
|
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
|
|
</div>
|
|
<div class="toast-body" id="toastBody">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Navbar -->
|
|
<nav class="navbar navbar-expand-lg navbar-light bg-white shadow-sm">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="#">UBPay</a>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<main class="container my-5">
|
|
<div class="row align-items-center g-5">
|
|
|
|
<!-- Left Column: Welcome Text -->
|
|
<div class="col-lg-6">
|
|
<h1 class="display-4 fw-bold lh-1 mb-3">The Future of Payments in Southern Africa</h1>
|
|
<p class="lead">Join UBPay for fast, secure, and low-cost payments. Built for everyone, from street vendors to cross-border businesses. Financial inclusion starts here.</p>
|
|
</div>
|
|
|
|
<!-- Right Column: Registration Form -->
|
|
<div class="col-lg-6">
|
|
<div class="card registration-card p-4 p-md-5">
|
|
<form action="register.php" method="POST">
|
|
<h3 class="fw-bold mb-4 text-center">Create Your Account</h3>
|
|
|
|
<div class="form-floating mb-3">
|
|
<input type="text" class="form-control" id="fullName" name="full_name" placeholder="John Doe" required>
|
|
<label for="fullName">Full Name</label>
|
|
</div>
|
|
|
|
<div class="form-floating mb-3">
|
|
<input type="tel" class="form-control" id="mobileNumber" name="mobile_number" placeholder="+27721234567" required>
|
|
<label for="mobileNumber">Mobile Number</label>
|
|
</div>
|
|
|
|
<div class="form-floating mb-3">
|
|
<input type="password" class="form-control" id="password" name="password" placeholder="Password" required>
|
|
<label for="password">Password</label>
|
|
</div>
|
|
|
|
<div class="form-check mb-4">
|
|
<input class="form-check-input" type="checkbox" value="" id="agreeTerms" name="agree_terms" required>
|
|
<label class="form-check-label" for="agreeTerms">
|
|
I agree to the <a href="#">Terms and Conditions</a>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="d-grid">
|
|
<button class="btn btn-primary btn-lg" type="submit">Create Account</button>
|
|
</div>
|
|
</form>
|
|
<p class="text-center mt-3">
|
|
Already have an account? <a href="login.php">Login</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer class="container py-4 mt-5 border-top">
|
|
<p class="text-center text-muted">© <?php echo date("Y"); ?> UBPay. All rights reserved.</p>
|
|
</footer>
|
|
|
|
<!-- Scripts -->
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
const successMessage = urlParams.get('success');
|
|
const errorMessage = urlParams.get('error');
|
|
|
|
const toastEl = document.getElementById('notificationToast');
|
|
if (!toastEl) return;
|
|
|
|
const toast = new bootstrap.Toast(toastEl);
|
|
const toastTitle = document.getElementById('toastTitle');
|
|
const toastBody = document.getElementById('toastBody');
|
|
|
|
if (successMessage) {
|
|
toastTitle.textContent = 'Success';
|
|
toastTitle.classList.add('text-success');
|
|
toastBody.textContent = successMessage;
|
|
toast.show();
|
|
} else if (errorMessage) {
|
|
toastTitle.textContent = 'Error';
|
|
toastTitle.classList.add('text-danger');
|
|
toastBody.textContent = errorMessage;
|
|
toast.show();
|
|
}
|
|
|
|
// Clean URL after showing toast
|
|
if(successMessage || errorMessage) {
|
|
window.history.replaceState({}, document.title, window.location.pathname);
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|