Files
theme-fc0ea5f8346d41dab29ce…/components/footer.hbs
2026-01-16 11:48:07 +00:00

193 lines
13 KiB
Handlebars

<footer id="ai-footer" class="cms-bg-dark cms-text-primary pt-12 pb-6 mt-12" data-hbs-id="kxocf97">
<div class="container mx-auto px-4 mb-12" data-hbs-id="k8wqag7">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 mx-auto" data-hbs-id="au1xi7s">
<!-- Company Info Section -->
<div data-hbs-id="4yyl58s">
<h3 class="text-white text-xl font-semibold mb-4" data-hbs-id="g0ddet8">About Us</h3>
<p class="text-white text-base leading-relaxed custom-footer_description" data-hbs-id="d0cclgo">
FasterHQ is a leading technology solutions provider dedicated to helping businesses streamline operations, enhance productivity, and achieve unprecedented growth. Since our founding in 2018, we've empowered over 500 companies worldwide with cutting-edge tools and strategies designed for the modern business landscape.
</p>
</div>
<!-- Newsletter Section -->
<div data-hbs-id="miga8k7">
<h3 class="text-white text-xl font-semibold mb-4" data-hbs-id="hpqc4xu">Stay Connected</h3>
<p class="text-white text-sm mb-4 opacity-90" data-hbs-id="3u0lmd3">Subscribe to our newsletter for the latest updates and insights.</p>
<form id="form_submit" class="flex flex-col sm:flex-row gap-3" data-members-form="" data-success-container=".success-container" data-hbs-id="2wpcwyu">
<div class="flex-grow relative" data-hbs-id="q67lef2">
<label class="sr-only" for="Email2" data-hbs-id="tzffgpn">Your email address</label>
<div class="relative" data-hbs-id="rvrjnui">
<input
id="Email2"
class="w-full cms-form-control input-field__input text-base px-4 py-4 pr-12 rounded-lg bg-white/10 border border-white/20 text-white placeholder-white/70 focus:outline-none focus:ring-2 focus:ring-white/30 focus:border-white/40 backdrop-blur-sm transition-all duration-300"
type="email"
name="Email"
placeholder="Enter your email address"
required
data-hbs-id="m23b1n1">
<div class="absolute right-3 top-1/2 transform -translate-y-1/2" data-hbs-id="9xq5u9s">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-white/50" fill="none" viewBox="0 0 24 24" stroke="currentColor" data-hbs-id="24fngms">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 12a4 4 0 10-8 0 4 4 0 008 0zm0 0v1.5a2.5 2.5 0 005 0V12a9 9 0 10-9 9m4.5-1.206a8.959 8.959 0 01-4.5 1.207" />
</svg>
</div>
</div>
</div>
<button
id="newsletterBtn"
class="cms-btn cms-bg-primary hover:cms-bg-accent text-white border-0 text-base font-semibold py-4 px-8 rounded-lg shadow-lg hover:shadow-xl transform hover:scale-105 transition-all duration-300 flex items-center justify-center group"
type="submit"
data-hbs-id="ncuzqnd">
<span class="default text-white flex items-center" data-hbs-id="yr6esag">
SUBSCRIBE
</span>
<span class="loader hidden" data-hbs-id="os7ijp0">
<svg class="animate-spin h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" data-hbs-id="ruj2qh6">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
</svg>
</span>
<span class="success hidden flex items-center" data-hbs-id="if4468f">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor" data-hbs-id="pvbjlo4">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
Subscribed!
</span>
</button>
</form>
</div>
</div>
</div>
<div class="cms-border-light pt-8" data-hbs-id="vkb0uca"></div>
<div class="container mx-auto px-4" data-hbs-id="qf79wcm">
<div class="flex flex-col md:flex-row justify-between items-center mb-8" data-hbs-id="71ycfpd">
<div class="mb-6 md:mb-0" data-hbs-id="hjj7vbd">
<img
alt="FasterHQ"
class="h-12 site-logo"
src="https://static.fasterhq.com/favicon.png"
data-hbs-id="ba6wmzf">
</div>
<div data-hbs-id="h306uxp">
<ul class="flex space-x-4" data-hbs-id="rk6i3ad">
<li data-hbs-id="04256ne">
<a href="#" target="_blank" aria-label="LinkedIn" class="custom-linkedin text-white hover:text-white transition-colors duration-200" data-hbs-id="clyqc2i">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-linkedin" data-hbs-id="hv69z4u">
<path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/>
<rect width="4" height="12" x="2" y="9"/>
<circle cx="4" cy="4" r="2"/>
</svg>
</a>
</li>
<li data-hbs-id="f2pbl5a">
<a href="#" target="_blank" aria-label="Twitter" class="custom-twitter text-white hover:text-white transition-colors duration-200" data-hbs-id="108hel4">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-twitter" data-hbs-id="f0zt33n">
<path d="M22 4s-.7 2.1-2 3.4c1.6 10-9.4 17.3-18 11.6 2.2.1 4.4-.6 6-2C3 15.5.5 9.6 3 5c2.2 2.6 5.6 4.1 9 4-.9-4.2 4-6.6 7-3.8 1.1 0 3-1.2 3-1.2z"/>
</svg>
</a>
</li>
<li data-hbs-id="61x9gvw">
<a href="#" target="_blank" aria-label="Facebook" class="custom-facebook text-white hover:text-white transition-colors duration-200" data-hbs-id="acvnc13">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-facebook" data-hbs-id="9oob4ii">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/>
</svg>
</a>
</li>
<li data-hbs-id="mq5q678">
<a href="#" target="_blank" aria-label="YouTube" class="custom-youtube text-white hover:text-white transition-colors duration-200" data-hbs-id="2zk50ha">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-youtube" data-hbs-id="stu7he2">
<path d="M2.5 17a24.12 24.12 0 0 1 0-10 2 2 0 0 1 1.4-1.4 49.56 49.56 0 0 1 16.2 0A2 2 0 0 1 21.5 7a24.12 24.12 0 0 1 0 10 2 2 0 0 1-1.4 1.4 49.55 49.55 0 0 1-16.2 0A2 2 0 0 1 2.5 17"/>
<path d="m10 15 5-3-5-3z"/>
</svg>
</a>
</li>
<li data-hbs-id="dothzfo">
<a href="#" target="_blank" aria-label="Instagram" class="custom-instagram text-white hover:text-white transition-colors duration-200" data-hbs-id="yqvvtk3">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-instagram" data-hbs-id="r4l9wob">
<rect width="20" height="20" x="2" y="2" rx="5" ry="5"/>
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/>
<line x1="17.5" x2="17.51" y1="6.5" y2="6.5"/>
</svg>
</a>
</li>
</ul>
</div>
</div>
<div class="grid grid-cols-1 lg:grid-cols-5 gap-8" data-hbs-id="5tnjh2y">
<div class="lg:col-span-4" data-hbs-id="ymqk8xa">
<ul class="site-secondary_navigation grid grid-cols-2 md:grid-cols-4 gap-8" data-hbs-id="9yzu2kt">
<li class="footer-nav-item has-submenu dummy" data-hbs-id="zv9wz59">
<a href="" class="text-white footer-nav-link font-medium mb-3 text-sm uppercase tracking-wider" data-hbs-id="34so850">Support</a>
<ul class="space-y-2 mt-2 footer-dropdown-menu" data-hbs-id="fa04we0">
<li data-hbs-id="7n7dkb7"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="6r9qdog">Help Center</a></li>
<li data-hbs-id="4nlbj4c"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="jr7vzn4">FAQ</a></li>
<li data-hbs-id="3wjiclj"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="s6lpuod">Contact Us</a></li>
</ul>
</li>
<li class="footer-nav-item has-submenu dummy" data-hbs-id="rxuwnqn">
<a href="" class="text-white footer-nav-link font-medium mb-3 text-sm uppercase tracking-wider" data-hbs-id="2ezmxl0">Legal</a>
<ul class="space-y-2 mt-2 footer-dropdown-menu" data-hbs-id="qqiz2ol">
<li data-hbs-id="7u4m3zp"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="xi0l2fj">Terms of Service</a></li>
<li data-hbs-id="6tk0awb"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="o9kc7nc">Privacy Policy</a></li>
<li data-hbs-id="820o7xm"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="qfhvf3w">Cookie Policy</a></li>
</ul>
</li>
<li class="footer-nav-item has-submenu dummy" data-hbs-id="s4o9dvn">
<a href="" class="text-white footer-nav-link font-medium mb-3 text-sm uppercase tracking-wider" data-hbs-id="j4zyipp">Company</a>
<ul class="space-y-2 mt-2 footer-dropdown-menu" data-hbs-id="4hdxtx6">
<li data-hbs-id="u6irx16"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="nrqdkpv">Blog</a></li>
<li data-hbs-id="pgomn7u"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="5z9t1rl">Press</a></li>
<li data-hbs-id="0kxephg"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="19p5jny">Partners</a></li>
</ul>
</li>
<li class="footer-nav-item has-submenu dummy" data-hbs-id="zr6czwz">
<a href="" class="text-white footer-nav-link font-medium mb-3 text-sm uppercase tracking-wider" data-hbs-id="kq1amr6">Get in Touch</a>
<ul class="space-y-2 mt-2 footer-dropdown-menu" data-hbs-id="l7ukokd">
<li data-hbs-id="yoosu81"><a href="/" class="text-white hover:cms-text-primary transition-colors duration-200 text-sm" data-hbs-id="nyhxnqs">Contact Us</a></li>
</ul>
</li>
</ul>
</div>
<div class="lg:col-span-1 flex flex-col items-start lg:items-end justify-end" data-hbs-id="txke8ag">
<p class="text-white text-sm custom-footer_copyright_text mb-4 lg:mb-0" data-hbs-id="m1aqw2q">© 2025 FasterHQ. All rights reserved.</p>
</div>
</div>
</div>
</footer>
<script>
document.addEventListener('DOMContentLoaded', function() {
const form = document.getElementById('form_submit');
const button = document.getElementById('newsletterBtn');
const defaultText = button.querySelector('.default');
const loader = button.querySelector('.loader');
const success = button.querySelector('.success');
form.addEventListener('submit', function(event) {
event.preventDefault();
defaultText.classList.add('hidden');
loader.classList.remove('hidden');
setTimeout(() => {
loader.classList.add('hidden');
success.classList.remove('hidden');
form.reset();
setTimeout(() => {
success.classList.add('hidden');
defaultText.classList.remove('hidden');
}, 3000);
}, 1500);
});
});
</script>