fix: moving header and footer section to layout
This commit is contained in:
parent
e104afb61e
commit
d88cff95d6
@ -12,6 +12,10 @@ import "photoswipe/dist/photoswipe.css";
|
|||||||
import "tippy.js/dist/tippy.css";
|
import "tippy.js/dist/tippy.css";
|
||||||
|
|
||||||
import "@public/assets/css/styles.css";
|
import "@public/assets/css/styles.css";
|
||||||
|
import Image from "next/image";
|
||||||
|
import Header from "@/components/Header";
|
||||||
|
import Footer from "@/components/Footer";
|
||||||
|
import { slickMultipages } from "@/data/menu";
|
||||||
|
|
||||||
export default function MainLayout({
|
export default function MainLayout({
|
||||||
children,
|
children,
|
||||||
@ -75,7 +79,27 @@ export default function MainLayout({
|
|||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
/>
|
/>
|
||||||
</head>
|
</head>
|
||||||
<body className="appear-animate body">{children}</body>
|
<body className="appear-animate body">
|
||||||
|
<div className="theme-slick">
|
||||||
|
<div className="page" id="top">
|
||||||
|
<nav className="main-nav transparent stick-fixed wow-menubar wch-unset">
|
||||||
|
<Header links={slickMultipages} />
|
||||||
|
</nav>
|
||||||
|
<main id="main">{children}</main>
|
||||||
|
<footer className="page-section footer position-relative overflow-hidden pb-30">
|
||||||
|
<div className="bg-shape-4">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/demo-slick/bg-shape-4.svg"
|
||||||
|
width={1600}
|
||||||
|
height={268}
|
||||||
|
alt=""
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<Footer />
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,12 +1,9 @@
|
|||||||
import Image from "next/image";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import Hero from "@/components/Hero";
|
import Hero from "@/components/Hero";
|
||||||
import Footer from "@/components/Footer";
|
|
||||||
import Homepage from "@/components/Homepage";
|
import Homepage from "@/components/Homepage";
|
||||||
import { slickMultipages } from "@/data/menu";
|
import Image from "next/image";
|
||||||
|
|
||||||
export const metadata = {
|
export const metadata = {
|
||||||
title: "Cochise Oncology",
|
title: "HomePage - Cochise Oncology",
|
||||||
description:
|
description:
|
||||||
"Resonance — One & Multi Page React Nextjs Creative Template",
|
"Resonance — One & Multi Page React Nextjs Creative Template",
|
||||||
};
|
};
|
||||||
@ -14,39 +11,19 @@ export const metadata = {
|
|||||||
export default function Home() {
|
export default function Home() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section className="home-section scrollSpysection" id="home">
|
||||||
<div className="page" id="top">
|
<div className="bg-shape-2 wow fadeIn">
|
||||||
<nav className="main-nav transparent stick-fixed wow-menubar wch-unset">
|
<Image
|
||||||
<Header links={slickMultipages} />
|
src="/assets/images/demo-slick/bg-shape-2.svg"
|
||||||
</nav>
|
width={858}
|
||||||
<main id="main">
|
height={804}
|
||||||
<section className="home-section scrollSpysection" id="home">
|
alt=""
|
||||||
<div className="bg-shape-2 wow fadeIn">
|
/>
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/bg-shape-2.svg"
|
|
||||||
width={858}
|
|
||||||
height={804}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<Hero />
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<Homepage />
|
|
||||||
</main>
|
|
||||||
<footer className="page-section footer position-relative overflow-hidden pb-30">
|
|
||||||
<div className="bg-shape-4">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
|
||||||
width={1600}
|
|
||||||
height={268}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<Footer />
|
|
||||||
</footer>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<Hero />
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<Homepage />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,10 +1,7 @@
|
|||||||
import Footer from "@/components/Footer";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import Facts from "@/components/Facts";
|
import Facts from "@/components/Facts";
|
||||||
import Testimonials from "@/components/Testimonials";
|
import Testimonials from "@/components/Testimonials";
|
||||||
import TestimonialsDark from "@/components/TestimonialsDark";
|
import TestimonialsDark from "@/components/TestimonialsDark";
|
||||||
import { features4 } from "@/data/features";
|
import { features4 } from "@/data/features";
|
||||||
import { slickMultipagesDark } from "@/data/menu";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
|
|
||||||
@ -18,242 +15,209 @@ const dark = true;
|
|||||||
export default function SlickAboutPageDark() {
|
export default function SlickAboutPageDark() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section
|
||||||
<div className="dark-mode">
|
className="page-section bg-dark-1 bg-gradient-gray-dark-1 light-content bg-scroll overflow-hidden"
|
||||||
<div className="page bg-dark-1" id="top">
|
id="home"
|
||||||
<nav className="main-nav dark dark-mode transparent stick-fixed wow-menubar wch-unset">
|
>
|
||||||
<Header links={slickMultipagesDark} />
|
{/* <!-- Background Shape --> */}
|
||||||
</nav>
|
<div className="bg-shape-1 opacity-003">
|
||||||
<main id="main">
|
<Image
|
||||||
<section
|
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
||||||
className="page-section bg-dark-1 bg-gradient-gray-dark-1 light-content bg-scroll overflow-hidden"
|
width={1443}
|
||||||
id="home"
|
height={844}
|
||||||
>
|
alt=""
|
||||||
{/* <!-- Background Shape --> */}
|
/>
|
||||||
<div className="bg-shape-1 opacity-003">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
|
||||||
width={1443}
|
|
||||||
height={844}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/* <!-- End Background Shape --> */}
|
|
||||||
|
|
||||||
<div className="container position-relative pt-sm-40 text-center">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
|
||||||
<h1 className="hs-title-10 mb-10 wow fadeInUp">
|
|
||||||
About Studio
|
|
||||||
</h1>
|
|
||||||
|
|
||||||
<p
|
|
||||||
className="section-descr mb-0 wow fadeInUp"
|
|
||||||
data-wow-delay="0.2s"
|
|
||||||
>
|
|
||||||
Crafting immersive digital journeys for brands.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section
|
|
||||||
className={`page-section scrollSpysection ${
|
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
|
||||||
} `}
|
|
||||||
id="about"
|
|
||||||
>
|
|
||||||
<div className="container position-relative">
|
|
||||||
<div className="row">
|
|
||||||
{/* Section Text */}
|
|
||||||
<div className="col-lg-6 d-flex align-items-center order-first order-lg-last mb-md-60 mb-sm-40">
|
|
||||||
<div className="w-100 wow fadeInUp">
|
|
||||||
<h2 className="section-caption-slick mb-30 mb-sm-20">
|
|
||||||
Our Story
|
|
||||||
</h2>
|
|
||||||
<h3 className="section-title mb-30">
|
|
||||||
We believe in creatives with a passion to smart
|
|
||||||
design.
|
|
||||||
</h3>
|
|
||||||
<p className="text-gray mb-40">
|
|
||||||
Etiam fermentum vehicula faucibus. Praesent
|
|
||||||
ullamcorper urna id arcu molestie scelerisque. Sed
|
|
||||||
imperdiet tristique mauris et faucibus. Maecenas
|
|
||||||
semper augue non fringilla placerat. Curabitur luctus
|
|
||||||
erat sit amet ultricies aliquam. Donec dictum
|
|
||||||
convallis mauris et maximus. Nullam massa arcu, porta
|
|
||||||
quis felis et, eleifend varius quam.
|
|
||||||
</p>
|
|
||||||
{/* Features List */}
|
|
||||||
<div className="row features-list mt-n20 mb-50 mb-sm-30">
|
|
||||||
{/* Features List Item */}
|
|
||||||
{features4.map((feature, index) => (
|
|
||||||
<div
|
|
||||||
key={index}
|
|
||||||
className="col-sm-6 col-lg-12 col-xl-6 d-flex mt-20"
|
|
||||||
>
|
|
||||||
<div className="features-list-icon">
|
|
||||||
<i className="mi-check" />
|
|
||||||
</div>
|
|
||||||
<div className="features-list-text">
|
|
||||||
{feature.text}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
{/* End Features List Item */}
|
|
||||||
</div>
|
|
||||||
{/* End Features List */}
|
|
||||||
<div className="local-scroll wch-unset">
|
|
||||||
<Link
|
|
||||||
href={`/slick-contact${dark ? "-dark" : ""}`}
|
|
||||||
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim mb-xs-10"
|
|
||||||
>
|
|
||||||
<span>Start a project</span>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<Link
|
|
||||||
href={`/slick-about${dark ? "-dark" : ""}`}
|
|
||||||
className="link-hover-anim ms-2 ms-sm-5 me-2"
|
|
||||||
data-link-animate="y"
|
|
||||||
>
|
|
||||||
<span className="link-strong link-strong-unhovered">
|
|
||||||
Learn more{" "}
|
|
||||||
<i
|
|
||||||
className="mi-arrow-right size-24"
|
|
||||||
aria-hidden="true"
|
|
||||||
></i>
|
|
||||||
</span>
|
|
||||||
<span
|
|
||||||
className="link-strong link-strong-hovered"
|
|
||||||
aria-hidden="true"
|
|
||||||
>
|
|
||||||
Learn more{" "}
|
|
||||||
<i
|
|
||||||
className="mi-arrow-right size-24"
|
|
||||||
aria-hidden="true"
|
|
||||||
></i>
|
|
||||||
</span>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Section Text */}
|
|
||||||
{/* Image */}
|
|
||||||
<div className="col-lg-6 d-flex align-items-center">
|
|
||||||
<div className="w-100 pe-lg-5">
|
|
||||||
<div className="composition-5">
|
|
||||||
<div className="composition-5-decoration opacity-065">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/decoration-1.svg"
|
|
||||||
alt=""
|
|
||||||
width={228}
|
|
||||||
height={228}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="composition-5-image-1">
|
|
||||||
<div className="composition-5-image-1-inner">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/hs-image-3.jpg"
|
|
||||||
alt="Image Description"
|
|
||||||
width={850}
|
|
||||||
height={914}
|
|
||||||
className="wow scaleOutIn"
|
|
||||||
data-wow-offset={200}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="composition-5-image-2">
|
|
||||||
<div className="composition-5-image-2-inner">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/hs-image-4.jpg"
|
|
||||||
alt="Image Description"
|
|
||||||
width={400}
|
|
||||||
height={400}
|
|
||||||
className="wow scaleOutIn"
|
|
||||||
data-wow-offset={0}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Images */}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section
|
|
||||||
className={`page-section ${
|
|
||||||
dark
|
|
||||||
? "bg-dark-1 bg-dark-alpha light-content"
|
|
||||||
: "bg-light-alpha-90"
|
|
||||||
} bg-scroll`}
|
|
||||||
style={{
|
|
||||||
backgroundImage:
|
|
||||||
"url(/assets/images/demo-slick/section-bg-1.jpg)",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Facts />
|
|
||||||
</section>
|
|
||||||
<section
|
|
||||||
className={`page-section ${
|
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
|
||||||
} `}
|
|
||||||
>
|
|
||||||
{dark ? <TestimonialsDark /> : <Testimonials />}
|
|
||||||
</section>
|
|
||||||
<section className="page-section pt-0">
|
|
||||||
<div className="container">
|
|
||||||
<div
|
|
||||||
className={`small-section ${
|
|
||||||
dark ? "bg-dark-2 light-content" : "bg-gray-light-1"
|
|
||||||
} ps-4 ps-lg-0 pe-4 pe-lg-0 round position-relative overflow-hidden`}
|
|
||||||
>
|
|
||||||
{/* Decoration Circles */}
|
|
||||||
<div className="decoration-12" />
|
|
||||||
<div className="decoration-13" />
|
|
||||||
{/* End Decoration Circles */}
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-7 col-lg-8 text-center text-md-start mb-sm-20">
|
|
||||||
<h2 className="section-title-small mb-20">
|
|
||||||
Like our creative works?
|
|
||||||
</h2>
|
|
||||||
<p className="text-gray mb-0">
|
|
||||||
Quisque posuere mollis ullamcorper. Ut eget metus
|
|
||||||
lorem ipsum posuere eget at ex. Aenean consequat
|
|
||||||
vitae lorem in vehicula.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="col-md-5 col-lg-4 text-center text-md-end pt-2">
|
|
||||||
<Link
|
|
||||||
href={`/slick-portfolio${dark ? "-dark" : ""}`}
|
|
||||||
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim"
|
|
||||||
>
|
|
||||||
<span>View all works</span>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
<footer className="page-section dark footer bg-dark-2 light-content position-relative overflow-hidden pb-30">
|
|
||||||
<div className="bg-shape-4 opacity-003">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
|
||||||
width={1600}
|
|
||||||
height={268}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<Footer />
|
|
||||||
</footer>
|
|
||||||
</div>{" "}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
{/* <!-- End Background Shape --> */}
|
||||||
|
|
||||||
|
<div className="container position-relative pt-sm-40 text-center">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">About Studio</h1>
|
||||||
|
|
||||||
|
<p
|
||||||
|
className="section-descr mb-0 wow fadeInUp"
|
||||||
|
data-wow-delay="0.2s"
|
||||||
|
>
|
||||||
|
Crafting immersive digital journeys for brands.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section
|
||||||
|
className={`page-section scrollSpysection ${
|
||||||
|
dark ? "bg-dark-1 light-content" : ""
|
||||||
|
} `}
|
||||||
|
id="about"
|
||||||
|
>
|
||||||
|
<div className="container position-relative">
|
||||||
|
<div className="row">
|
||||||
|
{/* Section Text */}
|
||||||
|
<div className="col-lg-6 d-flex align-items-center order-first order-lg-last mb-md-60 mb-sm-40">
|
||||||
|
<div className="w-100 wow fadeInUp">
|
||||||
|
<h2 className="section-caption-slick mb-30 mb-sm-20">
|
||||||
|
Our Story
|
||||||
|
</h2>
|
||||||
|
<h3 className="section-title mb-30">
|
||||||
|
We believe in creatives with a passion to smart design.
|
||||||
|
</h3>
|
||||||
|
<p className="text-gray mb-40">
|
||||||
|
Etiam fermentum vehicula faucibus. Praesent ullamcorper urna
|
||||||
|
id arcu molestie scelerisque. Sed imperdiet tristique mauris
|
||||||
|
et faucibus. Maecenas semper augue non fringilla placerat.
|
||||||
|
Curabitur luctus erat sit amet ultricies aliquam. Donec dictum
|
||||||
|
convallis mauris et maximus. Nullam massa arcu, porta quis
|
||||||
|
felis et, eleifend varius quam.
|
||||||
|
</p>
|
||||||
|
{/* Features List */}
|
||||||
|
<div className="row features-list mt-n20 mb-50 mb-sm-30">
|
||||||
|
{/* Features List Item */}
|
||||||
|
{features4.map((feature, index) => (
|
||||||
|
<div
|
||||||
|
key={index}
|
||||||
|
className="col-sm-6 col-lg-12 col-xl-6 d-flex mt-20"
|
||||||
|
>
|
||||||
|
<div className="features-list-icon">
|
||||||
|
<i className="mi-check" />
|
||||||
|
</div>
|
||||||
|
<div className="features-list-text">{feature.text}</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
{/* End Features List Item */}
|
||||||
|
</div>
|
||||||
|
{/* End Features List */}
|
||||||
|
<div className="local-scroll wch-unset">
|
||||||
|
<Link
|
||||||
|
href={`/slick-contact${dark ? "-dark" : ""}`}
|
||||||
|
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim mb-xs-10"
|
||||||
|
>
|
||||||
|
<span>Start a project</span>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
<Link
|
||||||
|
href={`/slick-about${dark ? "-dark" : ""}`}
|
||||||
|
className="link-hover-anim ms-2 ms-sm-5 me-2"
|
||||||
|
data-link-animate="y"
|
||||||
|
>
|
||||||
|
<span className="link-strong link-strong-unhovered">
|
||||||
|
Learn more{" "}
|
||||||
|
<i
|
||||||
|
className="mi-arrow-right size-24"
|
||||||
|
aria-hidden="true"
|
||||||
|
></i>
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="link-strong link-strong-hovered"
|
||||||
|
aria-hidden="true"
|
||||||
|
>
|
||||||
|
Learn more{" "}
|
||||||
|
<i
|
||||||
|
className="mi-arrow-right size-24"
|
||||||
|
aria-hidden="true"
|
||||||
|
></i>
|
||||||
|
</span>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Section Text */}
|
||||||
|
{/* Image */}
|
||||||
|
<div className="col-lg-6 d-flex align-items-center">
|
||||||
|
<div className="w-100 pe-lg-5">
|
||||||
|
<div className="composition-5">
|
||||||
|
<div className="composition-5-decoration opacity-065">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/demo-slick/decoration-1.svg"
|
||||||
|
alt=""
|
||||||
|
width={228}
|
||||||
|
height={228}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="composition-5-image-1">
|
||||||
|
<div className="composition-5-image-1-inner">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/demo-slick/hs-image-3.jpg"
|
||||||
|
alt="Image Description"
|
||||||
|
width={850}
|
||||||
|
height={914}
|
||||||
|
className="wow scaleOutIn"
|
||||||
|
data-wow-offset={200}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="composition-5-image-2">
|
||||||
|
<div className="composition-5-image-2-inner">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/demo-slick/hs-image-4.jpg"
|
||||||
|
alt="Image Description"
|
||||||
|
width={400}
|
||||||
|
height={400}
|
||||||
|
className="wow scaleOutIn"
|
||||||
|
data-wow-offset={0}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Images */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section
|
||||||
|
className={`page-section ${
|
||||||
|
dark ? "bg-dark-1 bg-dark-alpha light-content" : "bg-light-alpha-90"
|
||||||
|
} bg-scroll`}
|
||||||
|
style={{
|
||||||
|
backgroundImage: "url(/assets/images/demo-slick/section-bg-1.jpg)",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Facts />
|
||||||
|
</section>
|
||||||
|
<section
|
||||||
|
className={`page-section ${dark ? "bg-dark-1 light-content" : ""} `}
|
||||||
|
>
|
||||||
|
{dark ? <TestimonialsDark /> : <Testimonials />}
|
||||||
|
</section>
|
||||||
|
<section className="page-section pt-0">
|
||||||
|
<div className="container">
|
||||||
|
<div
|
||||||
|
className={`small-section ${
|
||||||
|
dark ? "bg-dark-2 light-content" : "bg-gray-light-1"
|
||||||
|
} ps-4 ps-lg-0 pe-4 pe-lg-0 round position-relative overflow-hidden`}
|
||||||
|
>
|
||||||
|
{/* Decoration Circles */}
|
||||||
|
<div className="decoration-12" />
|
||||||
|
<div className="decoration-13" />
|
||||||
|
{/* End Decoration Circles */}
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-7 col-lg-8 text-center text-md-start mb-sm-20">
|
||||||
|
<h2 className="section-title-small mb-20">
|
||||||
|
Like our creative works?
|
||||||
|
</h2>
|
||||||
|
<p className="text-gray mb-0">
|
||||||
|
Quisque posuere mollis ullamcorper. Ut eget metus lorem
|
||||||
|
ipsum posuere eget at ex. Aenean consequat vitae lorem in
|
||||||
|
vehicula.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-5 col-lg-4 text-center text-md-end pt-2">
|
||||||
|
<Link
|
||||||
|
href={`/slick-portfolio${dark ? "-dark" : ""}`}
|
||||||
|
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim"
|
||||||
|
>
|
||||||
|
<span>View all works</span>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,10 +1,7 @@
|
|||||||
import Footer from "@/components/Footer";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import Facts from "@/components/Facts";
|
import Facts from "@/components/Facts";
|
||||||
import Testimonials from "@/components/Testimonials";
|
import Testimonials from "@/components/Testimonials";
|
||||||
import TestimonialsDark from "@/components/TestimonialsDark";
|
import TestimonialsDark from "@/components/TestimonialsDark";
|
||||||
import { features4 } from "@/data/features";
|
import { features4 } from "@/data/features";
|
||||||
import { slickMultipages } from "@/data/menu";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
|
|
||||||
@ -19,240 +16,209 @@ const dark = false;
|
|||||||
export default function SlickAboutPage() {
|
export default function SlickAboutPage() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section
|
||||||
<div className="page" id="top">
|
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
||||||
<nav className="main-nav transparent stick-fixed wow-menubar wch-unset">
|
id="home"
|
||||||
<Header links={slickMultipages} />
|
>
|
||||||
</nav>
|
{/* <!-- Background Shape --> */}
|
||||||
<main id="main">
|
<div className="bg-shape-1 wow fadeIn">
|
||||||
<section
|
<Image
|
||||||
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
||||||
id="home"
|
width={1443}
|
||||||
>
|
height={844}
|
||||||
{/* <!-- Background Shape --> */}
|
alt=""
|
||||||
<div className="bg-shape-1 wow fadeIn">
|
/>
|
||||||
<Image
|
</div>
|
||||||
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
{/* <!-- End Background Shape --> */}
|
||||||
width={1443}
|
|
||||||
height={844}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/* <!-- End Background Shape --> */}
|
|
||||||
|
|
||||||
<div className="container position-relative pt-sm-40 text-center">
|
<div className="container position-relative pt-sm-40 text-center">
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
<h1 className="hs-title-10 mb-10 wow fadeInUp">
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">About Studio</h1>
|
||||||
About Studio
|
|
||||||
</h1>
|
|
||||||
|
|
||||||
<p
|
<p
|
||||||
className="section-descr mb-0 wow fadeInUp"
|
className="section-descr mb-0 wow fadeInUp"
|
||||||
data-wow-delay="0.2s"
|
data-wow-delay="0.2s"
|
||||||
|
>
|
||||||
|
Crafting immersive digital journeys for brands.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section
|
||||||
|
className={`page-section scrollSpysection ${
|
||||||
|
dark ? "bg-dark-1 light-content" : ""
|
||||||
|
} `}
|
||||||
|
id="about"
|
||||||
|
>
|
||||||
|
<div className="container position-relative">
|
||||||
|
<div className="row">
|
||||||
|
{/* Section Text */}
|
||||||
|
<div className="col-lg-6 d-flex align-items-center order-first order-lg-last mb-md-60 mb-sm-40">
|
||||||
|
<div className="w-100 wow fadeInUp">
|
||||||
|
<h2 className="section-caption-slick mb-30 mb-sm-20">
|
||||||
|
Our Story
|
||||||
|
</h2>
|
||||||
|
<h3 className="section-title mb-30">
|
||||||
|
We believe in creatives with a passion to smart design.
|
||||||
|
</h3>
|
||||||
|
<p className="text-gray mb-40">
|
||||||
|
Etiam fermentum vehicula faucibus. Praesent ullamcorper urna
|
||||||
|
id arcu molestie scelerisque. Sed imperdiet tristique mauris
|
||||||
|
et faucibus. Maecenas semper augue non fringilla placerat.
|
||||||
|
Curabitur luctus erat sit amet ultricies aliquam. Donec dictum
|
||||||
|
convallis mauris et maximus. Nullam massa arcu, porta quis
|
||||||
|
felis et, eleifend varius quam.
|
||||||
|
</p>
|
||||||
|
{/* Features List */}
|
||||||
|
<div className="row features-list mt-n20 mb-50 mb-sm-30">
|
||||||
|
{/* Features List Item */}
|
||||||
|
{features4.map((feature, index) => (
|
||||||
|
<div
|
||||||
|
key={index}
|
||||||
|
className="col-sm-6 col-lg-12 col-xl-6 d-flex mt-20"
|
||||||
>
|
>
|
||||||
Crafting immersive digital journeys for brands.
|
<div className="features-list-icon">
|
||||||
|
<i className="mi-check" />
|
||||||
|
</div>
|
||||||
|
<div className="features-list-text">{feature.text}</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
{/* End Features List Item */}
|
||||||
|
</div>
|
||||||
|
{/* End Features List */}
|
||||||
|
<div className="local-scroll wch-unset">
|
||||||
|
<Link
|
||||||
|
href={`/slick-contact${dark ? "-dark" : ""}`}
|
||||||
|
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim mb-xs-10"
|
||||||
|
>
|
||||||
|
<span>Start a project</span>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
<Link
|
||||||
|
href={`/slick-about${dark ? "-dark" : ""}`}
|
||||||
|
className="link-hover-anim ms-2 ms-sm-5 me-2"
|
||||||
|
data-link-animate="y"
|
||||||
|
>
|
||||||
|
<span className="link-strong link-strong-unhovered">
|
||||||
|
Learn more{" "}
|
||||||
|
<i
|
||||||
|
className="mi-arrow-right size-24"
|
||||||
|
aria-hidden="true"
|
||||||
|
></i>
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
className="link-strong link-strong-hovered"
|
||||||
|
aria-hidden="true"
|
||||||
|
>
|
||||||
|
Learn more{" "}
|
||||||
|
<i
|
||||||
|
className="mi-arrow-right size-24"
|
||||||
|
aria-hidden="true"
|
||||||
|
></i>
|
||||||
|
</span>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Section Text */}
|
||||||
|
{/* Image */}
|
||||||
|
<div className="col-lg-6 d-flex align-items-center">
|
||||||
|
<div className="w-100 pe-lg-5">
|
||||||
|
<div className="composition-5">
|
||||||
|
<div className="composition-5-decoration opacity-065">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/demo-slick/decoration-1.svg"
|
||||||
|
alt=""
|
||||||
|
width={228}
|
||||||
|
height={228}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="composition-5-image-1">
|
||||||
|
<div className="composition-5-image-1-inner">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/demo-slick/hs-image-3.jpg"
|
||||||
|
alt="Image Description"
|
||||||
|
width={850}
|
||||||
|
height={914}
|
||||||
|
className="wow scaleOutIn"
|
||||||
|
data-wow-offset={200}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="composition-5-image-2">
|
||||||
|
<div className="composition-5-image-2-inner">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/demo-slick/hs-image-4.jpg"
|
||||||
|
alt="Image Description"
|
||||||
|
width={400}
|
||||||
|
height={400}
|
||||||
|
className="wow scaleOutIn"
|
||||||
|
data-wow-offset={0}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Images */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section
|
||||||
|
className={`page-section ${
|
||||||
|
dark ? "bg-dark-1 bg-dark-alpha light-content" : "bg-light-alpha-90"
|
||||||
|
} bg-scroll`}
|
||||||
|
style={{
|
||||||
|
backgroundImage: "url(/assets/images/demo-slick/section-bg-1.jpg)",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Facts />
|
||||||
|
</section>
|
||||||
|
<section
|
||||||
|
className={`page-section ${dark ? "bg-dark-1 light-content" : ""} `}
|
||||||
|
>
|
||||||
|
{dark ? <TestimonialsDark /> : <Testimonials />}
|
||||||
|
</section>
|
||||||
|
<section className="page-section pt-0">
|
||||||
|
<div className="container">
|
||||||
|
<div
|
||||||
|
className={`small-section ${
|
||||||
|
dark ? "bg-dark-2 light-content" : "bg-gray-light-1"
|
||||||
|
} ps-4 ps-lg-0 pe-4 pe-lg-0 round position-relative overflow-hidden`}
|
||||||
|
>
|
||||||
|
{/* Decoration Circles */}
|
||||||
|
<div className="decoration-12" />
|
||||||
|
<div className="decoration-13" />
|
||||||
|
{/* End Decoration Circles */}
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-7 col-lg-8 text-center text-md-start mb-sm-20">
|
||||||
|
<h2 className="section-title-small mb-20">
|
||||||
|
Like our creative works?
|
||||||
|
</h2>
|
||||||
|
<p className="text-gray mb-0">
|
||||||
|
Quisque posuere mollis ullamcorper. Ut eget metus lorem
|
||||||
|
ipsum posuere eget at ex. Aenean consequat vitae lorem in
|
||||||
|
vehicula.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="col-md-5 col-lg-4 text-center text-md-end pt-2">
|
||||||
</div>
|
<Link
|
||||||
</section>
|
href={`/slick-portfolio${dark ? "-dark" : ""}`}
|
||||||
<section
|
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim"
|
||||||
className={`page-section scrollSpysection ${
|
>
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
<span>View all works</span>
|
||||||
} `}
|
</Link>
|
||||||
id="about"
|
|
||||||
>
|
|
||||||
<div className="container position-relative">
|
|
||||||
<div className="row">
|
|
||||||
{/* Section Text */}
|
|
||||||
<div className="col-lg-6 d-flex align-items-center order-first order-lg-last mb-md-60 mb-sm-40">
|
|
||||||
<div className="w-100 wow fadeInUp">
|
|
||||||
<h2 className="section-caption-slick mb-30 mb-sm-20">
|
|
||||||
Our Story
|
|
||||||
</h2>
|
|
||||||
<h3 className="section-title mb-30">
|
|
||||||
We believe in creatives with a passion to smart
|
|
||||||
design.
|
|
||||||
</h3>
|
|
||||||
<p className="text-gray mb-40">
|
|
||||||
Etiam fermentum vehicula faucibus. Praesent ullamcorper
|
|
||||||
urna id arcu molestie scelerisque. Sed imperdiet
|
|
||||||
tristique mauris et faucibus. Maecenas semper augue non
|
|
||||||
fringilla placerat. Curabitur luctus erat sit amet
|
|
||||||
ultricies aliquam. Donec dictum convallis mauris et
|
|
||||||
maximus. Nullam massa arcu, porta quis felis et,
|
|
||||||
eleifend varius quam.
|
|
||||||
</p>
|
|
||||||
{/* Features List */}
|
|
||||||
<div className="row features-list mt-n20 mb-50 mb-sm-30">
|
|
||||||
{/* Features List Item */}
|
|
||||||
{features4.map((feature, index) => (
|
|
||||||
<div
|
|
||||||
key={index}
|
|
||||||
className="col-sm-6 col-lg-12 col-xl-6 d-flex mt-20"
|
|
||||||
>
|
|
||||||
<div className="features-list-icon">
|
|
||||||
<i className="mi-check" />
|
|
||||||
</div>
|
|
||||||
<div className="features-list-text">
|
|
||||||
{feature.text}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
{/* End Features List Item */}
|
|
||||||
</div>
|
|
||||||
{/* End Features List */}
|
|
||||||
<div className="local-scroll wch-unset">
|
|
||||||
<Link
|
|
||||||
href={`/slick-contact${dark ? "-dark" : ""}`}
|
|
||||||
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim mb-xs-10"
|
|
||||||
>
|
|
||||||
<span>Start a project</span>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<Link
|
|
||||||
href={`/slick-about${dark ? "-dark" : ""}`}
|
|
||||||
className="link-hover-anim ms-2 ms-sm-5 me-2"
|
|
||||||
data-link-animate="y"
|
|
||||||
>
|
|
||||||
<span className="link-strong link-strong-unhovered">
|
|
||||||
Learn more{" "}
|
|
||||||
<i
|
|
||||||
className="mi-arrow-right size-24"
|
|
||||||
aria-hidden="true"
|
|
||||||
></i>
|
|
||||||
</span>
|
|
||||||
<span
|
|
||||||
className="link-strong link-strong-hovered"
|
|
||||||
aria-hidden="true"
|
|
||||||
>
|
|
||||||
Learn more{" "}
|
|
||||||
<i
|
|
||||||
className="mi-arrow-right size-24"
|
|
||||||
aria-hidden="true"
|
|
||||||
></i>
|
|
||||||
</span>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Section Text */}
|
|
||||||
{/* Image */}
|
|
||||||
<div className="col-lg-6 d-flex align-items-center">
|
|
||||||
<div className="w-100 pe-lg-5">
|
|
||||||
<div className="composition-5">
|
|
||||||
<div className="composition-5-decoration opacity-065">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/decoration-1.svg"
|
|
||||||
alt=""
|
|
||||||
width={228}
|
|
||||||
height={228}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="composition-5-image-1">
|
|
||||||
<div className="composition-5-image-1-inner">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/hs-image-3.jpg"
|
|
||||||
alt="Image Description"
|
|
||||||
width={850}
|
|
||||||
height={914}
|
|
||||||
className="wow scaleOutIn"
|
|
||||||
data-wow-offset={200}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="composition-5-image-2">
|
|
||||||
<div className="composition-5-image-2-inner">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/hs-image-4.jpg"
|
|
||||||
alt="Image Description"
|
|
||||||
width={400}
|
|
||||||
height={400}
|
|
||||||
className="wow scaleOutIn"
|
|
||||||
data-wow-offset={0}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Images */}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section
|
|
||||||
className={`page-section ${
|
|
||||||
dark
|
|
||||||
? "bg-dark-1 bg-dark-alpha light-content"
|
|
||||||
: "bg-light-alpha-90"
|
|
||||||
} bg-scroll`}
|
|
||||||
style={{
|
|
||||||
backgroundImage:
|
|
||||||
"url(/assets/images/demo-slick/section-bg-1.jpg)",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Facts />
|
|
||||||
</section>
|
|
||||||
<section
|
|
||||||
className={`page-section ${
|
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
|
||||||
} `}
|
|
||||||
>
|
|
||||||
{dark ? <TestimonialsDark /> : <Testimonials />}
|
|
||||||
</section>
|
|
||||||
<section className="page-section pt-0">
|
|
||||||
<div className="container">
|
|
||||||
<div
|
|
||||||
className={`small-section ${
|
|
||||||
dark ? "bg-dark-2 light-content" : "bg-gray-light-1"
|
|
||||||
} ps-4 ps-lg-0 pe-4 pe-lg-0 round position-relative overflow-hidden`}
|
|
||||||
>
|
|
||||||
{/* Decoration Circles */}
|
|
||||||
<div className="decoration-12" />
|
|
||||||
<div className="decoration-13" />
|
|
||||||
{/* End Decoration Circles */}
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-7 col-lg-8 text-center text-md-start mb-sm-20">
|
|
||||||
<h2 className="section-title-small mb-20">
|
|
||||||
Like our creative works?
|
|
||||||
</h2>
|
|
||||||
<p className="text-gray mb-0">
|
|
||||||
Quisque posuere mollis ullamcorper. Ut eget metus
|
|
||||||
lorem ipsum posuere eget at ex. Aenean consequat
|
|
||||||
vitae lorem in vehicula.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="col-md-5 col-lg-4 text-center text-md-end pt-2">
|
|
||||||
<Link
|
|
||||||
href={`/slick-portfolio${dark ? "-dark" : ""}`}
|
|
||||||
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim"
|
|
||||||
>
|
|
||||||
<span>View all works</span>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
<footer className="page-section footer position-relative overflow-hidden pb-30">
|
|
||||||
<div className="bg-shape-4">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
|
||||||
width={1600}
|
|
||||||
height={268}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<Footer />
|
</div>
|
||||||
</footer>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,11 +1,8 @@
|
|||||||
import Footer from "@/components/Footer";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import { slickMultipages } from "@/data/menu";
|
|
||||||
import Image from "next/image";
|
|
||||||
import BlogComments from "@/components/BlogComments";
|
import BlogComments from "@/components/BlogComments";
|
||||||
import CommentForm from "@/components/CommentForm";
|
|
||||||
import BlogWidget from "@/components/BlogWidget";
|
import BlogWidget from "@/components/BlogWidget";
|
||||||
|
import CommentForm from "@/components/CommentForm";
|
||||||
import { allBlogs } from "@/data/blogs";
|
import { allBlogs } from "@/data/blogs";
|
||||||
|
import Image from "next/image";
|
||||||
export const metadata = {
|
export const metadata = {
|
||||||
title:
|
title:
|
||||||
"Slick Blogs Single || Resonance — One & Multi Page React Nextjs Creative Template",
|
"Slick Blogs Single || Resonance — One & Multi Page React Nextjs Creative Template",
|
||||||
@ -20,212 +17,186 @@ export default async function asyncSlickBlogSinglePage(
|
|||||||
const blog = allBlogs.filter((elm) => elm.id == id)[0] || allBlogs[0];
|
const blog = allBlogs.filter((elm) => elm.id == id)[0] || allBlogs[0];
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section
|
||||||
<div className="page" id="top">
|
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
||||||
<nav className="main-nav transparent stick-fixed wow-menubar wch-unset">
|
id="home"
|
||||||
<Header links={slickMultipages} />
|
>
|
||||||
</nav>
|
{/* <!-- Background Shape --> */}
|
||||||
<main id="main">
|
<div className="bg-shape-1 wow fadeIn">
|
||||||
<section
|
<Image
|
||||||
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
||||||
id="home"
|
width={1443}
|
||||||
>
|
height={844}
|
||||||
{/* <!-- Background Shape --> */}
|
alt=""
|
||||||
<div className="bg-shape-1 wow fadeIn">
|
/>
|
||||||
<Image
|
</div>
|
||||||
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
{/* <!-- End Background Shape --> */}
|
||||||
width={1443}
|
|
||||||
height={844}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/* <!-- End Background Shape --> */}
|
|
||||||
|
|
||||||
<div className="container position-relative pt-sm-40 text-center">
|
<div className="container position-relative pt-sm-40 text-center">
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
<h1 className="hs-title-10 mb-10 wow fadeInUp">
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">
|
||||||
{/* @ts-ignore */}
|
{/* @ts-ignore */}
|
||||||
{blog?.title || blog?.postTitle}
|
{blog?.title || blog?.postTitle}
|
||||||
</h1>
|
</h1>
|
||||||
{/* Author, Categories, Comments */}
|
{/* Author, Categories, Comments */}
|
||||||
<div
|
<div
|
||||||
className="blog-item-data mb-0 wow fadeIn"
|
className="blog-item-data mb-0 wow fadeIn"
|
||||||
data-wow-delay="0.2s"
|
data-wow-delay="0.2s"
|
||||||
>
|
>
|
||||||
<div className="d-inline-block me-3">
|
<div className="d-inline-block me-3">
|
||||||
<a href="#">
|
<a href="#">
|
||||||
<i className="mi-clock size-16" />
|
<i className="mi-clock size-16" />
|
||||||
<span className="visually-hidden">Date:</span>{" "}
|
<span className="visually-hidden">Date:</span> December 25
|
||||||
December 25
|
</a>
|
||||||
</a>
|
</div>
|
||||||
</div>
|
<div className="d-inline-block me-3">
|
||||||
<div className="d-inline-block me-3">
|
<a href="#">
|
||||||
<a href="#">
|
<i className="mi-user size-16" />
|
||||||
<i className="mi-user size-16" />
|
<span className="visually-hidden">Author:</span> John Doe
|
||||||
<span className="visually-hidden">Author:</span> John
|
</a>
|
||||||
Doe
|
</div>
|
||||||
</a>
|
<div className="d-inline-block me-3">
|
||||||
</div>
|
<i className="mi-folder size-16" />
|
||||||
<div className="d-inline-block me-3">
|
<span className="visually-hidden">Categories:</span>
|
||||||
<i className="mi-folder size-16" />
|
<a href="#">Design</a>, <a href="#">Branding</a>
|
||||||
<span className="visually-hidden">Categories:</span>
|
</div>
|
||||||
<a href="#">Design</a>, <a href="#">Branding</a>
|
<div className="d-inline-block me-3">
|
||||||
</div>
|
<a href="#">
|
||||||
<div className="d-inline-block me-3">
|
<i className="mi-message size-16" /> 5 Comments
|
||||||
<a href="#">
|
</a>
|
||||||
<i className="mi-message size-16" /> 5 Comments
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Author, Categories, Comments */}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
{/* End Author, Categories, Comments */}
|
||||||
<>
|
</div>
|
||||||
{/* Section */}
|
</div>
|
||||||
<section className="page-section">
|
</div>
|
||||||
<div className="container relative">
|
</section>
|
||||||
<div className="row">
|
<>
|
||||||
{/* Content */}
|
{/* Section */}
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
<section className="page-section">
|
||||||
{/* Post */}
|
<div className="container relative">
|
||||||
<div className="blog-item mb-80 mb-xs-40">
|
<div className="row">
|
||||||
<div className="blog-item-body">
|
{/* Content */}
|
||||||
<div className="mb-40 mb-xs-30">
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
<Image
|
{/* Post */}
|
||||||
src="/assets/images/demo-fancy/blog/post-prev-3-large.jpg"
|
<div className="blog-item mb-80 mb-xs-40">
|
||||||
alt="Image Description"
|
<div className="blog-item-body">
|
||||||
width={1350}
|
<div className="mb-40 mb-xs-30">
|
||||||
height={759}
|
<Image
|
||||||
className="round"
|
src="/assets/images/demo-fancy/blog/post-prev-3-large.jpg"
|
||||||
/>
|
alt="Image Description"
|
||||||
</div>
|
width={1350}
|
||||||
<p>
|
height={759}
|
||||||
Morbi lacus massa, euismod ut turpis molestie,
|
className="round"
|
||||||
tristique sodales est. Integer sit amet mi id sapien
|
/>
|
||||||
tempor molestie in nec massa. Fusce non ante sed
|
|
||||||
lorem rutrum feugiat. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipiscing elit. Mauris non laoreet dui.
|
|
||||||
Morbi lacus massa, euismod ut turpis molestie,
|
|
||||||
tristique sodales est. Integer sit amet mi id sapien
|
|
||||||
tempor molestie in nec massa.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Fusce non ante sed lorem rutrum feugiat. Vestibulum
|
|
||||||
pellentesque, purus ut dignissim consectetur,
|
|
||||||
nulla erat ultrices purus, ut consequat sem
|
|
||||||
elit non sem. Morbi lacus massa, euismod ut turpis
|
|
||||||
molestie, tristique sodales est. Integer sit amet mi
|
|
||||||
id sapien tempor molestie in nec massa. Fusce non
|
|
||||||
ante sed lorem rutrum feugiat.
|
|
||||||
</p>
|
|
||||||
<blockquote>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing
|
|
||||||
elit. Integer posuere erat a ante. Vestibulum
|
|
||||||
pellentesque, purus ut dignissim consectetur,
|
|
||||||
nulla erat ultrices purus.
|
|
||||||
</p>
|
|
||||||
<footer>
|
|
||||||
Someone famous in
|
|
||||||
<cite title="Source Title"> Source Title </cite>
|
|
||||||
</footer>
|
|
||||||
</blockquote>
|
|
||||||
<p>
|
|
||||||
Praesent ultricies ut ipsum non laoreet. Nunc ac
|
|
||||||
<a href="#">ultricies</a> leo. Nulla ac ultrices
|
|
||||||
arcu. Nullam adipiscing lacus in consectetur
|
|
||||||
posuere. Nunc malesuada tellus turpis, ac pretium
|
|
||||||
orci molestie vel. Morbi lacus massa, euismod ut
|
|
||||||
turpis molestie, tristique sodales est. Integer sit
|
|
||||||
amet mi id sapien tempor molestie in nec massa.
|
|
||||||
Fusce non ante sed lorem rutrum feugiat.
|
|
||||||
</p>
|
|
||||||
<ul>
|
|
||||||
<li>First item of the list</li>
|
|
||||||
<li>Second item of the list</li>
|
|
||||||
<li>Third item of the list</li>
|
|
||||||
</ul>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing
|
|
||||||
elit. Mauris non laoreet dui. Morbi lacus massa,
|
|
||||||
euismod ut turpis molestie, tristique sodales est.
|
|
||||||
Integer sit amet mi id sapien tempor molestie in nec
|
|
||||||
massa. Fusce non ante sed lorem rutrum feugiat.
|
|
||||||
Vestibulum pellentesque, purus ut dignissim
|
|
||||||
consectetur, nulla erat ultrices purus,
|
|
||||||
ut consequat sem elit non sem.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Post */}
|
|
||||||
{/* Comments */}
|
|
||||||
<div className="mb-80 mb-xs-40">
|
|
||||||
<h4 className="blog-page-title">
|
|
||||||
Comments <small className="number">(3)</small>
|
|
||||||
</h4>
|
|
||||||
<ul className="media-list comment-list clearlist">
|
|
||||||
<BlogComments />
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
{/* End Comments */}
|
|
||||||
{/* Add Comment */}
|
|
||||||
<div className="mb-80 mb-xs-40">
|
|
||||||
<h4 className="blog-page-title">Leave a comment</h4>
|
|
||||||
{/* Form */}
|
|
||||||
<CommentForm />
|
|
||||||
{/* End Form */}
|
|
||||||
</div>
|
|
||||||
{/* End Add Comment */}
|
|
||||||
{/* Prev/Next Post */}
|
|
||||||
<div className="clearfix mt-40">
|
|
||||||
<a href="#" className="blog-item-more circle left">
|
|
||||||
<i className="mi-chevron-left" />
|
|
||||||
Prev post
|
|
||||||
</a>
|
|
||||||
<a href="#" className="blog-item-more circle right">
|
|
||||||
Next post
|
|
||||||
<i className="mi-chevron-right" />
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
{/* End Prev/Next Post */}
|
|
||||||
</div>
|
</div>
|
||||||
{/* End Content */}
|
<p>
|
||||||
|
Morbi lacus massa, euismod ut turpis molestie, tristique
|
||||||
|
sodales est. Integer sit amet mi id sapien tempor molestie
|
||||||
|
in nec massa. Fusce non ante sed lorem rutrum feugiat.
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||||
|
Mauris non laoreet dui. Morbi lacus massa, euismod ut
|
||||||
|
turpis molestie, tristique sodales est. Integer sit amet
|
||||||
|
mi id sapien tempor molestie in nec massa.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Fusce non ante sed lorem rutrum feugiat. Vestibulum
|
||||||
|
pellentesque, purus ut dignissim consectetur, nulla
|
||||||
|
erat ultrices purus, ut consequat sem elit non sem.
|
||||||
|
Morbi lacus massa, euismod ut turpis molestie, tristique
|
||||||
|
sodales est. Integer sit amet mi id sapien tempor molestie
|
||||||
|
in nec massa. Fusce non ante sed lorem rutrum feugiat.
|
||||||
|
</p>
|
||||||
|
<blockquote>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||||
|
Integer posuere erat a ante. Vestibulum
|
||||||
|
pellentesque, purus ut dignissim consectetur, nulla erat
|
||||||
|
ultrices purus.
|
||||||
|
</p>
|
||||||
|
<footer>
|
||||||
|
Someone famous in
|
||||||
|
<cite title="Source Title"> Source Title </cite>
|
||||||
|
</footer>
|
||||||
|
</blockquote>
|
||||||
|
<p>
|
||||||
|
Praesent ultricies ut ipsum non laoreet. Nunc ac
|
||||||
|
<a href="#">ultricies</a> leo. Nulla ac ultrices arcu.
|
||||||
|
Nullam adipiscing lacus in consectetur posuere. Nunc
|
||||||
|
malesuada tellus turpis, ac pretium orci molestie vel.
|
||||||
|
Morbi lacus massa, euismod ut turpis molestie, tristique
|
||||||
|
sodales est. Integer sit amet mi id sapien tempor molestie
|
||||||
|
in nec massa. Fusce non ante sed lorem rutrum feugiat.
|
||||||
|
</p>
|
||||||
|
<ul>
|
||||||
|
<li>First item of the list</li>
|
||||||
|
<li>Second item of the list</li>
|
||||||
|
<li>Third item of the list</li>
|
||||||
|
</ul>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||||
|
Mauris non laoreet dui. Morbi lacus massa, euismod ut
|
||||||
|
turpis molestie, tristique sodales est. Integer sit amet
|
||||||
|
mi id sapien tempor molestie in nec massa. Fusce non ante
|
||||||
|
sed lorem rutrum feugiat. Vestibulum pellentesque, purus
|
||||||
|
ut dignissim consectetur, nulla erat ultrices purus,
|
||||||
|
ut consequat sem elit non sem.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
{/* End Post */}
|
||||||
{/* End Section */}
|
{/* Comments */}
|
||||||
{/* Divider */}
|
<div className="mb-80 mb-xs-40">
|
||||||
<hr className="mt-0 mb-0" />
|
<h4 className="blog-page-title">
|
||||||
{/* End Divider */}
|
Comments <small className="number">(3)</small>
|
||||||
{/* Section */}
|
</h4>
|
||||||
<section className="page-section">
|
<ul className="media-list comment-list clearlist">
|
||||||
<div className="container relative">
|
<BlogComments />
|
||||||
<div className="row mt-n60">
|
</ul>
|
||||||
<BlogWidget
|
|
||||||
inputClass="newsletter-field form-control input-md circle mb-10"
|
|
||||||
btnClass="btn btn-mod btn-color btn-medium btn-circle btn-hover-anim form-control"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
{/* End Comments */}
|
||||||
</>
|
{/* Add Comment */}
|
||||||
</main>
|
<div className="mb-80 mb-xs-40">
|
||||||
<footer className="page-section footer position-relative overflow-hidden pb-30">
|
<h4 className="blog-page-title">Leave a comment</h4>
|
||||||
<div className="bg-shape-4">
|
{/* Form */}
|
||||||
<Image
|
<CommentForm />
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
{/* End Form */}
|
||||||
width={1600}
|
</div>
|
||||||
height={268}
|
{/* End Add Comment */}
|
||||||
alt=""
|
{/* Prev/Next Post */}
|
||||||
|
<div className="clearfix mt-40">
|
||||||
|
<a href="#" className="blog-item-more circle left">
|
||||||
|
<i className="mi-chevron-left" />
|
||||||
|
Prev post
|
||||||
|
</a>
|
||||||
|
<a href="#" className="blog-item-more circle right">
|
||||||
|
Next post
|
||||||
|
<i className="mi-chevron-right" />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{/* End Prev/Next Post */}
|
||||||
|
</div>
|
||||||
|
{/* End Content */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
{/* End Section */}
|
||||||
|
{/* Divider */}
|
||||||
|
<hr className="mt-0 mb-0" />
|
||||||
|
{/* End Divider */}
|
||||||
|
{/* Section */}
|
||||||
|
<section className="page-section">
|
||||||
|
<div className="container relative">
|
||||||
|
<div className="row mt-n60">
|
||||||
|
<BlogWidget
|
||||||
|
inputClass="newsletter-field form-control input-md circle mb-10"
|
||||||
|
btnClass="btn btn-mod btn-color btn-medium btn-circle btn-hover-anim form-control"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<Footer />
|
</div>
|
||||||
</footer>
|
</section>
|
||||||
</div>
|
</>
|
||||||
</div>
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,12 +1,9 @@
|
|||||||
import Footer from "@/components/Footer";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import Blogs from "@/components/Blogs";
|
import Blogs from "@/components/Blogs";
|
||||||
|
import NewsletterForm from "@/components/NewsletterForm";
|
||||||
|
import { archiveLinks } from "@/data/archieve";
|
||||||
import { categories } from "@/data/categories";
|
import { categories } from "@/data/categories";
|
||||||
import { tags } from "@/data/tags";
|
import { tags } from "@/data/tags";
|
||||||
import { archiveLinks } from "@/data/archieve";
|
|
||||||
import { slickMultipages } from "@/data/menu";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import NewsletterForm from "@/components/NewsletterForm";
|
|
||||||
|
|
||||||
export const metadata = {
|
export const metadata = {
|
||||||
title:
|
title:
|
||||||
@ -19,137 +16,117 @@ const dark = false;
|
|||||||
export default function SlickBlogPage() {
|
export default function SlickBlogPage() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section
|
||||||
<div className="page" id="top">
|
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
||||||
<nav className="main-nav transparent stick-fixed wow-menubar wch-unset">
|
id="home"
|
||||||
<Header links={slickMultipages} />
|
>
|
||||||
</nav>
|
{/* <!-- Background Shape --> */}
|
||||||
<main id="main">
|
<div className="bg-shape-1 wow fadeIn">
|
||||||
<section
|
<Image
|
||||||
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
||||||
id="home"
|
width={1443}
|
||||||
>
|
height={844}
|
||||||
{/* <!-- Background Shape --> */}
|
alt=""
|
||||||
<div className="bg-shape-1 wow fadeIn">
|
/>
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
|
||||||
width={1443}
|
|
||||||
height={844}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/* <!-- End Background Shape --> */}
|
|
||||||
|
|
||||||
<div className="container position-relative pt-sm-40 text-center">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
|
||||||
<h1 className="hs-title-10 mb-10 wow fadeInUp">Blog</h1>
|
|
||||||
|
|
||||||
<p
|
|
||||||
className="section-descr mb-0 wow fadeInUp"
|
|
||||||
data-wow-delay="0.2s"
|
|
||||||
>
|
|
||||||
Explore captivating web design solutions.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section className="page-section" id="blog">
|
|
||||||
<Blogs />
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<>
|
|
||||||
{/* Divider */}
|
|
||||||
<hr className="mt-0 mb-0" />
|
|
||||||
{/* End Divider */}
|
|
||||||
{/* Section */}
|
|
||||||
<section className="page-section">
|
|
||||||
<div className="container relative">
|
|
||||||
<div className="row mt-n60">
|
|
||||||
<div className="col-sm-6 col-lg-3 mt-60">
|
|
||||||
{/* Widget */}
|
|
||||||
<div className="widget mb-0">
|
|
||||||
<h3 className="widget-title">Categories</h3>
|
|
||||||
<div className="widget-body">
|
|
||||||
<ul className="clearlist widget-menu">
|
|
||||||
{categories.map((elm, i) => (
|
|
||||||
<li key={i}>
|
|
||||||
<a href="#" title="">
|
|
||||||
{elm.name}
|
|
||||||
</a>
|
|
||||||
<small> - {elm.count} </small>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Widget */}
|
|
||||||
</div>
|
|
||||||
<div className="col-sm-6 col-lg-3 mt-60">
|
|
||||||
{/* Widget */}
|
|
||||||
<div className="widget mb-0">
|
|
||||||
<h3 className="widget-title">Tags</h3>
|
|
||||||
<div className="widget-body">
|
|
||||||
<div className="tags">
|
|
||||||
{tags.map((elm, i) => (
|
|
||||||
<a key={i} href="">
|
|
||||||
{elm.name}
|
|
||||||
</a>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Widget */}
|
|
||||||
</div>
|
|
||||||
<div className="col-sm-6 col-lg-3 mt-60">
|
|
||||||
{/* Widget */}
|
|
||||||
<div className="widget mb-0">
|
|
||||||
<h3 className="widget-title">Archive</h3>
|
|
||||||
<div className="widget-body">
|
|
||||||
<ul className="clearlist widget-menu">
|
|
||||||
{archiveLinks.map((elm, i) => (
|
|
||||||
<li key={i}>
|
|
||||||
<a href="#" title="">
|
|
||||||
{elm.date}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Widget */}
|
|
||||||
</div>
|
|
||||||
<div className="col-sm-6 col-lg-3 mt-60">
|
|
||||||
{/* Widget */}
|
|
||||||
<div className="widget mb-0">
|
|
||||||
<h3 className="widget-title">Newsletter</h3>
|
|
||||||
<div className="widget-body">
|
|
||||||
<div className="widget-text clearfix">
|
|
||||||
<NewsletterForm />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Widget */}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</>
|
|
||||||
</main>
|
|
||||||
<footer className="page-section footer position-relative overflow-hidden pb-30">
|
|
||||||
<div className="bg-shape-4">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
|
||||||
width={1600}
|
|
||||||
height={268}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<Footer />
|
|
||||||
</footer>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
{/* <!-- End Background Shape --> */}
|
||||||
|
|
||||||
|
<div className="container position-relative pt-sm-40 text-center">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">Blog</h1>
|
||||||
|
|
||||||
|
<p
|
||||||
|
className="section-descr mb-0 wow fadeInUp"
|
||||||
|
data-wow-delay="0.2s"
|
||||||
|
>
|
||||||
|
Explore captivating web design solutions.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section className="page-section" id="blog">
|
||||||
|
<Blogs />
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<>
|
||||||
|
{/* Divider */}
|
||||||
|
<hr className="mt-0 mb-0" />
|
||||||
|
{/* End Divider */}
|
||||||
|
{/* Section */}
|
||||||
|
<section className="page-section">
|
||||||
|
<div className="container relative">
|
||||||
|
<div className="row mt-n60">
|
||||||
|
<div className="col-sm-6 col-lg-3 mt-60">
|
||||||
|
{/* Widget */}
|
||||||
|
<div className="widget mb-0">
|
||||||
|
<h3 className="widget-title">Categories</h3>
|
||||||
|
<div className="widget-body">
|
||||||
|
<ul className="clearlist widget-menu">
|
||||||
|
{categories.map((elm, i) => (
|
||||||
|
<li key={i}>
|
||||||
|
<a href="#" title="">
|
||||||
|
{elm.name}
|
||||||
|
</a>
|
||||||
|
<small> - {elm.count} </small>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Widget */}
|
||||||
|
</div>
|
||||||
|
<div className="col-sm-6 col-lg-3 mt-60">
|
||||||
|
{/* Widget */}
|
||||||
|
<div className="widget mb-0">
|
||||||
|
<h3 className="widget-title">Tags</h3>
|
||||||
|
<div className="widget-body">
|
||||||
|
<div className="tags">
|
||||||
|
{tags.map((elm, i) => (
|
||||||
|
<a key={i} href="">
|
||||||
|
{elm.name}
|
||||||
|
</a>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Widget */}
|
||||||
|
</div>
|
||||||
|
<div className="col-sm-6 col-lg-3 mt-60">
|
||||||
|
{/* Widget */}
|
||||||
|
<div className="widget mb-0">
|
||||||
|
<h3 className="widget-title">Archive</h3>
|
||||||
|
<div className="widget-body">
|
||||||
|
<ul className="clearlist widget-menu">
|
||||||
|
{archiveLinks.map((elm, i) => (
|
||||||
|
<li key={i}>
|
||||||
|
<a href="#" title="">
|
||||||
|
{elm.date}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Widget */}
|
||||||
|
</div>
|
||||||
|
<div className="col-sm-6 col-lg-3 mt-60">
|
||||||
|
{/* Widget */}
|
||||||
|
<div className="widget mb-0">
|
||||||
|
<h3 className="widget-title">Newsletter</h3>
|
||||||
|
<div className="widget-body">
|
||||||
|
<div className="widget-text clearfix">
|
||||||
|
<NewsletterForm />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Widget */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,9 +1,6 @@
|
|||||||
import Footer from "@/components/Footer";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import Contact from "@/components/Contact";
|
import Contact from "@/components/Contact";
|
||||||
import ContactDark from "@/components/ContactDark";
|
import ContactDark from "@/components/ContactDark";
|
||||||
import Faq from "@/components/Faq";
|
import Faq from "@/components/Faq";
|
||||||
import { slickMultipagesDark } from "@/data/menu";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
|
|
||||||
export const metadata = {
|
export const metadata = {
|
||||||
@ -17,110 +14,85 @@ const dark = true;
|
|||||||
export default function SlickContactPageDark() {
|
export default function SlickContactPageDark() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section
|
||||||
<div className="dark-mode">
|
className="page-section bg-dark-1 bg-gradient-gray-dark-1 light-content bg-scroll overflow-hidden"
|
||||||
<div className="page bg-dark-1" id="top">
|
id="home"
|
||||||
<nav className="main-nav dark dark-mode transparent stick-fixed wow-menubar wch-unset">
|
>
|
||||||
<Header links={slickMultipagesDark} />
|
{/* <!-- Background Shape --> */}
|
||||||
</nav>
|
<div className="bg-shape-1 opacity-003">
|
||||||
<main id="main">
|
<Image
|
||||||
<section
|
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
||||||
className="page-section bg-dark-1 bg-gradient-gray-dark-1 light-content bg-scroll overflow-hidden"
|
width={1443}
|
||||||
id="home"
|
height={844}
|
||||||
>
|
alt=""
|
||||||
{/* <!-- Background Shape --> */}
|
/>
|
||||||
<div className="bg-shape-1 opacity-003">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
|
||||||
width={1443}
|
|
||||||
height={844}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/* <!-- End Background Shape --> */}
|
|
||||||
|
|
||||||
<div className="container position-relative pt-sm-40 text-center">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
|
||||||
<h1 className="hs-title-10 mb-10 wow fadeInUp">
|
|
||||||
Contact Us
|
|
||||||
</h1>
|
|
||||||
|
|
||||||
<p
|
|
||||||
className="section-descr mb-0 wow fadeInUp"
|
|
||||||
data-wow-delay="0.2s"
|
|
||||||
>
|
|
||||||
Crafting immersive digital journeys for brands.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section
|
|
||||||
className={`page-section scrollSpysection ${
|
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
|
||||||
} `}
|
|
||||||
id="contact"
|
|
||||||
>
|
|
||||||
{dark ? <ContactDark /> : <Contact />}
|
|
||||||
</section>
|
|
||||||
<hr className={`mt-0 mb-0 ${dark ? "white" : ""} `} />
|
|
||||||
<section className="page-section bg-dark-1 light-content z-index-1">
|
|
||||||
<div className="container position-relative">
|
|
||||||
{/* Decorative Waves */}
|
|
||||||
<div className="position-relative">
|
|
||||||
<div
|
|
||||||
className="decoration-21 opacity-07 d-none d-lg-block"
|
|
||||||
data-rellax-y=""
|
|
||||||
data-rellax-speed="0.7"
|
|
||||||
data-rellax-percentage="0.35"
|
|
||||||
>
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/decoration-4.svg"
|
|
||||||
alt=""
|
|
||||||
width={148}
|
|
||||||
height={148}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Decorative Waves */}
|
|
||||||
<div className="row position-relative">
|
|
||||||
<div className="col-md-6 col-lg-5 mb-md-50 mb-sm-30">
|
|
||||||
<h3 className="section-title mb-30">
|
|
||||||
Frequently Asked Questions
|
|
||||||
</h3>
|
|
||||||
<p className="text-gray mb-0">
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
|
||||||
Nam pulvinar vitae neque et porttitor. Integer non
|
|
||||||
dapibus diam, ac eleifend lectus lorem ipsum. In maximus
|
|
||||||
ligula semper metus pellentesque mattis. Maecenas
|
|
||||||
volutpat, diam enim sagittis quam.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="col-md-6 offset-lg-1 pt-10 pt-sm-0">
|
|
||||||
{/* Accordion */}
|
|
||||||
<Faq />
|
|
||||||
{/* End Accordion */}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
<footer className="page-section dark footer bg-dark-2 light-content position-relative overflow-hidden pb-30">
|
|
||||||
<div className="bg-shape-4 opacity-003">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
|
||||||
width={1600}
|
|
||||||
height={268}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<Footer />
|
|
||||||
</footer>
|
|
||||||
</div>{" "}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
{/* <!-- End Background Shape --> */}
|
||||||
|
|
||||||
|
<div className="container position-relative pt-sm-40 text-center">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">Contact Us</h1>
|
||||||
|
|
||||||
|
<p
|
||||||
|
className="section-descr mb-0 wow fadeInUp"
|
||||||
|
data-wow-delay="0.2s"
|
||||||
|
>
|
||||||
|
Crafting immersive digital journeys for brands.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section
|
||||||
|
className={`page-section scrollSpysection ${
|
||||||
|
dark ? "bg-dark-1 light-content" : ""
|
||||||
|
} `}
|
||||||
|
id="contact"
|
||||||
|
>
|
||||||
|
{dark ? <ContactDark /> : <Contact />}
|
||||||
|
</section>
|
||||||
|
<hr className={`mt-0 mb-0 ${dark ? "white" : ""} `} />
|
||||||
|
<section className="page-section bg-dark-1 light-content z-index-1">
|
||||||
|
<div className="container position-relative">
|
||||||
|
{/* Decorative Waves */}
|
||||||
|
<div className="position-relative">
|
||||||
|
<div
|
||||||
|
className="decoration-21 opacity-07 d-none d-lg-block"
|
||||||
|
data-rellax-y=""
|
||||||
|
data-rellax-speed="0.7"
|
||||||
|
data-rellax-percentage="0.35"
|
||||||
|
>
|
||||||
|
<Image
|
||||||
|
src="/assets/images/demo-slick/decoration-4.svg"
|
||||||
|
alt=""
|
||||||
|
width={148}
|
||||||
|
height={148}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Decorative Waves */}
|
||||||
|
<div className="row position-relative">
|
||||||
|
<div className="col-md-6 col-lg-5 mb-md-50 mb-sm-30">
|
||||||
|
<h3 className="section-title mb-30">
|
||||||
|
Frequently Asked Questions
|
||||||
|
</h3>
|
||||||
|
<p className="text-gray mb-0">
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam
|
||||||
|
pulvinar vitae neque et porttitor. Integer non dapibus diam, ac
|
||||||
|
eleifend lectus lorem ipsum. In maximus ligula semper metus
|
||||||
|
pellentesque mattis. Maecenas volutpat, diam enim sagittis quam.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6 offset-lg-1 pt-10 pt-sm-0">
|
||||||
|
{/* Accordion */}
|
||||||
|
<Faq />
|
||||||
|
{/* End Accordion */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,10 +1,7 @@
|
|||||||
import Footer from "@/components/Footer";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import Contact from "@/components/Contact";
|
import Contact from "@/components/Contact";
|
||||||
import ContactDark from "@/components/ContactDark";
|
import ContactDark from "@/components/ContactDark";
|
||||||
import Faq from "@/components/Faq";
|
import Faq from "@/components/Faq";
|
||||||
|
|
||||||
import { slickMultipages } from "@/data/menu";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
|
|
||||||
export const metadata = {
|
export const metadata = {
|
||||||
@ -13,113 +10,91 @@ export const metadata = {
|
|||||||
description:
|
description:
|
||||||
"Resonance — One & Multi Page React Nextjs Creative Template",
|
"Resonance — One & Multi Page React Nextjs Creative Template",
|
||||||
};
|
};
|
||||||
const onePage = false;
|
|
||||||
const dark = false;
|
const dark = false;
|
||||||
|
|
||||||
export default function SlickContactPage() {
|
export default function SlickContactPage() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section
|
||||||
<div className="page" id="top">
|
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
||||||
<nav className="main-nav transparent stick-fixed wow-menubar wch-unset">
|
id="home"
|
||||||
<Header links={slickMultipages} />
|
>
|
||||||
</nav>
|
{/* <!-- Background Shape --> */}
|
||||||
<main id="main">
|
<div className="bg-shape-1 wow fadeIn">
|
||||||
<section
|
<Image
|
||||||
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
||||||
id="home"
|
width={1443}
|
||||||
|
height={844}
|
||||||
|
alt=""
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
{/* <!-- End Background Shape --> */}
|
||||||
|
|
||||||
|
<div className="container position-relative pt-sm-40 text-center">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">Contact Us</h1>
|
||||||
|
|
||||||
|
<p
|
||||||
|
className="section-descr mb-0 wow fadeInUp"
|
||||||
|
data-wow-delay="0.2s"
|
||||||
|
>
|
||||||
|
Crafting immersive digital journeys for brands.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section
|
||||||
|
className={`page-section scrollSpysection ${
|
||||||
|
dark ? "bg-dark-1 light-content" : ""
|
||||||
|
} `}
|
||||||
|
id="contact"
|
||||||
|
>
|
||||||
|
{dark ? <ContactDark /> : <Contact />}
|
||||||
|
</section>
|
||||||
|
<hr className={`mt-0 mb-0 ${dark ? "white" : ""} `} />
|
||||||
|
<section className="page-section z-index-1">
|
||||||
|
<div className="container position-relative">
|
||||||
|
{/* Decorative Waves */}
|
||||||
|
<div className="position-relative">
|
||||||
|
<div
|
||||||
|
className="decoration-21 opacity-07 d-none d-lg-block"
|
||||||
|
data-rellax-y=""
|
||||||
|
data-rellax-speed="0.7"
|
||||||
|
data-rellax-percentage="0.35"
|
||||||
>
|
>
|
||||||
{/* <!-- Background Shape --> */}
|
|
||||||
<div className="bg-shape-1 wow fadeIn">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
|
||||||
width={1443}
|
|
||||||
height={844}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/* <!-- End Background Shape --> */}
|
|
||||||
|
|
||||||
<div className="container position-relative pt-sm-40 text-center">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
|
||||||
<h1 className="hs-title-10 mb-10 wow fadeInUp">
|
|
||||||
Contact Us
|
|
||||||
</h1>
|
|
||||||
|
|
||||||
<p
|
|
||||||
className="section-descr mb-0 wow fadeInUp"
|
|
||||||
data-wow-delay="0.2s"
|
|
||||||
>
|
|
||||||
Crafting immersive digital journeys for brands.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section
|
|
||||||
className={`page-section scrollSpysection ${
|
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
|
||||||
} `}
|
|
||||||
id="contact"
|
|
||||||
>
|
|
||||||
{dark ? <ContactDark /> : <Contact />}
|
|
||||||
</section>
|
|
||||||
<hr className={`mt-0 mb-0 ${dark ? "white" : ""} `} />
|
|
||||||
<section className="page-section z-index-1">
|
|
||||||
<div className="container position-relative">
|
|
||||||
{/* Decorative Waves */}
|
|
||||||
<div className="position-relative">
|
|
||||||
<div
|
|
||||||
className="decoration-21 opacity-07 d-none d-lg-block"
|
|
||||||
data-rellax-y=""
|
|
||||||
data-rellax-speed="0.7"
|
|
||||||
data-rellax-percentage="0.35"
|
|
||||||
>
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/decoration-4.svg"
|
|
||||||
alt=""
|
|
||||||
width={148}
|
|
||||||
height={148}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Decorative Waves */}
|
|
||||||
<div className="row position-relative">
|
|
||||||
<div className="col-md-6 col-lg-5 mb-md-50 mb-sm-30">
|
|
||||||
<h3 className="section-title mb-30">
|
|
||||||
Frequently Asked Questions
|
|
||||||
</h3>
|
|
||||||
<p className="text-gray mb-0">
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
|
||||||
Nam pulvinar vitae neque et porttitor. Integer non dapibus
|
|
||||||
diam, ac eleifend lectus lorem ipsum. In maximus ligula
|
|
||||||
semper metus pellentesque mattis. Maecenas volutpat, diam
|
|
||||||
enim sagittis quam.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="col-md-6 offset-lg-1 pt-10 pt-sm-0">
|
|
||||||
{/* Accordion */}
|
|
||||||
<Faq />
|
|
||||||
{/* End Accordion */}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
<footer className="page-section footer position-relative overflow-hidden pb-30">
|
|
||||||
<div className="bg-shape-4">
|
|
||||||
<Image
|
<Image
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
src="/assets/images/demo-slick/decoration-4.svg"
|
||||||
width={1600}
|
|
||||||
height={268}
|
|
||||||
alt=""
|
alt=""
|
||||||
|
width={148}
|
||||||
|
height={148}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<Footer />
|
</div>
|
||||||
</footer>
|
{/* End Decorative Waves */}
|
||||||
|
<div className="row position-relative">
|
||||||
|
<div className="col-md-6 col-lg-5 mb-md-50 mb-sm-30">
|
||||||
|
<h3 className="section-title mb-30">
|
||||||
|
Frequently Asked Questions
|
||||||
|
</h3>
|
||||||
|
<p className="text-gray mb-0">
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam
|
||||||
|
pulvinar vitae neque et porttitor. Integer non dapibus diam, ac
|
||||||
|
eleifend lectus lorem ipsum. In maximus ligula semper metus
|
||||||
|
pellentesque mattis. Maecenas volutpat, diam enim sagittis quam.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6 offset-lg-1 pt-10 pt-sm-0">
|
||||||
|
{/* Accordion */}
|
||||||
|
<Faq />
|
||||||
|
{/* End Accordion */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,8 +1,5 @@
|
|||||||
import Footer from "@/components/Footer";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import Portfolio from "@/components/Portfolio";
|
import Portfolio from "@/components/Portfolio";
|
||||||
|
|
||||||
import { slickMultipages } from "@/data/menu";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
|
|
||||||
@ -17,107 +14,85 @@ const dark = false;
|
|||||||
export default function SlickPortfolioPage() {
|
export default function SlickPortfolioPage() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section
|
||||||
<div className="page" id="top">
|
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
||||||
<nav className="main-nav transparent stick-fixed wow-menubar wch-unset">
|
id="home"
|
||||||
<Header links={slickMultipages} />
|
>
|
||||||
</nav>
|
{/* <!-- Background Shape --> */}
|
||||||
<main id="main">
|
<div className="bg-shape-1 wow fadeIn">
|
||||||
<section
|
<Image
|
||||||
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
||||||
id="home"
|
width={1443}
|
||||||
>
|
height={844}
|
||||||
{/* <!-- Background Shape --> */}
|
alt=""
|
||||||
<div className="bg-shape-1 wow fadeIn">
|
/>
|
||||||
<Image
|
</div>
|
||||||
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
{/* <!-- End Background Shape --> */}
|
||||||
width={1443}
|
|
||||||
height={844}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/* <!-- End Background Shape --> */}
|
|
||||||
|
|
||||||
<div className="container position-relative pt-sm-40 text-center">
|
<div className="container position-relative pt-sm-40 text-center">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">Portfolio</h1>
|
||||||
|
|
||||||
|
<p
|
||||||
|
className="section-descr mb-0 wow fadeInUp"
|
||||||
|
data-wow-delay="0.2s"
|
||||||
|
>
|
||||||
|
Explore captivating web design solutions.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section
|
||||||
|
className={`page-section scrollSpysection ${
|
||||||
|
dark ? "bg-dark-1 light-content" : ""
|
||||||
|
} `}
|
||||||
|
id="portfolio"
|
||||||
|
>
|
||||||
|
<div className="container position-relative">
|
||||||
|
<Portfolio />
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="page-section pt-0">
|
||||||
|
<div className="container">
|
||||||
|
<div
|
||||||
|
className={`small-section ${
|
||||||
|
dark ? "bg-dark-2 light-content" : "bg-gray-light-1"
|
||||||
|
} ps-4 ps-lg-0 pe-4 pe-lg-0 round position-relative overflow-hidden`}
|
||||||
|
>
|
||||||
|
{/* Decoration Circles */}
|
||||||
|
<div className="decoration-12" />
|
||||||
|
<div className="decoration-13" />
|
||||||
|
{/* End Decoration Circles */}
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
<div className="col-md-7 col-lg-8 text-center text-md-start mb-sm-20">
|
||||||
<h1 className="hs-title-10 mb-10 wow fadeInUp">
|
<h2 className="section-title-small mb-20">
|
||||||
Portfolio
|
Like our creative works?
|
||||||
</h1>
|
</h2>
|
||||||
|
<p className="text-gray mb-0">
|
||||||
<p
|
Quisque posuere mollis ullamcorper. Ut eget metus lorem
|
||||||
className="section-descr mb-0 wow fadeInUp"
|
ipsum posuere eget at ex. Aenean consequat vitae lorem in
|
||||||
data-wow-delay="0.2s"
|
vehicula.
|
||||||
>
|
|
||||||
Explore captivating web design solutions.
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="col-md-5 col-lg-4 text-center text-md-end pt-2">
|
||||||
</div>
|
<Link
|
||||||
</section>
|
href={`/slick-portfolio${dark ? "-dark" : ""}`}
|
||||||
<section
|
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim"
|
||||||
className={`page-section scrollSpysection ${
|
>
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
<span>View all works</span>
|
||||||
} `}
|
</Link>
|
||||||
id="portfolio"
|
|
||||||
>
|
|
||||||
<div className="container position-relative">
|
|
||||||
<Portfolio />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section className="page-section pt-0">
|
|
||||||
<div className="container">
|
|
||||||
<div
|
|
||||||
className={`small-section ${
|
|
||||||
dark ? "bg-dark-2 light-content" : "bg-gray-light-1"
|
|
||||||
} ps-4 ps-lg-0 pe-4 pe-lg-0 round position-relative overflow-hidden`}
|
|
||||||
>
|
|
||||||
{/* Decoration Circles */}
|
|
||||||
<div className="decoration-12" />
|
|
||||||
<div className="decoration-13" />
|
|
||||||
{/* End Decoration Circles */}
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-7 col-lg-8 text-center text-md-start mb-sm-20">
|
|
||||||
<h2 className="section-title-small mb-20">
|
|
||||||
Like our creative works?
|
|
||||||
</h2>
|
|
||||||
<p className="text-gray mb-0">
|
|
||||||
Quisque posuere mollis ullamcorper. Ut eget metus
|
|
||||||
lorem ipsum posuere eget at ex. Aenean consequat
|
|
||||||
vitae lorem in vehicula.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="col-md-5 col-lg-4 text-center text-md-end pt-2">
|
|
||||||
<Link
|
|
||||||
href={`/slick-portfolio${dark ? "-dark" : ""}`}
|
|
||||||
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim"
|
|
||||||
>
|
|
||||||
<span>View all works</span>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
<footer className="page-section footer position-relative overflow-hidden pb-30">
|
|
||||||
<div className="bg-shape-4">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
|
||||||
width={1600}
|
|
||||||
height={268}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<Footer />
|
</div>
|
||||||
</footer>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,9 +1,6 @@
|
|||||||
import Footer from "@/components/Footer";
|
|
||||||
import Header from "@/components/Header";
|
|
||||||
import Features from "@/components/Features";
|
import Features from "@/components/Features";
|
||||||
import Service from "@/components/Service";
|
import Service from "@/components/Service";
|
||||||
|
|
||||||
import { slickMultipages } from "@/data/menu";
|
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
|
|
||||||
@ -18,245 +15,218 @@ const dark = false;
|
|||||||
export default function SlickServicesPage() {
|
export default function SlickServicesPage() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="theme-slick">
|
<section
|
||||||
<div className="page" id="top">
|
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
||||||
<nav className="main-nav transparent stick-fixed wow-menubar wch-unset">
|
id="home"
|
||||||
<Header links={slickMultipages} />
|
>
|
||||||
</nav>
|
{/* <!-- Background Shape --> */}
|
||||||
<main id="main">
|
<div className="bg-shape-1 wow fadeIn">
|
||||||
<section
|
<Image
|
||||||
className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
|
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
||||||
id="home"
|
width={1443}
|
||||||
>
|
height={844}
|
||||||
{/* <!-- Background Shape --> */}
|
alt=""
|
||||||
<div className="bg-shape-1 wow fadeIn">
|
/>
|
||||||
<Image
|
</div>
|
||||||
src="/assets/images/demo-fancy/bg-shape-1.svg"
|
{/* <!-- End Background Shape --> */}
|
||||||
width={1443}
|
|
||||||
height={844}
|
<div className="container position-relative pt-sm-40 text-center">
|
||||||
alt=""
|
<div className="row">
|
||||||
/>
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
||||||
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">Our Services</h1>
|
||||||
|
|
||||||
|
<p
|
||||||
|
className="section-descr mb-0 wow fadeInUp"
|
||||||
|
data-wow-delay="0.2s"
|
||||||
|
>
|
||||||
|
Web design that leaves an impression.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section
|
||||||
|
className={`page-section scrollSpysection ${
|
||||||
|
dark ? "bg-dark-1 light-content" : ""
|
||||||
|
} `}
|
||||||
|
id="services"
|
||||||
|
>
|
||||||
|
<div className="container position-relative">
|
||||||
|
<div className="row">
|
||||||
|
{/* Left Column */}
|
||||||
|
<div className="col-lg-5 mb-md-60 mb-sm-40">
|
||||||
|
<h2 className="section-caption-slick mb-30 mb-sm-20">
|
||||||
|
WHAT WE DO
|
||||||
|
</h2>
|
||||||
|
<h3 className="section-title mb-30">
|
||||||
|
We provide the best development solutions.
|
||||||
|
</h3>
|
||||||
|
<p className="section-descr mb-50 mb-sm-40">
|
||||||
|
The power of design help us to solve complex problems and
|
||||||
|
cultivate business solutions.
|
||||||
|
</p>
|
||||||
|
<div className="local-scroll">
|
||||||
|
<Link
|
||||||
|
href={`/slick-contact${dark ? "-dark" : ""}`}
|
||||||
|
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim mb-xs-10"
|
||||||
|
>
|
||||||
|
<span>Request a quote</span>
|
||||||
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
{/* <!-- End Background Shape --> */}
|
</div>
|
||||||
|
{/* End Left Column */}
|
||||||
<div className="container position-relative pt-sm-40 text-center">
|
{/* Right Column */}
|
||||||
<div className="row">
|
<Service />
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
{/* End Right Column */}
|
||||||
<h1 className="hs-title-10 mb-10 wow fadeInUp">
|
</div>
|
||||||
Our Services
|
<div className="page-section">
|
||||||
</h1>
|
<hr className="mt-0 mb-0" />
|
||||||
|
</div>
|
||||||
<p
|
<div className="row mb-50 mb-sm-50">
|
||||||
className="section-descr mb-0 wow fadeInUp"
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2 col-xl-6 offset-xl-3 text-center">
|
||||||
data-wow-delay="0.2s"
|
<h2 className="section-title-small mb-20">
|
||||||
>
|
Why choose Resonance?
|
||||||
Web design that leaves an impression.
|
</h2>
|
||||||
</p>
|
<p className="text-gray mb-0">
|
||||||
</div>
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
||||||
|
eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* Features Grid */}
|
||||||
|
<Features />
|
||||||
|
{/* End Features Grid */}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<hr className={`mt-0 mb-0 ${dark ? "white" : ""} `} />
|
||||||
|
<section
|
||||||
|
className={`page-section ${dark ? "bg-dark-1 light-content" : ""}`}
|
||||||
|
>
|
||||||
|
<div className="container position-relative">
|
||||||
|
<div className="row">
|
||||||
|
{/* Images */}
|
||||||
|
<div className="col-lg-7 d-flex align-items-start mb-md-60 mb-xs-30">
|
||||||
|
<div className="call-action-2-images">
|
||||||
|
<div
|
||||||
|
className="call-action-2-image-1"
|
||||||
|
data-rellax-y=""
|
||||||
|
data-rellax-speed="0.5"
|
||||||
|
data-rellax-percentage="0.7"
|
||||||
|
>
|
||||||
|
<Image
|
||||||
|
width={386}
|
||||||
|
height={400}
|
||||||
|
src="/assets/images/promo-3.jpg"
|
||||||
|
alt="Image Description"
|
||||||
|
className="wow scaleOutIn"
|
||||||
|
data-wow-duration="1.2s"
|
||||||
|
data-wow-offset={255}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="call-action-2-image-2">
|
||||||
|
<Image
|
||||||
|
width={810}
|
||||||
|
height={512}
|
||||||
|
src="/assets/images/promo-4.jpg"
|
||||||
|
alt="Image Description"
|
||||||
|
className="wow scaleOutIn"
|
||||||
|
data-wow-duration="1.2s"
|
||||||
|
data-wow-offset={134}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className="call-action-2-image-3"
|
||||||
|
data-rellax-y=""
|
||||||
|
data-rellax-speed="-0.5"
|
||||||
|
data-rellax-percentage="0.5"
|
||||||
|
>
|
||||||
|
<Image
|
||||||
|
width={386}
|
||||||
|
height={500}
|
||||||
|
src="/assets/images/promo-5.jpg"
|
||||||
|
alt="Image Description"
|
||||||
|
className="wow scaleOutIn"
|
||||||
|
data-wow-duration="1.2s"
|
||||||
|
data-wow-offset={0}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</div>
|
||||||
<section
|
{/* End Images */}
|
||||||
className={`page-section scrollSpysection ${
|
{/* Text */}
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
<div className="col-lg-5 d-flex align-items-center">
|
||||||
} `}
|
<div
|
||||||
id="services"
|
className="wow fadeInUp"
|
||||||
>
|
data-wow-duration="1.2s"
|
||||||
<div className="container position-relative">
|
data-wow-offset="255"
|
||||||
|
>
|
||||||
|
<h2 className="section-caption-slick mb-30 mb-sm-20">
|
||||||
|
How we work?
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<h2 className="section-title mb-30">
|
||||||
|
Get the power of the professional services
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<p className="text-gray">
|
||||||
|
Pellentesque ultrices purus sit amet velit eleifend, eu
|
||||||
|
iaculis velit malesuada. Proin id mattis elit. Nullam a nisi
|
||||||
|
tellus. Mauris rhoncus diam in sem maximus, nec luctus justo
|
||||||
|
imperdiet. Etiam fermentum vehicula faucibus.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p className="text-gray mb-0">
|
||||||
|
Praesent ullamcorper urna id arcu molestie scelerisque. Sed
|
||||||
|
imperdiet tristique mauris et faucibus. Maecenas semper augue
|
||||||
|
non fringilla placerat. Curabitur luctus erat sit amet
|
||||||
|
ultricies aliquam. Donec dictum convallis mauris et maximus.
|
||||||
|
Nullam massa arcu, porta quis felis et, eleifend varius quam.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* End Text */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="page-section pt-0">
|
||||||
|
<div className="container">
|
||||||
|
<div
|
||||||
|
className={`small-section ${
|
||||||
|
dark ? "bg-dark-2 light-content" : "bg-gray-light-1"
|
||||||
|
} ps-4 ps-lg-0 pe-4 pe-lg-0 round position-relative overflow-hidden`}
|
||||||
|
>
|
||||||
|
{/* Decoration Circles */}
|
||||||
|
<div className="decoration-12" />
|
||||||
|
<div className="decoration-13" />
|
||||||
|
{/* End Decoration Circles */}
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
|
||||||
<div className="row">
|
<div className="row">
|
||||||
{/* Left Column */}
|
<div className="col-md-7 col-lg-8 text-center text-md-start mb-sm-20">
|
||||||
<div className="col-lg-5 mb-md-60 mb-sm-40">
|
|
||||||
<h2 className="section-caption-slick mb-30 mb-sm-20">
|
|
||||||
WHAT WE DO
|
|
||||||
</h2>
|
|
||||||
<h3 className="section-title mb-30">
|
|
||||||
We provide the best development solutions.
|
|
||||||
</h3>
|
|
||||||
<p className="section-descr mb-50 mb-sm-40">
|
|
||||||
The power of design help us to solve complex problems and
|
|
||||||
cultivate business solutions.
|
|
||||||
</p>
|
|
||||||
<div className="local-scroll">
|
|
||||||
<Link
|
|
||||||
href={`/slick-contact${dark ? "-dark" : ""}`}
|
|
||||||
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim mb-xs-10"
|
|
||||||
>
|
|
||||||
<span>Request a quote</span>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Left Column */}
|
|
||||||
{/* Right Column */}
|
|
||||||
<Service />
|
|
||||||
{/* End Right Column */}
|
|
||||||
</div>
|
|
||||||
<div className="page-section">
|
|
||||||
<hr className="mt-0 mb-0" />
|
|
||||||
</div>
|
|
||||||
<div className="row mb-50 mb-sm-50">
|
|
||||||
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2 col-xl-6 offset-xl-3 text-center">
|
|
||||||
<h2 className="section-title-small mb-20">
|
<h2 className="section-title-small mb-20">
|
||||||
Why choose Resonance?
|
Like our creative works?
|
||||||
</h2>
|
</h2>
|
||||||
<p className="text-gray mb-0">
|
<p className="text-gray mb-0">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
Quisque posuere mollis ullamcorper. Ut eget metus lorem
|
||||||
sed do eiusmod tempor incididunt ut labore et dolore magna
|
ipsum posuere eget at ex. Aenean consequat vitae lorem in
|
||||||
aliqua.
|
vehicula.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="col-md-5 col-lg-4 text-center text-md-end pt-2">
|
||||||
{/* Features Grid */}
|
<Link
|
||||||
<Features />
|
href={`/slick-portfolio${dark ? "-dark" : ""}`}
|
||||||
{/* End Features Grid */}
|
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim"
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<hr className={`mt-0 mb-0 ${dark ? "white" : ""} `} />
|
|
||||||
<section
|
|
||||||
className={`page-section ${
|
|
||||||
dark ? "bg-dark-1 light-content" : ""
|
|
||||||
}`}
|
|
||||||
>
|
|
||||||
<div className="container position-relative">
|
|
||||||
<div className="row">
|
|
||||||
{/* Images */}
|
|
||||||
<div className="col-lg-7 d-flex align-items-start mb-md-60 mb-xs-30">
|
|
||||||
<div className="call-action-2-images">
|
|
||||||
<div
|
|
||||||
className="call-action-2-image-1"
|
|
||||||
data-rellax-y=""
|
|
||||||
data-rellax-speed="0.5"
|
|
||||||
data-rellax-percentage="0.7"
|
|
||||||
>
|
|
||||||
<Image
|
|
||||||
width={386}
|
|
||||||
height={400}
|
|
||||||
src="/assets/images/promo-3.jpg"
|
|
||||||
alt="Image Description"
|
|
||||||
className="wow scaleOutIn"
|
|
||||||
data-wow-duration="1.2s"
|
|
||||||
data-wow-offset={255}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="call-action-2-image-2">
|
|
||||||
<Image
|
|
||||||
width={810}
|
|
||||||
height={512}
|
|
||||||
src="/assets/images/promo-4.jpg"
|
|
||||||
alt="Image Description"
|
|
||||||
className="wow scaleOutIn"
|
|
||||||
data-wow-duration="1.2s"
|
|
||||||
data-wow-offset={134}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
className="call-action-2-image-3"
|
|
||||||
data-rellax-y=""
|
|
||||||
data-rellax-speed="-0.5"
|
|
||||||
data-rellax-percentage="0.5"
|
|
||||||
>
|
|
||||||
<Image
|
|
||||||
width={386}
|
|
||||||
height={500}
|
|
||||||
src="/assets/images/promo-5.jpg"
|
|
||||||
alt="Image Description"
|
|
||||||
className="wow scaleOutIn"
|
|
||||||
data-wow-duration="1.2s"
|
|
||||||
data-wow-offset={0}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Images */}
|
|
||||||
{/* Text */}
|
|
||||||
<div className="col-lg-5 d-flex align-items-center">
|
|
||||||
<div
|
|
||||||
className="wow fadeInUp"
|
|
||||||
data-wow-duration="1.2s"
|
|
||||||
data-wow-offset="255"
|
|
||||||
>
|
>
|
||||||
<h2 className="section-caption-slick mb-30 mb-sm-20">
|
<span>View all works</span>
|
||||||
How we work?
|
</Link>
|
||||||
</h2>
|
|
||||||
|
|
||||||
<h2 className="section-title mb-30">
|
|
||||||
Get the power of the professional services
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
<p className="text-gray">
|
|
||||||
Pellentesque ultrices purus sit amet velit eleifend, eu
|
|
||||||
iaculis velit malesuada. Proin id mattis elit. Nullam a
|
|
||||||
nisi tellus. Mauris rhoncus diam in sem maximus, nec
|
|
||||||
luctus justo imperdiet. Etiam fermentum vehicula
|
|
||||||
faucibus.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p className="text-gray mb-0">
|
|
||||||
Praesent ullamcorper urna id arcu molestie scelerisque.
|
|
||||||
Sed imperdiet tristique mauris et faucibus. Maecenas
|
|
||||||
semper augue non fringilla placerat. Curabitur luctus
|
|
||||||
erat sit amet ultricies aliquam. Donec dictum convallis
|
|
||||||
mauris et maximus. Nullam massa arcu, porta quis felis
|
|
||||||
et, eleifend varius quam.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* End Text */}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section className="page-section pt-0">
|
|
||||||
<div className="container">
|
|
||||||
<div
|
|
||||||
className={`small-section ${
|
|
||||||
dark ? "bg-dark-2 light-content" : "bg-gray-light-1"
|
|
||||||
} ps-4 ps-lg-0 pe-4 pe-lg-0 round position-relative overflow-hidden`}
|
|
||||||
>
|
|
||||||
{/* Decoration Circles */}
|
|
||||||
<div className="decoration-12" />
|
|
||||||
<div className="decoration-13" />
|
|
||||||
{/* End Decoration Circles */}
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-7 col-lg-8 text-center text-md-start mb-sm-20">
|
|
||||||
<h2 className="section-title-small mb-20">
|
|
||||||
Like our creative works?
|
|
||||||
</h2>
|
|
||||||
<p className="text-gray mb-0">
|
|
||||||
Quisque posuere mollis ullamcorper. Ut eget metus
|
|
||||||
lorem ipsum posuere eget at ex. Aenean consequat
|
|
||||||
vitae lorem in vehicula.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="col-md-5 col-lg-4 text-center text-md-end pt-2">
|
|
||||||
<Link
|
|
||||||
href={`/slick-portfolio${dark ? "-dark" : ""}`}
|
|
||||||
className="btn btn-mod btn-color btn-large btn-circle btn-hover-anim"
|
|
||||||
>
|
|
||||||
<span>View all works</span>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
<footer className="page-section footer position-relative overflow-hidden pb-30">
|
|
||||||
<div className="bg-shape-4">
|
|
||||||
<Image
|
|
||||||
src="/assets/images/demo-slick/bg-shape-4.svg"
|
|
||||||
width={1600}
|
|
||||||
height={268}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<Footer />
|
</div>
|
||||||
</footer>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user