Skip to content

Commit

Permalink
Merge pull request #1211 from Anushkam09/footers
Browse files Browse the repository at this point in the history 
Changed footer on home page
  • Loading branch information
@mansiruhil13
mansiruhil13 authored Nov 10, 2024
2 parents ae7e642 + 870c0e3 commit d0285f3
Showing 1 changed file with 64 additions and 48 deletions.
112 changes: 64 additions & 48 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -140,16 +140,20 @@

footer {
background-color: #C4D7FF;
color: #f3f4f6;
color: white;
text-align: center;
padding: 15px 0;
padding: 10px 0;
position: relative;
bottom: 0;
width: 100%;
}
footer a{
text-decoration: none;
color: #f3f4f6;

.social-icon {
transition: transform 0.3s ease;
/* Smooth transition effect */
}


.checkbtn {
font-size: 30px;
color: #333;
Expand Down Expand Up @@ -896,6 +900,51 @@ <h2>Contact Us</h2>


<!-- footer start here -->

<footer style=" color: #f3f4f6; text-align: center; width: 100%;">
<div style="background-color: #C4D7FF; color: #f3f4f6; ">
<div style="display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 1200px; margin: 0 auto;">
<div style="flex: 1; min-width: 200px; margin-bottom: 20px;">
<h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Quick Links</h3>
<ul style="list-style-type: none; padding: 0;">
<li><a href="about.html" style="color: #000000; text-decoration: none;">About Us</a></li>
<li><a href="contact.html" style="color: #000000; text-decoration: none;">Contact Us</a></li>
<li><a href="privacy.html" style="color: #000000; text-decoration: none;">Privacy Policy</a></li>
<li><a href="terms.html" style="color: #000000; text-decoration: none;">Terms of Service</a></li>
<li><a href="sitemap.html" style="color: #000000; text-decoration: none;">Site Map</a></li>
</ul>
</div>
<div style="flex: 1; min-width: 200px; margin-bottom: 10px;">
<h3 style="font-size: 1.5rem; color: #2980b9;">Contact Info</h3>
<p style="color: #000;">123 Emergency Lane, Mumbai, India</p>
<a href="mailto:emergency@ambulanceservice.in" style="color: #000000;">emergency@ambulanceservice.in</a></p>
<p style="color: #000000;">Phone: <a href="tel:+91-911-1234567" style="color: #000000;">+91-911-1234567</a>
</p>
</div>
<div style="text-align: center; min-width: 200px; color: black;">
<h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Follow Us</h3>
<div style="display: flex; justify-content: center; align-items: center; gap: 15px; height: 50px;">
<a href="https://www.facebook.com" class="social-icon facebook"
style="color: black; text-decoration: none; font-size: 1.5rem;"><i class="fab fa-facebook"></i></a>
<a href="https://www.twitter.com" class="social-icon twitter"
style="color: black; text-decoration: none; font-size: 1.5rem;"><i class="fa-brands fa-x-twitter"></i></a>
<a href="https://www.instagram.com" class="social-icon instagram"
style="color: black; text-decoration: none; font-size: 1.5rem;"><i class="fab fa-instagram"></i></a>
<a href="https://www.linkedin.com" class="social-icon linkedin"
style="color: black; text-decoration: none; font-size: 1.5rem;"><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
<div style="flex: 1; min-width: 200px; margin-bottom: 20px;">
<h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to Our Newsletter</h3>
<form action="#">
<input type="email" placeholder="Your Email"
style="padding: 10px; width: 80%; border: none; border-radius: 5px;" required><br><br>
<button type="submit"
style="background-color: #e81a1a; color: white; padding: 10px 20px; border: none; cursor: pointer; border-radius: 5px;">Subscribe</button>
</form>
</div>


<footer class="fot">

<div class="l1">
Expand Down Expand Up @@ -923,16 +972,9 @@ <h2 style="margin-left: 1vw;">Usefull link</h2>
<p style="margin-left: 3.5vw;"><a href="privacy.html">Privacy Policy</a></p>
<p style="margin-left: 4.5vw;"><a href="terms.html">Terms of Service</a></p>


</div>
<div class="l21">
<h2>Help Desk</h2>
<p><a href="contact.html">Support</a></p>
<p><a href="Contactus.html">Contact Us</a></p>
<p><a href="#faq-section">FAQ</a></p>
<p><a href="nearby.html">Near by</a></p>
<p><a href="contact.html">Phone</a></p>
</div>
</div>




Expand Down Expand Up @@ -971,35 +1013,15 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: darkorange;">

</div>
</div>

</div>
<hr>
<div
style="background-color: #C4D7FF; color: #000000; display: flex; justify-content: space-between; align-items: center; padding: 10px 20px;">
<strong>
<p>&copy; 2024 AmbuFlow. All rights reserved.</p>
</strong>
</div>
<script>
function showToast(message,type) {
const toast = document.getElementById('toast');
toast.textContent = message;
toast.style.display = "block"; // Show the toast
toast.style.backgroundColor = type==='success' ? 'green':'red'
toast.style.color = 'white';
setTimeout(() => {
toast.style.display = "none"; // Hide after 3 seconds
}, 3000);
}

document.getElementById('newsletter-form').addEventListener('submit', function (event) {
event.preventDefault(); // Prevent form submission
const emailInput = this.querySelector('input[type="email"]');
const email = emailInput.value;

// Basic email validation
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;

if (emailPattern.test(email)) {
showToast("Thank you for subscribing!",'success'); // Show success message
emailInput.value = ""; // Clear the input field
} else {
showToast("Please enter a valid email address.",'error'); // Show error message
}
});
</script>
</footer>


Expand Down Expand Up @@ -1120,12 +1142,6 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: darkorange;">
}
</style>







<a href="chatbot.html">
<div class="fixed bottom-0 right-2 chatbot-container">
<button class="chatbot-button group">
Expand Down

0 comments on commit d0285f3

Please sign in to comment.