landing page completed

This commit is contained in:
2025-07-09 17:54:32 +05:45
parent 608f63cc87
commit d85b5a3662
27 changed files with 1097 additions and 63 deletions

View File

@ -30,7 +30,7 @@
}
.hero-section {
background: url({{ asset('trust/assets/images/background/sweden.png') }}) no-repeat center top/cover;
/* background: url({{ asset('trust/assets/images/background/sweden.png') }}) no-repeat center top/cover; */
color: var(--dark-text);
/* padding: 100px 0; */
}
@ -109,7 +109,8 @@
.benefit-icon {
width: 180px;
height: 180px;
background: var(--primary-color);
background: linear-gradient(to right, #e8171a 60%, #ffa21c 100%);
;
color: white;
border-radius: 50%;
display: flex;
@ -196,7 +197,7 @@
}
.text-primary-custom {
color: var(--primary-color) !important;
color: #e8171a !important;
}
.flowchart-container {
@ -799,43 +800,47 @@
<section class="hero-section">
<div class="container-fluid">
<div class="row min-vh-100" style="background: linear-gradient(to right, #e8171a 60%, #ffa21c 100%);">
<div class="col-lg-6">
<img src="" alt="Landing Image" class="img-fluid h-100 w-100" style="object-fit: cover;">
<div class="row min-vh-100" style="background: linear-gradient(135deg, #264552, #203a43, #19343f);">
<div class="col-lg-6 d-flex flex-column">
@foreach ($banners as $banner)
<img src="{{ asset($banner->cover) }}" alt="Landing Image" class="img-fluid h-100 w-100"
style="object-fit: cover;">
@endforeach
</div>
<div class="col-lg-6 d-flex align-items-center justify-content-center p-4">
<div class="w-100" style="max-width: 500px;">
<div class="form-container animate-fade-in-up">
<h3 class="form-title">Registration Form</h3>
<div class="form-container animate-fade-in-up p-4 rounded-4 shadow"
style="background: #c9c6c6; color: #333; border: 1px solid #ddd; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);">
<h3 class="form-title text-center mb-4" style="color: #222;">Registration Form</h3>
<form id="enquiry-form" action="{{ route('form.submit-enquiry') }}" method="POST">
@csrf
<div class="form-group">
<div class="form-group mb-3">
<label for="name" class="form-label">Full Name <span
class="text-danger">*</span></label>
<input type="text" class="form-control" id="name" name="name"
placeholder="Enter your full name" required>
<input type="text" class="form-control border border-light-subtle" id="name"
name="name" placeholder="Enter your full name" required>
</div>
<div class="form-group">
<div class="form-group mb-3">
<label for="email" class="form-label">Email Address <span
class="text-danger">*</span></label>
<input type="email" class="form-control" id="email" name="email"
placeholder="Enter your email" required>
<input type="email" class="form-control border border-light-subtle" id="email"
name="email" placeholder="Enter your email" required>
</div>
<div class="form-group">
<div class="form-group mb-3">
<label for="phone" class="form-label">Phone Number <span
class="text-danger">*</span></label>
<input type="tel" class="form-control" id="phone" name="phone"
placeholder="Enter your phone number" required>
<input type="tel" class="form-control border border-light-subtle" id="phone"
name="phone" placeholder="Enter your phone number" required>
</div>
<div class="form-group">
<label for="qualification" class="form-label">
Highest Qualification<span class="text-danger">*</span>
</label>
<select class="form-control" id="qualification" name="qualification" required>
<div class="form-group mb-3">
<label for="qualification" class="form-label">Highest Qualification <span
class="text-danger">*</span></label>
<select class="form-control border border-light-subtle" id="qualification"
name="qualification" required>
<option value="">-Select Qualification-</option>
<option value="10">+2 or Equivalent</option>
<option value="20">Bachelors (3 year) or Equivalent</option>
@ -844,35 +849,36 @@
</select>
</div>
<div class="form-group">
<label for="score" class="form-label">Score<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="score" name="score"
placeholder="Enter Score" required>
</div>
<div class="form-group">
<label for="passed_year" class="form-label">Passed Year<span
<div class="form-group mb-3">
<label for="score" class="form-label">Score <span
class="text-danger">*</span></label>
<input type="text" class="form-control" id="passed_year" name="passed_year"
placeholder="Enter Passed Year" required>
<input type="text" class="form-control border border-light-subtle" id="score"
name="score" placeholder="Enter Score" required>
</div>
<div class="form-group mb-3">
<label for="passed_year" class="form-label">Passed Year <span
class="text-danger">*</span></label>
<input type="text" class="form-control border border-light-subtle" id="passed_year"
name="passed_year" placeholder="Enter Passed Year" required>
</div>
@if ($setting->recaptcha_site_key)
<div class="form-group">
<div class="form-group mb-3">
<div id="g-recaptcha-response" class="g-recaptcha mb-2"
data-sitekey="{{ $setting->recaptcha_site_key }}"></div>
</div>
@endif
<button type="submit" class="btn-primary" id="submit">
<button type="submit" class="btn btn-dark w-100" id="submit">
Register
</button>
<div id="message-notification" class="text-success mt-3"></div>
<div id="message-notification" class="text-success mt-3 text-center"></div>
</form>
</div>
</div>
</div>
</div>
@ -880,33 +886,48 @@
</section>
<section class="section-padding bg-light">
<div class="container">
<h2 class="section-title text-center">
Testimonials
</h2>
<div class="row g-3">
@foreach ($success_stories as $story)
<div class="col-xl-3 col-lg-4 col-md-6 col-12">
<div class="visa-post">
@foreach (json_decode($story->extra_content) as $content)
<iframe width="100%" height="350" src="{{ $content->fieldHeader }}"
title="{{ $story->title }}" frameborder="0"
<!-- Successful Visa Grants -->
<section class="section-padding" style="background-color: #aeb5bb">
@foreach ($success_stories as $story)
<div class="container">
<h2 class="section-title text-center" style="color: #fc4e24">
Trusted by Many Testimonials
</h2>
<div class="row g-3">
@php
function convertToEmbedUrl($url)
{
$parsed = parse_url($url);
if (isset($parsed['query'])) {
parse_str($parsed['query'], $queryParams);
if (isset($queryParams['v'])) {
return 'https://www.youtube.com/embed/' . $queryParams['v'];
}
}
return $url; // fallback
}
@endphp
@foreach (json_decode($story->extra_content) as $content)
<div class="col-xl-3 col-lg-4 col-md-6 col-12">
<div class="visa-post">
<iframe width="100%" height="350"
src="{{ convertToEmbedUrl($content->fieldHeader) }}" title="video1" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
@endforeach
</div>
</div>
</div>
@endforeach
@endforeach
</div>
</div>
</div>
@endforeach
</section>
<!-- Benefits of choosing TEF -->
<section class="section-padding">
<section class="section-padding bg-light">
<div class="container">
<h2 class="section-title text-center">
Benefits
<h2 class="section-title text-center" style="color: #fc4e24">
Benefits of Choosing Us
</h2>
<div class="row g-4">
<!-- Benefit 1 -->
@ -914,7 +935,8 @@
@foreach (json_decode($tef->extra_content) as $content)
<div class="col-lg-3 col-md-6">
<div class="text-center">
<div class="benefit-icon mb-3" style="font-size: 2.5rem; color: #5291b6;">
<div class="benefit-icon mb-3"
style="font-size: 2.5rem; color: linear-gradient(to right, #e8171a 60%, #ffa21c 100%);">
{{ $content->fieldHeader }}
</div>
<h5 class="text-primary-custom">{{ $tef->title }}</h5>
@ -929,16 +951,16 @@
</div>
</section>
<section class="section-padding bg-light">
<section class="section-padding" style="background-color: #c1c8cf">
<div class="container">
<h2 class="section-title text-center">
Success Stories
<h2 class="section-title text-center" style="color: #fc4e24">
Our Success Stories
</h2>
<div class="row g-3">
@foreach ($visa_grants as $visas)
<div class="col-xl-3 col-lg-4 col-md-6 col-12">
<div class="visa-post">
<img src="{{ asset($visas->cover) }}" />
<img src="{{ asset($visas->cover) }}" width="400px" height="400px" />
</div>
</div>
@endforeach
@ -946,6 +968,73 @@
</div>
</section>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"
integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"
integrity="sha512-VEd+nq25CkR676O+pLBnDW09R7VQX9Mdiij052gVCp5yVH3jGtH70Ho/UUv4mJDsEdTvqRCFZg0NKGiojGnUCw=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script>
$(document).on("submit", "#enquiry-form", function(event) {
event.preventDefault();
const action = $(this).attr("action");
const url = new URL(window.location.href);
const isRecaptchaEnabled = !!"{{ $setting->recaptcha_site_key }}";
let formData = $(this).serializeArray();
if (isRecaptchaEnabled) {
formData.push({
name: 'g-recaptcha-response',
value: grecaptcha.getResponse()
});
}
$("#submit")
.html(`Submitting...`)
.attr("disabled", true);
$.ajax({
url: action,
type: "POST",
dataType: "json",
data: formData,
headers: {
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
},
success: function(response) {
if (response.status == 200) {
toastr.success(response.message);
document.getElementById("message-notification").innerHTML = response.message;
$("#enquiry-form")[0].reset();
}
},
error: function(xhr) {
if (xhr.status === 422 || xhr.status === 500) {
let errors = xhr.responseJSON.errors;
for (let key in errors) {
const errorMessage = errors[key][0];
toastr.error(errorMessage);
}
} else {
console.log(xhr.responseText);
}
},
complete: function() {
// grecaptcha.reset();
$("#submit").html(`<span>Register</span>`)
.attr("disabled", false);
form.reset();
}
});
});
</script>
</body>
</html>