Spaces:
Running
Running
Make sure the FAQ setction is functional, meaning the drop down arrows reveal the intended content. Ensure the get started today button in the CTA section is working. Link the text under serves and quick links in the footer to the corresponding parts on the page. Add Housesitting under services and link this as well. Link the privacy policy and terms of service to their pages. Redo the format of the footer so that it feels more natural do not add social media or newsletter icons.
Browse files- index.html +98 -31
index.html
CHANGED
|
@@ -445,55 +445,111 @@
|
|
| 445 |
<!-- Footer -->
|
| 446 |
<footer class="bg-gray-900 text-white py-12">
|
| 447 |
<div class="container mx-auto px-6">
|
| 448 |
-
<div class="grid grid-cols-1 md:grid-cols-
|
| 449 |
-
<div>
|
| 450 |
<div class="flex items-center mb-6">
|
| 451 |
<i data-feather="paw" class="text-primary h-8 w-8 mr-2"></i>
|
| 452 |
<span class="font-hand text-2xl text-primary">Florida Dog Sitting</span>
|
| 453 |
-
</div>
|
| 454 |
-
<p class="text-gray-400">Premium dog sitting services in the beautiful Florida Keys where every tail gets a tropical treat!</p>
|
| 455 |
-
|
| 456 |
-
|
| 457 |
-
<div>
|
| 458 |
-
<h4 class="text-lg font-bold mb-4">Services</h4>
|
| 459 |
-
<ul class="space-y-2">
|
| 460 |
-
<li><a href="#services" class="text-gray-400 hover:text-primary transition">In-Home Sitting</a></li>
|
| 461 |
-
<li><a href="#services" class="text-gray-400 hover:text-primary transition">Drop In's</a></li>
|
| 462 |
-
<li><a href="#services" class="text-gray-400 hover:text-primary transition">Adventure Walks</a></li>
|
| 463 |
-
</ul>
|
| 464 |
</div>
|
| 465 |
|
| 466 |
-
<div>
|
| 467 |
-
<h4 class="text-lg font-bold mb-4">
|
| 468 |
-
|
| 469 |
-
|
| 470 |
-
|
| 471 |
-
|
| 472 |
-
<
|
| 473 |
-
<li><a href="#
|
| 474 |
-
</
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 475 |
</div>
|
| 476 |
|
| 477 |
-
|
| 478 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 479 |
</div>
|
| 480 |
</div>
|
|
|
|
| 481 |
|
| 482 |
<div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 483 |
<p class="text-gray-400 text-sm mb-4 md:mb-0">© 2023 Paws & Palms Paradise. All rights reserved.</p>
|
| 484 |
-
|
| 485 |
-
|
| 486 |
-
|
|
|
|
|
|
|
| 487 |
</div>
|
| 488 |
-
</div>
|
| 489 |
</div>
|
| 490 |
</footer>
|
| 491 |
</div>
|
| 492 |
-
|
| 493 |
<script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 494 |
// Vanta.js Background
|
| 495 |
VANTA.WAVES({
|
| 496 |
-
|
| 497 |
mouseControls: true,
|
| 498 |
touchControls: true,
|
| 499 |
gyroControls: false,
|
|
@@ -507,9 +563,20 @@
|
|
| 507 |
waveSpeed: 0.80,
|
| 508 |
zoom: 0.75
|
| 509 |
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 510 |
|
| 511 |
// Mobile Menu Toggle
|
| 512 |
-
|
| 513 |
const mobileMenu = document.getElementById('mobile-menu');
|
| 514 |
|
| 515 |
menuBtn.addEventListener('click', () => {
|
|
|
|
| 445 |
<!-- Footer -->
|
| 446 |
<footer class="bg-gray-900 text-white py-12">
|
| 447 |
<div class="container mx-auto px-6">
|
| 448 |
+
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
| 449 |
+
<div class="md:col-span-1">
|
| 450 |
<div class="flex items-center mb-6">
|
| 451 |
<i data-feather="paw" class="text-primary h-8 w-8 mr-2"></i>
|
| 452 |
<span class="font-hand text-2xl text-primary">Florida Dog Sitting</span>
|
| 453 |
+
</div>
|
| 454 |
+
<p class="text-gray-400 mb-4">Premium dog sitting services in the beautiful Florida Keys where every tail gets a tropical treat!</p>
|
| 455 |
+
<p class="text-gray-400 text-sm">© 2023 Florida Dog Sitting. All rights reserved.</p>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 456 |
</div>
|
| 457 |
|
| 458 |
+
<div class="md:col-span-1">
|
| 459 |
+
<h4 class="text-lg font-bold mb-4 text-white">Our Services</h4>
|
| 460 |
+
<ul class="space-y-3">
|
| 461 |
+
<li><a href="#services" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 462 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 463 |
+
<span>In-Home Sitting</span>
|
| 464 |
+
</a></li>
|
| 465 |
+
<li><a href="#services" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 466 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 467 |
+
<span>Drop In's</span>
|
| 468 |
+
</a></li>
|
| 469 |
+
<li><a href="#services" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 470 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 471 |
+
<span>Adventure Walks</span>
|
| 472 |
+
</a></li>
|
| 473 |
+
<li><a href="#services" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 474 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 475 |
+
<span>House Sitting</span>
|
| 476 |
+
</a></li>
|
| 477 |
+
</ul>
|
| 478 |
</div>
|
| 479 |
|
| 480 |
+
<div class="md:col-span-1">
|
| 481 |
+
<h4 class="text-lg font-bold mb-4 text-white">Quick Links</h4>
|
| 482 |
+
<ul class="space-y-3">
|
| 483 |
+
<li><a href="#about" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 484 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 485 |
+
<span>About Us</span>
|
| 486 |
+
</a></li>
|
| 487 |
+
<li><a href="#testimonials" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 488 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 489 |
+
<span>Testimonials</span>
|
| 490 |
+
</a></li>
|
| 491 |
+
<li><a href="#faq" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 492 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 493 |
+
<span>FAQ</span>
|
| 494 |
+
</a></li>
|
| 495 |
+
<li><a href="#contact" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 496 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 497 |
+
<span>Contact</span>
|
| 498 |
+
</a></li>
|
| 499 |
+
<li><a href="privacy-policy.html" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 500 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 501 |
+
<span>Privacy Policy</span>
|
| 502 |
+
</a></li>
|
| 503 |
+
<li><a href="terms-conditions.html" class="text-gray-400 hover:text-primary transition flex items-start">
|
| 504 |
+
<i data-feather="chevron-right" class="text-primary mr-2 h-4 w-4 mt-0.5"></i>
|
| 505 |
+
<span>Terms & Conditions</span>
|
| 506 |
+
</a></li>
|
| 507 |
+
</ul>
|
| 508 |
</div>
|
| 509 |
</div>
|
| 510 |
+
</div>
|
| 511 |
|
| 512 |
<div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 513 |
<p class="text-gray-400 text-sm mb-4 md:mb-0">© 2023 Paws & Palms Paradise. All rights reserved.</p>
|
| 514 |
+
<div class="flex space-x-4">
|
| 515 |
+
<a href="privacy-policy.html" class="text-gray-400 hover:text-primary text-sm transition">Privacy Policy</a>
|
| 516 |
+
<span class="text-gray-600">|</span>
|
| 517 |
+
<a href="terms-conditions.html" class="text-gray-400 hover:text-primary text-sm transition">Terms & Conditions</a>
|
| 518 |
+
</div>
|
| 519 |
</div>
|
|
|
|
| 520 |
</div>
|
| 521 |
</footer>
|
| 522 |
</div>
|
|
|
|
| 523 |
<script>
|
| 524 |
+
// FAQ accordion functionality
|
| 525 |
+
document.querySelectorAll('.faq-btn').forEach(button => {
|
| 526 |
+
button.addEventListener('click', () => {
|
| 527 |
+
const content = button.nextElementSibling;
|
| 528 |
+
const icon = button.querySelector('i');
|
| 529 |
+
|
| 530 |
+
// Toggle content visibility
|
| 531 |
+
content.classList.toggle('hidden');
|
| 532 |
+
|
| 533 |
+
// Rotate icon
|
| 534 |
+
if (content.classList.contains('hidden')) {
|
| 535 |
+
icon.style.transform = 'rotate(0deg)';
|
| 536 |
+
} else {
|
| 537 |
+
icon.style.transform = 'rotate(180deg)';
|
| 538 |
+
}
|
| 539 |
+
});
|
| 540 |
+
});
|
| 541 |
+
|
| 542 |
+
// CTA button scroll to contact
|
| 543 |
+
document.getElementById('cta-scroll').addEventListener('click', (e) => {
|
| 544 |
+
e.preventDefault();
|
| 545 |
+
document.getElementById('contact').scrollIntoView({
|
| 546 |
+
behavior: 'smooth'
|
| 547 |
+
});
|
| 548 |
+
});
|
| 549 |
+
|
| 550 |
// Vanta.js Background
|
| 551 |
VANTA.WAVES({
|
| 552 |
+
el: "#vanta-bg",
|
| 553 |
mouseControls: true,
|
| 554 |
touchControls: true,
|
| 555 |
gyroControls: false,
|
|
|
|
| 563 |
waveSpeed: 0.80,
|
| 564 |
zoom: 0.75
|
| 565 |
});
|
| 566 |
+
// Close other FAQs when opening one
|
| 567 |
+
document.querySelectorAll('.faq-btn').forEach(button => {
|
| 568 |
+
button.addEventListener('click', () => {
|
| 569 |
+
document.querySelectorAll('.faq-content').forEach(content => {
|
| 570 |
+
if (content !== button.nextElementSibling) {
|
| 571 |
+
content.classList.add('hidden');
|
| 572 |
+
content.previousElementSibling.querySelector('i').style.transform = 'rotate(0deg)';
|
| 573 |
+
}
|
| 574 |
+
});
|
| 575 |
+
});
|
| 576 |
+
});
|
| 577 |
|
| 578 |
// Mobile Menu Toggle
|
| 579 |
+
const menuBtn = document.getElementById('menu-btn');
|
| 580 |
const mobileMenu = document.getElementById('mobile-menu');
|
| 581 |
|
| 582 |
menuBtn.addEventListener('click', () => {
|