mukeshs/keystone
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Almost updated

Browse Source
This commit is contained in:
mukesh13
2025-08-13 20:21:20 +05:30
parent c6629e4daa
commit a286215d0f
31 changed files with 1163 additions and 665 deletions
Download Patch File Download Diff File Expand all files Collapse all files

188
components/footers/Footer3.jsx
View File

@ -3,15 +3,18 @@ import React, { useEffect, useState } from "react";
import axios from "axios";
import Link from "next/link";
import Image from "next/image";
export default function Footer3() {
const [success, setSuccess] = useState(true);
const [showMessage, setShowMessage] = useState(false);
const handleShowMessage = () => {
setShowMessage(true);
setTimeout(() => {
setShowMessage(false);
}, 2000);
};
const sendEmail = async (e) => {
e.preventDefault(); // Prevent default form submission behavior
const email = e.target.email.value;
@ -39,6 +42,7 @@ export default function Footer3() {
e.target.reset(); // Reset the form
}
};
useEffect(() => {
const headings = document.querySelectorAll(".footer-heading-mobile");
@ -68,7 +72,7 @@ export default function Footer3() {
}, []); // Empty dependency array means this will run only once on mount
return (
<footer id="footer" className="footer style-2">
<footer id="footer" className="footer style-2" style={{ backgroundColor: '#272727' }}>
<div className="footer-wrap">
<div className="tf-container">
<div className="footer-body">
@ -76,144 +80,111 @@ export default function Footer3() {
<div className="col-lg-4">
<div className="footer-about">
<Link href={`/`} className="footer-logo">
<Image
alt="logo"
src="/images/logo/footer-logo-3.png"
width={390}
height={80}
/>
<svg
width="139.5"
height={40}
viewBox="0 0 140 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M18.2183 15.7033L29.395 34.7289C29.4936 34.8967 29.6741 34.9994 29.8687 34.9985L41.1397 34.9463C41.3308 34.9455 41.5075 34.8448 41.6058 34.6809L47.5 24.8527L35.944 24.8365C35.7518 24.8362 35.5738 24.7349 35.4754 24.5698L23.9713 5.2667C23.8727 5.10131 23.6944 5 23.5019 5L12.3005 5C12.1083 5 11.9302 5.10099 11.8315 5.26594L5.91087 15.1639L0.167756 24.7208C0.0644005 24.8928 0.0636223 25.1076 0.165723 25.2804L5.75222 34.7316C5.85055 34.8979 6.02941 35 6.22264 35L16.7708 35C17.1948 35 17.4573 34.538 17.2402 34.1738L5.91087 15.1639L17.276 15.1639C17.6635 15.1639 18.022 15.3691 18.2183 15.7033Z"
fill="white"
/>
<text
x="55"
y="30"
fontFamily="Arial, sans-serif"
fontSize="20"
fill="white"
>
Keystone
</text>
</svg>
</Link>
<div className="footer-info mb_51">
<a href="#" className="link text-body-2 text_dark">
<a href="#" className="link text-body-2" style={{ color: 'white' }}>
themesflat@gmail.com
</a>
<div className="text-body-2 text_dark">
<div className="text-body-2" style={{ color: 'white' }}>
No. 3A, 1st Floor, Balaji Nagar,<br />
Dharapadavedu, Vellore - 632007,<br />
Tamil Nadu, India
</div>
<div className="text-body-2 text_dark">+91 90954 50005</div>
<div className="text-body-2" style={{ color: 'white' }}>+91 90954 50005</div>
</div>
<div className="tf-social">
<a href="#" className="icon-twitter-x" />
<a href="#" className="icon-facebook-f" />
<a href="#" className="icon-github" />
<a href="#" className="icon-instagram" />
<a href="#" className="icon-youtube" />
<a href="#" className="icon-twitter-x" style={{ color: 'white' }} />
<a href="#" className="icon-facebook-f" style={{ color: 'white' }} />
<a href="#" className="icon-github" style={{ color: 'white' }} />
<a href="#" className="icon-instagram" style={{ color: 'white' }} />
<a href="#" className="icon-youtube" style={{ color: 'white' }} />
</div>
</div>
</div>
<div className="col-lg-2 col-md-6">
<div className="footer-col-block">
<h6 className="footer-heading footer-heading-mobile text_dark fw-6">
<h6 className="footer-heading footer-heading-mobile fw-6" style={{ color: 'white' }}>
Company
</h6>
<div className="tf-collapse-content">
<ul className="footer-menu-list">
<li className="text-body-2 text_mono-gray-5">
<Link href={`/#`} className="link footer-menu_item">
About Advitex
<li className="text-body-2">
<Link href={`/about`} className="link footer-menu_item" style={{ color: 'white' }}>
About Keystone
</Link>
</li>
<li className="text-body-2 text_mono-gray-5">
<li className="text-body-2">
<Link
href={`/contact-us`}
className="link footer-menu_item"
style={{ color: 'white' }}
>
Contact us
</Link>
</li>
<li className="text-body-2 text_mono-gray-5">
<Link
href={`/#`}
className="link footer-menu_item"
>
Portfolio
</Link>
</li>
<li className="text-body-2 text_mono-gray-5">
<Link href={`/#`} className="link footer-menu_item">
How We Work
</Link>
</li>
<li className="text-body-2 text_mono-gray-5">
<li className="text-body-2">
<Link href={`/career`} className="link footer-menu_item" style={{ color: 'white' }}>
Careers
</Link>
</li>
{/* <li className="text-body-2">
<Link
href={`/#`}
className="link footer-menu_item"
style={{ color: 'white' }}
>
Career
</Link>
</li>
<li className="text-body-2 text_mono-gray-5">
<Link href={`/#`} className="link footer-menu_item">
Our Team
</Link>
</li>
</li> */}
</ul>
</div>
</div>
</div>
<div className="col-lg-2 col-md-6">
<div>
<div className="footer-col-block">
<h6 className="footer-heading footer-heading-mobile text_dark fw-6">
Links
</h6>
<div className="tf-collapse-content">
<ul className="footer-menu-list">
<li className="text-body-2 text_mono-gray-5">
<Link
href={`/contact-us`}
className="link footer-menu_item"
>
Help Center
</Link>
</li>
<li className="text-body-2 text_mono-gray-5">
<Link
href={`/#`}
className="link footer-menu_item"
>
Privacy Policy
</Link>
</li>
<li className="text-body-2 text_mono-gray-5">
<a href="#" className="link footer-menu_item">
Term &amp; Conditon
</a>
</li>
<li className="text-body-2 text_mono-gray-5">
<Link
href={`/#`}
className="link footer-menu_item"
>
FAQs
</Link>
</li>
</ul>
</div>
</div>
</div>
{/* Links section commented out */}
</div>
<div className="col-lg-4">
<div className="footer-newsletter">
<h6 className="footer-heading text_dark fw-6">
Sign Up for Email
<h6 className="footer-heading fw-6" style={{ color: 'white' }}>
Contact Us
</h6>
<div className="tf-collapse-content">
<div className="wrap-newsletter">
<p className="text-body-2 text_mono-gray-5 mb_17">
Sign up to get first dibs on new arrivals, sales
<p className="text-body-2 mb_17" style={{ color: 'white' }}>
Get in touch with us for your data processing needs.
<br />
exclusive content, events and more!
We're here to help with your business requirements!
</p>
<div
className={`tfSubscribeMsg footer-sub-element ${showMessage ? "active" : ""
className={`tfSubscribeMsg footer-sub-element ${showMessage ? "active" : ""
}`}
>
{success ? (
<p style={{ color: "rgb(52, 168, 83)" }}>
You have successfully subscribed.
Your message has been sent successfully.
</p>
) : (
<p style={{ color: "red" }}>Something went wrong</p>
@ -240,6 +211,7 @@ export default function Footer3() {
placeholder="Enter your e-mail"
tabIndex={0}
aria-required="true"
style={{ backgroundColor: 'white', color: '#272727' }}
/>
</fieldset>
<div className="button-submit">
@ -248,19 +220,19 @@ export default function Footer3() {
className="subscribe-button tf-btn btn-dark"
type="submit"
>
<span>Subscribe</span>
<span>Submit</span>
<span className="bg-effect" />
</button>
</div>
<div className="icon">
<i className="icon-envelope-solid" />
<i className="icon-envelope-solid" style={{ color: 'white' }} />
</div>
</div>
<div id="subscribe-msg" className="subscribe-msg" />
</form>
<p className="description text-body-2 text_dark">
By subscribing, you accepted the our{" "}
<a href="#" className="link text_dark">
<p className="description text-body-2" style={{ color: 'white' }}>
By contacting us, you agree to our{" "}
<a href="#" className="link" style={{ color: 'white', textDecoration: 'underline' }}>
Privacy Policy
</a>
</p>
@ -272,38 +244,18 @@ export default function Footer3() {
</div>
</div>
</div>
<div className="footer-bottom">
<div className="footer-bottom" style={{ backgroundColor: '#1f1f1f', borderTop: '1px solid rgba(255,255,255,0.1)' }}>
<div className="tf-container">
<div className="row">
<div className="col-12">
<div className="wrapper d-flex align-items-center flex-wrap gap_12">
<p className="text-body-2">
<p className="text-body-2 m-0" style={{ color: 'white' }}>
© {new Date().getFullYear()} Copyright by{" "}
<a href="#" className="link-black text_primary text-body-3">
Themesflat
<a href="#" className="link-black text-body-3" style={{ color: 'white', fontWeight: '600' }}>
Keystone
</a>{" "}
. All Right Reserved.
. All Rights Reserved.
</p>
<ul className="right d-flex align-items-center">
<li>
<Link
href={`/pricing`}
className="link text_mono-gray-5 text-body-1"
>
Privacy Policy
</Link>
</li>
<li>
<a href="#" className="link text_mono-gray-5 text-body-1">
Terms of Services
</a>
</li>
<li>
<a href="#" className="link text_mono-gray-5 text-body-1">
Virtual Reality
</a>
</li>
</ul>
</div>
</div>
</div>
@ -311,4 +263,4 @@ export default function Footer3() {
</div>
</footer>
);
}
}