Footer Updated & Contact form integration updated
This commit is contained in:
parent
2f799e045b
commit
0b0429de10
@ -19,8 +19,7 @@ export default function Footer2({ }) {
|
|||||||
<div className="pd_bottom_35" />
|
<div className="pd_bottom_35" />
|
||||||
{/*-============spacing==========-*/}
|
{/*-============spacing==========-*/}
|
||||||
<div className="position-relative color_white">
|
<div className="position-relative color_white">
|
||||||
Sed ut perspiciatis omnis laudantium natus errors voluptatem accusantium
|
Move your stuff in a ZIP
|
||||||
doloremque laudantium totam
|
|
||||||
</div>
|
</div>
|
||||||
<div className="logo_box">
|
<div className="logo_box">
|
||||||
<Link href="#" className="logo navbar-brand">
|
<Link href="#" className="logo navbar-brand">
|
||||||
@ -38,7 +37,7 @@ export default function Footer2({ }) {
|
|||||||
</div>
|
</div>
|
||||||
<div className="social-icons">
|
<div className="social-icons">
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
{/* <li>
|
||||||
<Link href="#" className="m_icon">
|
<Link href="#" className="m_icon">
|
||||||
<i className="fab fa-facebook" />
|
<i className="fab fa-facebook" />
|
||||||
</Link>
|
</Link>
|
||||||
@ -52,7 +51,7 @@ export default function Footer2({ }) {
|
|||||||
<Link href="#" className="m_icon">
|
<Link href="#" className="m_icon">
|
||||||
<i className="fab fa-skype" />
|
<i className="fab fa-skype" />
|
||||||
</Link>
|
</Link>
|
||||||
</li>
|
</li> */}
|
||||||
<li>
|
<li>
|
||||||
<Link href="#" className="m_icon">
|
<Link href="#" className="m_icon">
|
||||||
<i className="fab fa-instagram" />
|
<i className="fab fa-instagram" />
|
||||||
@ -67,7 +66,7 @@ export default function Footer2({ }) {
|
|||||||
<div className="col-lg-6">
|
<div className="col-lg-6">
|
||||||
<div className="footer_widgets_box pd_bottom_30">
|
<div className="footer_widgets_box pd_bottom_30">
|
||||||
<div className="fwidget_title">
|
<div className="fwidget_title">
|
||||||
<h2 className="title color_white"> Services </h2>
|
<h2 className="title color_white"> Areas we serve </h2>
|
||||||
{/*-============spacing==========-*/}
|
{/*-============spacing==========-*/}
|
||||||
<div className="pd_bottom_25" />
|
<div className="pd_bottom_25" />
|
||||||
{/*-============spacing==========-*/}
|
{/*-============spacing==========-*/}
|
||||||
@ -80,7 +79,7 @@ export default function Footer2({ }) {
|
|||||||
<i className="fi-rr-arrow-small-right color_white" />
|
<i className="fi-rr-arrow-small-right color_white" />
|
||||||
</div>
|
</div>
|
||||||
<Link className="links color_white" href="#">
|
<Link className="links color_white" href="#">
|
||||||
House Insurance
|
Greater Toronto Area
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
@ -90,7 +89,7 @@ export default function Footer2({ }) {
|
|||||||
<i className="fi-rr-arrow-small-right color_white" />
|
<i className="fi-rr-arrow-small-right color_white" />
|
||||||
</div>
|
</div>
|
||||||
<Link className="links color_white" href="#">
|
<Link className="links color_white" href="#">
|
||||||
Medical Insurance
|
Greater Hamilton Area
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
@ -100,47 +99,8 @@ export default function Footer2({ }) {
|
|||||||
<i className="fi-rr-arrow-small-right color_white" />
|
<i className="fi-rr-arrow-small-right color_white" />
|
||||||
</div>
|
</div>
|
||||||
<Link className="links color_white" href="#">
|
<Link className="links color_white" href="#">
|
||||||
Car Insurance
|
Kitchener-Waterloo-
|
||||||
</Link>
|
Cambridge Area
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
Business Insurance
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
Travel Insurance
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
Fire Insurance
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
Marrige Insurance
|
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
@ -163,61 +123,21 @@ export default function Footer2({ }) {
|
|||||||
<div className="icon trans">
|
<div className="icon trans">
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
<i className="fi-rr-arrow-small-right color_white" />
|
||||||
</div>
|
</div>
|
||||||
<Link className="links color_white" href="#">
|
<Link className="links color_white" href="/about-us">
|
||||||
My Account
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
Need A Career?
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
News & Blog
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
Payment Way
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
Team Member
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div className="d-flex align-items-center">
|
|
||||||
<div className="icon trans">
|
|
||||||
<i className="fi-rr-arrow-small-right color_white" />
|
|
||||||
</div>
|
|
||||||
<Link className="links color_white" href="#">
|
|
||||||
About Us
|
About Us
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
|
<li>
|
||||||
|
<div className="d-flex align-items-center">
|
||||||
|
<div className="icon trans">
|
||||||
|
<i className="fi-rr-arrow-small-right color_white" />
|
||||||
|
</div>
|
||||||
|
<Link className="links color_white" href="/faqs">
|
||||||
|
FAQ
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -234,7 +154,8 @@ export default function Footer2({ }) {
|
|||||||
</div>
|
</div>
|
||||||
<div className="bottom_content">
|
<div className="bottom_content">
|
||||||
<div className="color_white position_p_relative">
|
<div className="color_white position_p_relative">
|
||||||
Sed ut perspiciatis unde omniste natus errors volupta accus
|
Drop your email to learn about our
|
||||||
|
new services and promotions
|
||||||
</div>
|
</div>
|
||||||
{/*-============spacing==========-*/}
|
{/*-============spacing==========-*/}
|
||||||
<div className="pd_bottom_25" />
|
<div className="pd_bottom_25" />
|
||||||
@ -253,11 +174,13 @@ export default function Footer2({ }) {
|
|||||||
{/*-============spacing==========-*/}
|
{/*-============spacing==========-*/}
|
||||||
</div>
|
</div>
|
||||||
<div className="d-flex align-items-center contact_header_one">
|
<div className="d-flex align-items-center contact_header_one">
|
||||||
<div className="icon_s">
|
{/* <div className="icon_s">
|
||||||
<i className=" fi-rr-headphones" /></div>
|
<i className=" fi-rr-headphones" /></div> */}
|
||||||
<div className="content">
|
<div className="content">
|
||||||
<h6 className="tite color_white">Need Help?</h6>
|
<h6 className="tite color_white">Need Help?</h6>
|
||||||
<div className="title_20"><Link href="tel:+000(123)45688" className="color_white">+000(123)456 88</Link>
|
<div className="title_20">
|
||||||
|
<Link href="mailto:info@zipvan.ca" className="color_white mb-2">info@zipvan.ca</Link>
|
||||||
|
<Link href="tel:(647) 360-2075" className="color_white">(647) 360-2075</Link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -273,23 +196,26 @@ export default function Footer2({ }) {
|
|||||||
<section className="mottom_content position-relative z_99">
|
<section className="mottom_content position-relative z_99">
|
||||||
<div className="auto-container">
|
<div className="auto-container">
|
||||||
<div className="row align-items-center">
|
<div className="row align-items-center">
|
||||||
<div className="col-lg-6 col-md-6 col-sm-12">
|
<div className="col-lg-7 col-md-6 col-sm-12">
|
||||||
<div className="position-relative">
|
<div className="position-relative">
|
||||||
<ul className="list_box linline">
|
<ul className="list_box linline">
|
||||||
<li>
|
<li>
|
||||||
<div className="d-flex align-items-center">
|
<div className="d-flex align-items-center">
|
||||||
<div className="icon trans">
|
<div className="icon trans me-2">
|
||||||
<img src="/assets/images/shield.svg" className="img-fluid" alt="img" />
|
<img src="/assets/images/shield.svg" className="img-fluid" alt="img" />
|
||||||
</div>
|
</div>
|
||||||
<Link className="links color_white" href="#">
|
<span className="links color_white mb-0">
|
||||||
Copyright {new Date().getFullYear()}, Vankine. All Rights Reserved
|
Copyright 2025 © ZipVan. Powered by{" "}
|
||||||
</Link>
|
<Link href="https://metatroncubesolutions.com/" target="_blank" className="bold">
|
||||||
|
MetatronCube
|
||||||
|
</Link>. All Rights Reserved.
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-lg-6 col-md-6 col-sm-12 text-md-end">
|
<div className="col-lg-5 col-md-6 col-sm-12 text-md-end">
|
||||||
<div className="position-relative">
|
<div className="position-relative">
|
||||||
<ul className="list_box color_one linline">
|
<ul className="list_box color_one linline">
|
||||||
<li>
|
<li>
|
||||||
@ -298,7 +224,7 @@ export default function Footer2({ }) {
|
|||||||
<i className=" fi-rr-clock" />
|
<i className=" fi-rr-clock" />
|
||||||
</div>
|
</div>
|
||||||
<Link className="links color_white" href="#">
|
<Link className="links color_white" href="#">
|
||||||
Working Hours : Sun-monday, 09am-5pm
|
Working Hours : 24/7 365 Days a Year
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
@ -308,9 +234,7 @@ export default function Footer2({ }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="pd_bottom_50" />
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="patter_bottom">
|
<div className="patter_bottom">
|
||||||
<img src="/assets/images/shape/wave-pattern-1.png" className="img-fluid" alt="img" />
|
<img src="/assets/images/shape/wave-pattern-1.png" className="img-fluid" alt="img" />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
138
package-lock.json
generated
138
package-lock.json
generated
@ -8,6 +8,7 @@
|
|||||||
"name": "name",
|
"name": "name",
|
||||||
"version": "2.1.0",
|
"version": "2.1.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"axios": "^1.11.0",
|
||||||
"eslint": "8.40.0",
|
"eslint": "8.40.0",
|
||||||
"eslint-config-next": "13.4.1",
|
"eslint-config-next": "13.4.1",
|
||||||
"isotope-layout": "^3.0.6",
|
"isotope-layout": "^3.0.6",
|
||||||
@ -15,6 +16,7 @@
|
|||||||
"react": "18.2.0",
|
"react": "18.2.0",
|
||||||
"react-countup": "^6.4.2",
|
"react-countup": "^6.4.2",
|
||||||
"react-dom": "18.2.0",
|
"react-dom": "18.2.0",
|
||||||
|
"react-google-recaptcha": "^3.1.0",
|
||||||
"react-modal-video": "^2.0.0",
|
"react-modal-video": "^2.0.0",
|
||||||
"react-scroll-trigger": "^0.6.14",
|
"react-scroll-trigger": "^0.6.14",
|
||||||
"react-slick": "^0.29.0",
|
"react-slick": "^0.29.0",
|
||||||
@ -1360,6 +1362,12 @@
|
|||||||
"node": ">= 0.4"
|
"node": ">= 0.4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/asynckit": {
|
||||||
|
"version": "0.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
|
||||||
|
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
|
||||||
|
"license": "MIT"
|
||||||
|
},
|
||||||
"node_modules/available-typed-arrays": {
|
"node_modules/available-typed-arrays": {
|
||||||
"version": "1.0.7",
|
"version": "1.0.7",
|
||||||
"resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
|
"resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
|
||||||
@ -1384,6 +1392,17 @@
|
|||||||
"node": ">=4"
|
"node": ">=4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/axios": {
|
||||||
|
"version": "1.11.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/axios/-/axios-1.11.0.tgz",
|
||||||
|
"integrity": "sha512-1Lx3WLFQWm3ooKDYZD1eXmoGO9fxYQjrycfHFC8P0sCfQVXyROp0p9PFWBehewBOdCwHc+f/b8I0fMto5eSfwA==",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"follow-redirects": "^1.15.6",
|
||||||
|
"form-data": "^4.0.4",
|
||||||
|
"proxy-from-env": "^1.1.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/axobject-query": {
|
"node_modules/axobject-query": {
|
||||||
"version": "4.1.0",
|
"version": "4.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
|
||||||
@ -1575,6 +1594,18 @@
|
|||||||
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
|
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/combined-stream": {
|
||||||
|
"version": "1.0.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
|
||||||
|
"integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"delayed-stream": "~1.0.0"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 0.8"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/concat-map": {
|
"node_modules/concat-map": {
|
||||||
"version": "0.0.1",
|
"version": "0.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
|
||||||
@ -1732,6 +1763,15 @@
|
|||||||
"url": "https://github.com/sponsors/ljharb"
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/delayed-stream": {
|
||||||
|
"version": "1.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
|
||||||
|
"integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
|
||||||
|
"license": "MIT",
|
||||||
|
"engines": {
|
||||||
|
"node": ">=0.4.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/desandro-matches-selector": {
|
"node_modules/desandro-matches-selector": {
|
||||||
"version": "2.0.2",
|
"version": "2.0.2",
|
||||||
"resolved": "https://registry.npmjs.org/desandro-matches-selector/-/desandro-matches-selector-2.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/desandro-matches-selector/-/desandro-matches-selector-2.0.2.tgz",
|
||||||
@ -2547,6 +2587,26 @@
|
|||||||
"integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==",
|
"integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==",
|
||||||
"license": "ISC"
|
"license": "ISC"
|
||||||
},
|
},
|
||||||
|
"node_modules/follow-redirects": {
|
||||||
|
"version": "1.15.11",
|
||||||
|
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.11.tgz",
|
||||||
|
"integrity": "sha512-deG2P0JfjrTxl50XGCDyfI97ZGVCxIpfKYmfyrQ54n5FO/0gfIES8C/Psl6kWVDolizcaaxZJnTS0QSMxvnsBQ==",
|
||||||
|
"funding": [
|
||||||
|
{
|
||||||
|
"type": "individual",
|
||||||
|
"url": "https://github.com/sponsors/RubenVerborgh"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"license": "MIT",
|
||||||
|
"engines": {
|
||||||
|
"node": ">=4.0"
|
||||||
|
},
|
||||||
|
"peerDependenciesMeta": {
|
||||||
|
"debug": {
|
||||||
|
"optional": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/for-each": {
|
"node_modules/for-each": {
|
||||||
"version": "0.3.5",
|
"version": "0.3.5",
|
||||||
"resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
|
"resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
|
||||||
@ -2562,6 +2622,22 @@
|
|||||||
"url": "https://github.com/sponsors/ljharb"
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/form-data": {
|
||||||
|
"version": "4.0.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.4.tgz",
|
||||||
|
"integrity": "sha512-KrGhL9Q4zjj0kiUt5OO4Mr/A/jlI2jDYs5eHBpYHPcBEVSiipAvn2Ko2HnPe20rmcuuvMHNdZFp+4IlGTMF0Ow==",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"asynckit": "^0.4.0",
|
||||||
|
"combined-stream": "^1.0.8",
|
||||||
|
"es-set-tostringtag": "^2.1.0",
|
||||||
|
"hasown": "^2.0.2",
|
||||||
|
"mime-types": "^2.1.12"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 6"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/fs.realpath": {
|
"node_modules/fs.realpath": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
|
||||||
@ -2867,6 +2943,15 @@
|
|||||||
"node": ">= 0.4"
|
"node": ">= 0.4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/hoist-non-react-statics": {
|
||||||
|
"version": "3.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
|
||||||
|
"integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
|
||||||
|
"license": "BSD-3-Clause",
|
||||||
|
"dependencies": {
|
||||||
|
"react-is": "^16.7.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/ignore": {
|
"node_modules/ignore": {
|
||||||
"version": "5.3.2",
|
"version": "5.3.2",
|
||||||
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
|
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
|
||||||
@ -3579,6 +3664,27 @@
|
|||||||
"node": ">=8.6"
|
"node": ">=8.6"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/mime-db": {
|
||||||
|
"version": "1.52.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
|
||||||
|
"integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
|
||||||
|
"license": "MIT",
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 0.6"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/mime-types": {
|
||||||
|
"version": "2.1.35",
|
||||||
|
"resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
|
||||||
|
"integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"mime-db": "1.52.0"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">= 0.6"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/minimatch": {
|
"node_modules/minimatch": {
|
||||||
"version": "3.1.2",
|
"version": "3.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
|
||||||
@ -4030,6 +4136,12 @@
|
|||||||
"react-is": "^16.13.1"
|
"react-is": "^16.13.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/proxy-from-env": {
|
||||||
|
"version": "1.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
|
||||||
|
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
|
||||||
|
"license": "MIT"
|
||||||
|
},
|
||||||
"node_modules/punycode": {
|
"node_modules/punycode": {
|
||||||
"version": "2.3.1",
|
"version": "2.3.1",
|
||||||
"resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
|
"resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
|
||||||
@ -4071,6 +4183,19 @@
|
|||||||
"node": ">=0.10.0"
|
"node": ">=0.10.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/react-async-script": {
|
||||||
|
"version": "1.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-async-script/-/react-async-script-1.2.0.tgz",
|
||||||
|
"integrity": "sha512-bCpkbm9JiAuMGhkqoAiC0lLkb40DJ0HOEJIku+9JDjxX3Rcs+ztEOG13wbrOskt3n2DTrjshhaQ/iay+SnGg5Q==",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"hoist-non-react-statics": "^3.3.0",
|
||||||
|
"prop-types": "^15.5.0"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": ">=16.4.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/react-countup": {
|
"node_modules/react-countup": {
|
||||||
"version": "6.5.3",
|
"version": "6.5.3",
|
||||||
"resolved": "https://registry.npmjs.org/react-countup/-/react-countup-6.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/react-countup/-/react-countup-6.5.3.tgz",
|
||||||
@ -4096,6 +4221,19 @@
|
|||||||
"react": "^18.2.0"
|
"react": "^18.2.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/react-google-recaptcha": {
|
||||||
|
"version": "3.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-google-recaptcha/-/react-google-recaptcha-3.1.0.tgz",
|
||||||
|
"integrity": "sha512-cYW2/DWas8nEKZGD7SCu9BSuVz8iOcOLHChHyi7upUuVhkpkhYG/6N3KDiTQ3XAiZ2UAZkfvYKMfAHOzBOcGEg==",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"prop-types": "^15.5.0",
|
||||||
|
"react-async-script": "^1.2.0"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": ">=16.4.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/react-is": {
|
"node_modules/react-is": {
|
||||||
"version": "16.13.1",
|
"version": "16.13.1",
|
||||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||||
|
|||||||
@ -10,6 +10,7 @@
|
|||||||
"sass": "sass --watch public/assets/css/theme.scss:public/assets/css/theme.css"
|
"sass": "sass --watch public/assets/css/theme.scss:public/assets/css/theme.css"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"axios": "^1.11.0",
|
||||||
"eslint": "8.40.0",
|
"eslint": "8.40.0",
|
||||||
"eslint-config-next": "13.4.1",
|
"eslint-config-next": "13.4.1",
|
||||||
"isotope-layout": "^3.0.6",
|
"isotope-layout": "^3.0.6",
|
||||||
@ -17,6 +18,7 @@
|
|||||||
"react": "18.2.0",
|
"react": "18.2.0",
|
||||||
"react-countup": "^6.4.2",
|
"react-countup": "^6.4.2",
|
||||||
"react-dom": "18.2.0",
|
"react-dom": "18.2.0",
|
||||||
|
"react-google-recaptcha": "^3.1.0",
|
||||||
"react-modal-video": "^2.0.0",
|
"react-modal-video": "^2.0.0",
|
||||||
"react-scroll-trigger": "^0.6.14",
|
"react-scroll-trigger": "^0.6.14",
|
||||||
"react-slick": "^0.29.0",
|
"react-slick": "^0.29.0",
|
||||||
|
|||||||
454
pages/contact.js
454
pages/contact.js
@ -1,177 +1,287 @@
|
|||||||
import Layout from "@/components/layout/Layout"
|
"use client";
|
||||||
import Link from "next/link"
|
|
||||||
|
import { useState, useEffect } from "react";
|
||||||
|
import ReCAPTCHA from "react-google-recaptcha";
|
||||||
|
import axios from "axios";
|
||||||
|
import Layout from "@/components/layout/Layout";
|
||||||
|
import Link from "next/link";
|
||||||
|
|
||||||
export default function Contact() {
|
export default function Contact() {
|
||||||
|
const [formData, setFormData] = useState({
|
||||||
|
username: "",
|
||||||
|
email: "",
|
||||||
|
subject: "",
|
||||||
|
message: "",
|
||||||
|
});
|
||||||
|
|
||||||
return (
|
const [formErrors, setFormErrors] = useState({});
|
||||||
<>
|
const [captchaToken, setCaptchaToken] = useState(null);
|
||||||
<Layout breadcrumbTitle="Contact">
|
const [alert, setAlert] = useState({ show: false, type: "", message: "" });
|
||||||
{/*-contact*/}
|
|
||||||
<section className="contact-section">
|
const handleChange = (e) => {
|
||||||
{/*-============spacing==========-*/}
|
const { name, value } = e.target;
|
||||||
<div className="pd_top_80" />
|
setFormData((prev) => ({ ...prev, [name]: value }));
|
||||||
{/*-============spacing==========-*/}
|
};
|
||||||
<div className="container">
|
|
||||||
<div className="row">
|
const handleCaptchaChange = (token) => {
|
||||||
<div className="col-lg-4 col-md-6 col-sm-12">
|
|
||||||
<div className="contact_box_content">
|
setCaptchaToken(token);
|
||||||
<div className="icon trans">
|
};
|
||||||
<img src="/assets/images/cont-1.png" alt="img" className="img-fluid" />
|
|
||||||
</div>
|
const handleSubmit = async (e) => {
|
||||||
<div className="contact-infor">
|
e.preventDefault();
|
||||||
<h6 className="title_no_a_24"> Location</h6>
|
|
||||||
<span>55 Main Street, 2nd Block
|
const errors = {};
|
||||||
melbourne, Australia</span>
|
if (!formData.username.trim()) errors.username = "Name is required.";
|
||||||
</div>
|
if (!formData.email.trim()) errors.email = "Email is required.";
|
||||||
</div>
|
if (!formData.subject.trim()) errors.subject = "Subject is required.";
|
||||||
{/*-============spacing==========-*/}
|
if (!formData.message.trim()) errors.message = "Message is required.";
|
||||||
<div className="pd_bottom_30" />
|
if (!captchaToken) errors.captcha = "Please verify the CAPTCHA.";
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
</div>
|
setFormErrors(errors);
|
||||||
<div className="col-lg-4 col-md-6 col-sm-12">
|
|
||||||
<div className="contact_box_content">
|
if (Object.keys(errors).length > 0) {
|
||||||
<div className="icon trans">
|
return;
|
||||||
<img src="/assets/images/cont-2.png" alt="img" className="img-fluid" />
|
}
|
||||||
</div>
|
|
||||||
<div className="contact-infor">
|
const emailData = {
|
||||||
<h6 className="title_no_a_24">Email</h6>
|
...formData,
|
||||||
<Link href="mailto:support@gmail.com">support@gmail.com
|
message: `Subject: ${formData.subject}<br /><br />Message: ${formData.message}`,
|
||||||
</Link>
|
to: "info@zipvan.ca",
|
||||||
<Link href="mailto:infoinsurace.com">infoinsurace.com</Link>
|
senderName: "ZipVan Contact Page",
|
||||||
</div>
|
recaptchaToken: captchaToken,
|
||||||
</div>
|
};
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="pd_bottom_30" />
|
try {
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
</div>
|
const res = await axios.post("https://mailserver.metatronnest.com/send", emailData, {
|
||||||
<div className="col-lg-4 col-md-6 col-sm-12">
|
headers: { "Content-Type": "application/json" },
|
||||||
<div className="contact_box_content">
|
});
|
||||||
<div className="icon trans">
|
|
||||||
<img src="/assets/images/cont-3.png" alt="img" className="img-fluid" />
|
|
||||||
</div>
|
|
||||||
<div className="contact-infor">
|
|
||||||
<h6 className="title_no_a_24">Call Us</h6>
|
|
||||||
<Link href="tel:+00012345688">+000 (123) 456 88
|
|
||||||
</Link>
|
|
||||||
<Link href="tel:+12345678">+12345 678</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="pd_bottom_30" />
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="pd_bottom_40" />
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
</section>
|
|
||||||
{/*-contact end*/}\
|
|
||||||
{/*map*/}
|
|
||||||
<section className="contact-map-section">
|
|
||||||
<div className="container-no">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-lg-12">
|
|
||||||
<section className="map-section">
|
|
||||||
{/*Map Outer*/}
|
|
||||||
<div className="map-outer">
|
|
||||||
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2643.6895046810805!2d-122.52642526124438!3d38.00014098339506!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8085976736097a2f%3A0xbe014d20e6e22654!2sSan%20Rafael%2C%20California%2C%20Hoa%20K%E1%BB%B3!5e0!3m2!1svi!2s!4v1678975266976!5m2!1svi!2s" height={570} style={{ border: 0, width: "100%" }} allowFullScreen loading="lazy" referrerPolicy="no-referrer-when-downgrade" />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
{/*map*/}
|
|
||||||
{/*form*/}
|
|
||||||
<section className="form-section bg_light_1 position-relative">
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="pd_top_90" />
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="container">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-lg-4 col-md-12">
|
|
||||||
<div className="section_title type_one">
|
|
||||||
<h4 className="sm_title"> Get In Touch</h4>
|
|
||||||
<div className="title_whole">
|
|
||||||
<h2 className="title"> Need Any Help?
|
|
||||||
Or Looking For
|
|
||||||
an Agent</h2>
|
|
||||||
</div>
|
|
||||||
<p> On the other hand denounce righteousy indignation and dislike men</p>
|
|
||||||
</div>
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="pd_bottom_40" />
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="social-icons">
|
|
||||||
<ul>
|
|
||||||
<li><Link href="#" className="m_icon"> <i className="fab fa-facebook" />
|
|
||||||
</Link></li>
|
|
||||||
<li><Link href="#" className="m_icon"> <i className="fab fa-twitter" />
|
|
||||||
</Link></li>
|
|
||||||
<li><Link href="#" className="m_icon"> <i className="fab fa-skype" />
|
|
||||||
</Link></li>
|
|
||||||
<li><Link href="#" className="m_icon"> <i className="fab fa-instagram" />
|
|
||||||
</Link></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="pd_bottom_20" />
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
</div>
|
|
||||||
<div className="col-lg-8 col-md-12">
|
|
||||||
<section className="contact_form_box_all">
|
|
||||||
<div className="contact_form_shortcode">
|
|
||||||
<form id="contact-form" method="post" action="contact.php" role="form">
|
|
||||||
<div className="messages" />
|
|
||||||
<div className="controls">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-6 col-sm-12">
|
|
||||||
<div className="form-group">
|
|
||||||
<input type="text" name="name" placeholder="Your Name *" required="required" data-error="Enter Your Name" />
|
|
||||||
<div className="help-block with-errors" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="col-md-6 col-sm-12">
|
|
||||||
<div className="form-group">
|
|
||||||
<input type="text" name="email" required="required" placeholder="Email *" data-error="Enter Your Email Id" />
|
|
||||||
<div className="help-block with-errors" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="col-sm-12">
|
|
||||||
<div className="form-group">
|
|
||||||
<input type="text" name="subject" required="required" placeholder=" Subject (Optional)" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="col-sm-12">
|
|
||||||
<div className="form-group">
|
|
||||||
<textarea name="message" placeholder="Additional Information... (Optional) " rows={3} required="required" data-error="Please, leave us a message." />
|
|
||||||
<div className="help-block with-errors" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="col-sm-12">
|
|
||||||
<div className="form-group mg_top apbtn">
|
|
||||||
<button className="theme_btn" type="submit">Send Message</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="ab_img_left_bottom z_0 mr_top_minus_150">
|
|
||||||
<img src="/assets/images/bg-1.png" className="img-fluid" alt="img" />
|
|
||||||
</div>
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
<div className="pd_bottom_90" />
|
|
||||||
{/*-============spacing==========-*/}
|
|
||||||
</section>
|
|
||||||
{/*form*/}
|
|
||||||
|
|
||||||
|
|
||||||
</Layout>
|
setAlert({
|
||||||
</>
|
show: true,
|
||||||
)
|
type: "success",
|
||||||
|
message: res?.data?.message || "Message sent successfully!",
|
||||||
|
});
|
||||||
|
|
||||||
|
setFormData({ username: "", email: "", subject: "", message: "" });
|
||||||
|
setCaptchaToken(null);
|
||||||
|
setFormErrors({});
|
||||||
|
} catch (error) {
|
||||||
|
setAlert({
|
||||||
|
show: true,
|
||||||
|
type: "danger",
|
||||||
|
message: "Failed to send message. Please try again later.",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Auto-hide alert
|
||||||
|
useEffect(() => {
|
||||||
|
if (alert.show) {
|
||||||
|
const timer = setTimeout(() => {
|
||||||
|
setAlert((prev) => ({ ...prev, show: false }));
|
||||||
|
}, 5000);
|
||||||
|
return () => clearTimeout(timer);
|
||||||
|
}
|
||||||
|
}, [alert.show]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Layout breadcrumbTitle="Contact" footerStyle={2}>
|
||||||
|
<section className="contact-section">
|
||||||
|
<div className="pd_top_80" />
|
||||||
|
<div className="container">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-4 col-md-6 col-sm-12">
|
||||||
|
<div className="contact_box_content">
|
||||||
|
<div className="icon trans">
|
||||||
|
<img src="/assets/images/cont-1.png" alt="img" className="img-fluid" />
|
||||||
|
</div>
|
||||||
|
<div className="contact-infor">
|
||||||
|
<h6 className="title_no_a_24"> Location</h6>
|
||||||
|
<span>55 Main Street, 2nd Block melbourne, Australia</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="pd_bottom_30" />
|
||||||
|
</div>
|
||||||
|
<div className="col-lg-4 col-md-6 col-sm-12">
|
||||||
|
<div className="contact_box_content">
|
||||||
|
<div className="icon trans">
|
||||||
|
<img src="/assets/images/cont-2.png" alt="img" className="img-fluid" />
|
||||||
|
</div>
|
||||||
|
<div className="contact-infor">
|
||||||
|
<h6 className="title_no_a_24">Email</h6>
|
||||||
|
<Link href="mailto:info@zipvan.ca">info@zipvan.ca</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="pd_bottom_30" />
|
||||||
|
</div>
|
||||||
|
<div className="col-lg-4 col-md-6 col-sm-12">
|
||||||
|
<div className="contact_box_content">
|
||||||
|
<div className="icon trans">
|
||||||
|
<img src="/assets/images/cont-3.png" alt="img" className="img-fluid" />
|
||||||
|
</div>
|
||||||
|
<div className="contact-infor">
|
||||||
|
<h6 className="title_no_a_24">Call Us</h6>
|
||||||
|
<Link href="tel:(647) 360-2075">(647) 360-2075</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="pd_bottom_30" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="pd_bottom_40" />
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* form */}
|
||||||
|
<section className="form-section bg_light_1 position-relative">
|
||||||
|
<div className="pd_top_90" />
|
||||||
|
<div className="container">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-4 col-md-12">
|
||||||
|
<div className="section_title type_one">
|
||||||
|
<h4 className="sm_title"> Get In Touch</h4>
|
||||||
|
<div className="title_whole">
|
||||||
|
<h2 className="title"> Contact Zip Van We’re Here to Help</h2>
|
||||||
|
</div>
|
||||||
|
<p>
|
||||||
|
Get in touch with us for bookings, pricing, or any questions. We’re here to help you move with ease.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="pd_bottom_40" />
|
||||||
|
<div className="social-icons">
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<Link href="#" className="m_icon">
|
||||||
|
<i className="fab fa-instagram" />
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div className="pd_bottom_20" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="col-lg-8 col-md-12">
|
||||||
|
<section className="contact_form_box_all">
|
||||||
|
<div className="contact_form_shortcode">
|
||||||
|
{alert.show && (
|
||||||
|
<div className={`alert alert-${alert.type}`}>{alert.message}</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<form onSubmit={handleSubmit} role="form">
|
||||||
|
<div className="controls">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-6 col-sm-12">
|
||||||
|
<div className="form-group">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
name="username"
|
||||||
|
placeholder="Your Name *"
|
||||||
|
value={formData.username}
|
||||||
|
onChange={handleChange}
|
||||||
|
/>
|
||||||
|
{formErrors.username && (
|
||||||
|
<small className="text-danger">{formErrors.username}</small>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6 col-sm-12">
|
||||||
|
<div className="form-group">
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
name="email"
|
||||||
|
placeholder="Email *"
|
||||||
|
value={formData.email}
|
||||||
|
onChange={handleChange}
|
||||||
|
/>
|
||||||
|
{formErrors.email && (
|
||||||
|
<small className="text-danger">{formErrors.email}</small>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-sm-12">
|
||||||
|
<div className="form-group">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
name="subject"
|
||||||
|
placeholder="Subject *"
|
||||||
|
value={formData.subject}
|
||||||
|
onChange={handleChange}
|
||||||
|
/>
|
||||||
|
{formErrors.subject && (
|
||||||
|
<small className="text-danger">{formErrors.subject}</small>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-sm-12">
|
||||||
|
<div className="form-group">
|
||||||
|
<textarea
|
||||||
|
name="message"
|
||||||
|
placeholder="Additional Information..."
|
||||||
|
rows={3}
|
||||||
|
value={formData.message}
|
||||||
|
onChange={handleChange}
|
||||||
|
/>
|
||||||
|
{formErrors.message && (
|
||||||
|
<small className="text-danger">{formErrors.message}</small>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="col-sm-12 mb-3">
|
||||||
|
<ReCAPTCHA
|
||||||
|
sitekey="6LekfpwrAAAAAOTwuP1d2gg-Fv9UEsAjE2gjOQJl"
|
||||||
|
onChange={handleCaptchaChange}
|
||||||
|
/>
|
||||||
|
{formErrors.captcha && (
|
||||||
|
<small className="text-danger">{formErrors.captcha}</small>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="col-sm-12">
|
||||||
|
<div className="form-group mg_top apbtn">
|
||||||
|
<button className="theme_btn" type="submit">
|
||||||
|
Send Message
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="ab_img_left_bottom z_0 mr_top_minus_150">
|
||||||
|
<img src="/assets/images/bg-1.png" className="img-fluid" alt="img" />
|
||||||
|
</div>
|
||||||
|
<div className="pd_bottom_90" />
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="contact-map-section">
|
||||||
|
<div className="container-no">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-12">
|
||||||
|
<section className="map-section">
|
||||||
|
<div className="map-outer">
|
||||||
|
<iframe
|
||||||
|
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2643.6895046810805!2d-122.52642526124438!3d38.00014098339506!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8085976736097a2f%3A0xbe014d20e6e22654!2sSan%20Rafael%2C%20California!5e0!3m2!1sen!2s!4v1678975266976!5m2!1sen!2s"
|
||||||
|
height={570}
|
||||||
|
style={{ border: 0, width: "100%" }}
|
||||||
|
allowFullScreen
|
||||||
|
loading="lazy"
|
||||||
|
referrerPolicy="no-referrer-when-downgrade"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</Layout>
|
||||||
|
</>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
@ -34,18 +34,15 @@ export default function Faq() {
|
|||||||
<div className="section_title type_one">
|
<div className="section_title type_one">
|
||||||
<h4 className="sm_title"> Faq's</h4>
|
<h4 className="sm_title"> Faq's</h4>
|
||||||
<div className="title_whole">
|
<div className="title_whole">
|
||||||
<h2 className="title"> Frequently Asked
|
<h2 className="title"> Moving Services FAQ – Everything You Need to Know</h2>
|
||||||
Questions!</h2>
|
|
||||||
</div>
|
</div>
|
||||||
<p> Sed ut perspiciatis unde natus voluptatem accusantium doloremque laudantium
|
<p> Have questions about our moving services? We’ve put together a list of the most common questions our customers ask about bookings, costs, last-minute moves, and more. Whether you’re planning a small apartment move or need quick help transporting items, this FAQ will give you clear answers before you book.</p>
|
||||||
aperiam
|
|
||||||
inventore veritatis architecto beatae</p>
|
|
||||||
</div>
|
</div>
|
||||||
{/*-============spacing==========-*/}
|
{/*-============spacing==========-*/}
|
||||||
<div className="pd_bottom_40" />
|
<div className="pd_bottom_40" />
|
||||||
{/*-============spacing==========-*/}
|
{/*-============spacing==========-*/}
|
||||||
<div className="theme_btn_all">
|
<div className="theme_btn_all">
|
||||||
<Link href="#" className="theme_btn big rotate">
|
<Link href="/contact" className="theme_btn big rotate">
|
||||||
Contact Us <span> <i className=" fi-rr-arrow-small-up" /></span>
|
Contact Us <span> <i className=" fi-rr-arrow-small-up" /></span>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
@ -196,7 +193,7 @@ export default function Faq() {
|
|||||||
className="answer accordion-content"
|
className="answer accordion-content"
|
||||||
style={{ display: `${isActive.key == 9 ? "block" : "none"}` }}
|
style={{ display: `${isActive.key == 9 ? "block" : "none"}` }}
|
||||||
>
|
>
|
||||||
<h4>Here’s the deal:</h4>
|
<span>Here’s the deal:</span>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
Unlike U-Haul, you don’t have to drive, pay extra insurance, or waste
|
Unlike U-Haul, you don’t have to drive, pay extra insurance, or waste
|
||||||
@ -214,7 +211,7 @@ export default function Faq() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className={isActive.key == 7 ? "accordion active-block" : "accordion"}>
|
<div className={isActive.key == 7 ? "accordion active-block" : "accordion"}>
|
||||||
<div className={isActive.key == 7 ? "question faq_header active" : "question faq_header"} onClick={() => handleToggle(7)}>
|
<div className={isActive.key == 7 ? "question faq_header active" : "question faq_header"} onClick={() => handleToggle(7)}>
|
||||||
<div className="question_box ">
|
<div className="question_box ">
|
||||||
<div className="title_no_a_18 trans">What areas do you serve?
|
<div className="title_no_a_18 trans">What areas do you serve?
|
||||||
@ -223,7 +220,7 @@ export default function Faq() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="answer accordion-content" style={{ display: `${isActive.key == 7 ? "block" : "none"}` }}>
|
<div className="answer accordion-content" style={{ display: `${isActive.key == 7 ? "block" : "none"}` }}>
|
||||||
We currently serve [insert city/region here] and surrounding areas. Not sure if we reach you? Send us a quick message and we’ll confirm.
|
We currently serve [insert city/region here] and surrounding areas. Not sure if we reach you? Send us a quick message and we’ll confirm.
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@ -6173,7 +6173,7 @@ body .service_post.style_one .owl-carousel .owl-dots {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.list_box li a {
|
.list_box li a {
|
||||||
color: var(--heading-color-one);
|
color: #ff6600
|
||||||
}
|
}
|
||||||
|
|
||||||
.list_box.weight_500 li a {
|
.list_box.weight_500 li a {
|
||||||
@ -16909,6 +16909,12 @@ input[type=range i]:focus::-webkit-slider-thumb {
|
|||||||
background: #1f1b1f;
|
background: #1f1b1f;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* .bold{
|
||||||
|
|
||||||
|
font-weight: bold;
|
||||||
|
|
||||||
|
} */
|
||||||
|
|
||||||
.footer.style_two .newsteller_simple.button_style_one input[type=submit] {
|
.footer.style_two .newsteller_simple.button_style_one input[type=submit] {
|
||||||
background: var(--color-set-two-three-1);
|
background: var(--color-set-two-three-1);
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user