first commit
This commit is contained in:
CHIEFSOFT\ameye
@@ -0,0 +1,51 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
const FeaturesContent = [
|
||||
{
|
||||
img: "55",
|
||||
title: "Personal",
|
||||
desc: ` With deski docs, you can write, edit, and collaborate wherever you
|
||||
are. For Free.`,
|
||||
routePath: "/",
|
||||
dataDelay: "100",
|
||||
},
|
||||
{
|
||||
img: "57",
|
||||
title: "Business",
|
||||
desc: `The deski Docs you love with added security and control for teams.`,
|
||||
routePath: "/",
|
||||
dataDelay: "200",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureEight = () => {
|
||||
return (
|
||||
<div className="row">
|
||||
{FeaturesContent.map((val, i) => (
|
||||
<div
|
||||
className="col-md-6"
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dataDelay}
|
||||
>
|
||||
<div className="block-style-ten">
|
||||
<div className="icon">
|
||||
<Image width={81} height={80} style={{objectFit:'contain'}} src={`/images/icon/${val.img}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h6 className="title">{val.title}</h6>
|
||||
<p>{val.desc}</p>
|
||||
<Link href="about-pm">
|
||||
{" "}
|
||||
<Image width="49" height="18" src="/images/icon/56.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
{/* /.block-style-ten */}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureEight;
|
||||
@@ -0,0 +1,117 @@
|
||||
'use client'
|
||||
|
||||
|
||||
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
|
||||
const FancyFeatureEleven = () => {
|
||||
return (
|
||||
<>
|
||||
<div className="block-style-sixteen" style={{ background: "#EBF3F1" }}>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div
|
||||
className="col-xl-5 col-lg-6"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#DEEAE7" }}
|
||||
>
|
||||
<Image width="26" height="26" src="/images/icon/73.svg" alt="icon" />
|
||||
</div>
|
||||
<h3 className="title">Mobile Application Design.</h3>
|
||||
<p>
|
||||
Commonly used in the graphic, print & publishing industris for
|
||||
previewing visual layout and mockups.
|
||||
</p>
|
||||
<Link href="/solution-management">
|
||||
<Image width="53" height="19" src="/images/icon/72.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Image width={765} height={745}
|
||||
style={{height:'fit-content'}}
|
||||
src="/images/assets/screen_02.png"
|
||||
alt="image"
|
||||
className="shapes screen-one"
|
||||
/>
|
||||
</div>
|
||||
{/* /.block-style-sixteen */}
|
||||
|
||||
<div className="block-style-sixteen" style={{ background: "#EDF3F9" }}>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div
|
||||
className="col-xl-5 col-lg-6 ms-auto"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#E1E7ED" }}
|
||||
>
|
||||
<Image width="24" height="24" src="/images/icon/74.svg" alt="icon" />
|
||||
</div>
|
||||
<h3 className="title">Branding & Design system.</h3>
|
||||
<p>
|
||||
Commonly used in the graphic, print & publishing industris for
|
||||
previewing visual layout and mockups.
|
||||
</p>
|
||||
<Link href="/solution-management">
|
||||
<Image width="53" height="19" src="/images/icon/72.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Image width={784} height={655}
|
||||
style={{height:'fit-content'}}
|
||||
src="/images/assets/screen_03.png"
|
||||
alt="screen"
|
||||
className="shapes screen-two"
|
||||
/>
|
||||
</div>
|
||||
{/* /.block-style-sixteen */}
|
||||
|
||||
<div className="block-style-sixteen" style={{ background: "#F9F1EF" }}>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div
|
||||
className="col-xl-5 col-lg-6"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#EDE5E3" }}
|
||||
>
|
||||
<Image width="25" height="24" src="/images/icon/75.svg" alt="icon" />
|
||||
</div>
|
||||
<h3 className="title">Custome & Plugin Development.</h3>
|
||||
<p>
|
||||
Commonly used in the graphic, print & publishing industris for
|
||||
previewing visual layout and mockups.
|
||||
</p>
|
||||
<Link href="/solution-management">
|
||||
<Image width="53" height="19" src="/images/icon/72.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Image width={768} height={607}
|
||||
style={{height:'fit-content'}}
|
||||
src="/images/assets/screen_04.png"
|
||||
alt="screen"
|
||||
className="shapes screen-three"
|
||||
/>
|
||||
</div>
|
||||
{/* /.block-style-sixteen */}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureEleven;
|
||||
@@ -0,0 +1,87 @@
|
||||
|
||||
'use client'
|
||||
|
||||
import Image from "next/image";
|
||||
import React from "react";
|
||||
|
||||
const featureContent = [
|
||||
{
|
||||
delayAnimation: "0",
|
||||
colorOfBorder: "#FFCE22",
|
||||
icon: "112",
|
||||
title: "Green Screen",
|
||||
description: `Change your background and create special effects using the Green Screen tool.`,
|
||||
},
|
||||
{
|
||||
delayAnimation: "150",
|
||||
colorOfBorder: "#8F6BF6",
|
||||
icon: "113",
|
||||
title: "Audio Mixer",
|
||||
description: `Adjust the audio of each individual track on your timeline lorem elit extract.`,
|
||||
},
|
||||
{
|
||||
delayAnimation: "0",
|
||||
colorOfBorder: "#FF5C5C",
|
||||
icon: "114",
|
||||
title: "Pan & Zoom",
|
||||
description: `Add panning and zooming movements to still footage.`,
|
||||
},
|
||||
{
|
||||
delayAnimation: "150",
|
||||
colorOfBorder: "#63EAA9",
|
||||
icon: "115",
|
||||
title: "Advanced Text Editing",
|
||||
description: `Edit the color, size, font, and even animation of your text and titles.`,
|
||||
},
|
||||
{
|
||||
delayAnimation: "",
|
||||
colorOfBorder: "#5BE2FF",
|
||||
icon: "116",
|
||||
title: "Color Tuning",
|
||||
description: `Adjust the white balance and dynamic range of your clips & long videos.`,
|
||||
},
|
||||
{
|
||||
delayAnimation: "150",
|
||||
colorOfBorder: "#FF56EE",
|
||||
icon: "117",
|
||||
title: "3D Lut",
|
||||
description: `Choose from a selection of color grading presets inspired by popular movies.`,
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureNinteen = () => {
|
||||
return (
|
||||
<div className="row">
|
||||
{featureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={val.delayAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div
|
||||
className="block-style-nineteen"
|
||||
style={{ borderLeftColor: val.colorOfBorder }}
|
||||
>
|
||||
<div className="d-flex align-items-start">
|
||||
<Image width={57} height={57} style={{objectFit:'contain'}}
|
||||
src={`/images/icon/${val.icon}.svg`}
|
||||
alt="icon"
|
||||
className="icon"
|
||||
/>
|
||||
<div className="text">
|
||||
<h4>{val.title}</h4>
|
||||
<p>{val.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* /.block-style-nineteen */}
|
||||
</div>
|
||||
))}
|
||||
|
||||
{/* End .col */}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureNinteen;
|
||||
@@ -0,0 +1,50 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "35",
|
||||
meta: "Customer Value",
|
||||
subTitle: ` A place to think and track ideas for you and your team`,
|
||||
dataDelay: "0",
|
||||
},
|
||||
{
|
||||
icon: "36",
|
||||
meta: "Trusted & Reliable",
|
||||
subTitle: ` A home for your team, best practices and thoughts.`,
|
||||
dataDelay: "100",
|
||||
},
|
||||
{
|
||||
icon: "37",
|
||||
meta: "Fast Response",
|
||||
subTitle: `Beautiful docs for your APIs, Products, FAQs, & User Guides,`,
|
||||
dataDelay: "300",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureSeven = () => {
|
||||
return (
|
||||
<>
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dataDelay}
|
||||
>
|
||||
<div className="block-style-seven">
|
||||
<div className="icon">
|
||||
<Image width={77} height={82} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<div className="feature-info">
|
||||
<span>{val.meta}</span>
|
||||
</div>
|
||||
<p className="font-rubik">{val.subTitle}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureSeven;
|
||||
@@ -0,0 +1,65 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const FeaturesContent = [
|
||||
{
|
||||
img: "94",
|
||||
title: "Web Clipper",
|
||||
desc: ` Deski Web offers a complete lineup of features from any
|
||||
major browser.`,
|
||||
},
|
||||
{
|
||||
img: "95",
|
||||
title: "All Platform",
|
||||
desc: ` Lorem ipsum began as scrambl nonsensical Latin derived from
|
||||
Cicero's quis`,
|
||||
},
|
||||
{
|
||||
img: "96",
|
||||
title: "Character Finding",
|
||||
desc: ` Creation timelines for the standard lorem ipsum passage
|
||||
vary, with qius some citing.`,
|
||||
},
|
||||
{
|
||||
img: "97",
|
||||
title: "App Integrations",
|
||||
desc: ` Lorem ipsum began as scrambl nonsensical Latin derived from
|
||||
Cicero's quis`,
|
||||
},
|
||||
{
|
||||
img: "98",
|
||||
title: "Web Application",
|
||||
desc: ` Lorem ipsum was purposefully designed to have no meaning,
|
||||
but appear like text`,
|
||||
},
|
||||
{
|
||||
img: "99",
|
||||
title: "Notes & Docs",
|
||||
desc: ` Letraset's dry-transfer sheets later entered the digital
|
||||
world via Aldus PageMaker.`,
|
||||
},
|
||||
];
|
||||
const FancyFeatureSeventeen = () => {
|
||||
return (
|
||||
<>
|
||||
{FeaturesContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-sm-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
key={i}
|
||||
>
|
||||
<div className="block-meta">
|
||||
<div className="icon d-flex align-items-end">
|
||||
<Image width={28} height={28} src={`/images/icon/${val.img}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4>{val.title}</h4>
|
||||
<p>{val.desc}</p>
|
||||
</div>
|
||||
</div>
|
||||
// .block-meta
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureSeventeen;
|
||||
@@ -0,0 +1,63 @@
|
||||
'use client'
|
||||
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
|
||||
const FeaturesContent = [
|
||||
{
|
||||
bgColor: "#FFEBDB",
|
||||
icon: "68",
|
||||
title: "Secure & Trusted",
|
||||
desc: `Elit esse cillum dolore eu fugiat nulla pariatur`,
|
||||
dataDealy: "0",
|
||||
},
|
||||
{
|
||||
bgColor: "#E0F8F8",
|
||||
icon: "67",
|
||||
title: "Easy Customizable",
|
||||
desc: `quis nostrud exerct ullamo ea nisi ut aliqui com dolor`,
|
||||
dataDealy: "100",
|
||||
},
|
||||
{
|
||||
bgColor: "#F7EDFF",
|
||||
icon: "70",
|
||||
title: "Fast Support",
|
||||
desc: `Duis aute irure dolor reprehen derit in volu velit.`,
|
||||
dataDealy: "200",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureTen = () => {
|
||||
return (
|
||||
<div className="row justify-content-center mt-35 md-mt-20">
|
||||
{FeaturesContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dataDealy}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-fifteen mt-40">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: val.bgColor }}
|
||||
>
|
||||
<Image width={40} height={35} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h3>{val.title}</h3>
|
||||
<p>{val.desc}</p>
|
||||
<Link href="/solution-management" className="mt-30">
|
||||
{" "}
|
||||
<Image width="35" height="15" src="/images/icon/69.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
{/* /.block-style-ten */}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTen;
|
||||
@@ -0,0 +1,51 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const featuresContent = [
|
||||
{
|
||||
icon: "149",
|
||||
title: "Sign Doc Anywhere",
|
||||
desc: `Deski Web offers a complete lineup of features from any major
|
||||
browser.`,
|
||||
delayAnimation: "",
|
||||
},
|
||||
{
|
||||
icon: "150",
|
||||
title: "Simple to use",
|
||||
desc: `Lorem ipsum began as scrambl nonsensical Latin derived from Cicero's
|
||||
quis`,
|
||||
delayAnimation: "100",
|
||||
},
|
||||
{
|
||||
icon: "151",
|
||||
title: "Save time & Effort",
|
||||
desc: `Creation timelines for the standard lorem ipsum passage vary, with
|
||||
qius some citing.`,
|
||||
delayAnimation: "200",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureTewentyEight = () => {
|
||||
return (
|
||||
<div className="row justify-content-between">
|
||||
{featuresContent.map((val, i) => (
|
||||
<div
|
||||
className="col-xl-3 col-md-4"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={val.delayAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-twentyEight text-center mt-40">
|
||||
<div className="icon d-flex justify-content-center align-items-end">
|
||||
<Image width={36} height={36} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4>{val.title}</h4>
|
||||
<p>{val.desc}</p>
|
||||
</div>
|
||||
{/* /.block-style-twentyEight */}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTewentyEight;
|
||||
@@ -0,0 +1,219 @@
|
||||
import Image from "next/image";
|
||||
import React from "react";
|
||||
|
||||
const FancyFeatureTewentyFour = () => {
|
||||
return (
|
||||
<div className="row">
|
||||
<div
|
||||
className="col-lg-6 d-flex mb-35"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div className="block-style-twentyFour">
|
||||
<div className="d-flex align-items-start">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#3FE193" }}
|
||||
>
|
||||
<Image width="28" height="28" src="/images/icon/124.svg" alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Sports & Fitness</h4>
|
||||
<p>
|
||||
Personal trainers, Gyms Fitness classes, Yoga classes Golf
|
||||
classes, Sport items renting
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* /.block-style-twentyFour */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div
|
||||
className="col-lg-6 d-flex mb-35"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay="100"
|
||||
>
|
||||
<div className="block-style-twentyFour">
|
||||
<div className="d-flex align-items-start">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#FF4F86" }}
|
||||
>
|
||||
<Image width="32" height="32" src="/images/icon/125.svg" alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Beauty and Wellness</h4>
|
||||
<p>
|
||||
Eyelash extensions , Hair salons, Spa salons Beauty salons, Nail
|
||||
salons
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>{" "}
|
||||
{/* /.block-style-twentyFour */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div
|
||||
className="col-lg-6 d-flex mb-35"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div className="block-style-twentyFour">
|
||||
<div className="d-flex align-items-start">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#FFCF39" }}
|
||||
>
|
||||
<Image width="28" height="28" src="/images/icon/126.svg" alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Events & entertainment</h4>
|
||||
<p>
|
||||
Art classes, Escape rooms Photographers, Equipment Rental &
|
||||
more.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>{" "}
|
||||
{/* /.block-style-twentyFour */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div
|
||||
className="col-lg-6 d-flex mb-35"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay="100"
|
||||
>
|
||||
<div className="block-style-twentyFour">
|
||||
<div className="d-flex align-items-start">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#6D64FF" }}
|
||||
>
|
||||
<Image width="28" height="28" src="/images/icon/127.svg" alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Officials & Financial</h4>
|
||||
<p>
|
||||
Embassies and consulates, City councils, Call centers Financial
|
||||
services, Interview scheduling.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>{" "}
|
||||
{/* /.block-style-twentyFour */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div
|
||||
className="col-lg-6 d-flex mb-35"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div className="block-style-twentyFour">
|
||||
<div className="d-flex align-items-start">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#E752FF" }}
|
||||
>
|
||||
<Image width="24" height="24" src="/images/icon/128.svg" alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Personal meetings</h4>
|
||||
<p>
|
||||
Counselling ,Coaching, Business, Advisory, Spiritual services &
|
||||
more.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>{" "}
|
||||
{/* /.block-style-twentyFour */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div
|
||||
className="col-lg-6 d-flex mb-35"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay="100"
|
||||
>
|
||||
<div className="block-style-twentyFour">
|
||||
<div className="d-flex align-items-start">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#29EEFB" }}
|
||||
>
|
||||
<Image width="28" height="28" src="/images/icon/129.svg" alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Driving Lessons</h4>
|
||||
<p>Driving Schools, Driving Instructors.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>{" "}
|
||||
{/* /.block-style-twentyFour */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div
|
||||
className="col-lg-6 d-flex mb-35"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div className="block-style-twentyFour">
|
||||
<div className="d-flex align-items-start">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#32B5FF" }}
|
||||
>
|
||||
<Image width="28" height="28" src="/images/icon/130.svg" alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Education System</h4>
|
||||
<p>
|
||||
Universities, Colleges, Schools, Libraries, Parent meetings,
|
||||
Tutoring lessons.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>{" "}
|
||||
{/* /.block-style-twentyFour */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div
|
||||
className="col-lg-6 d-flex mb-35"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay="100"
|
||||
>
|
||||
<div className="block-style-twentyFour">
|
||||
<div className="d-flex align-items-start">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: "#FFA361" }}
|
||||
>
|
||||
<Image width="28" height="28" src="/images/icon/131.svg" alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Medical services</h4>
|
||||
<p>
|
||||
Massage & Body Treatments, Dental Clinics, Medical Clinics &
|
||||
more.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>{" "}
|
||||
{/* /.block-style-twentyFour */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTewentyFour;
|
||||
@@ -0,0 +1,153 @@
|
||||
'use client'
|
||||
|
||||
|
||||
import React, { useState } from "react";
|
||||
import Link from "next/link";
|
||||
import ModalVideo from "react-modal-video";
|
||||
import Image from "next/image";
|
||||
|
||||
const FancyFeatureTewentNine = () => {
|
||||
const [isOpen, setOpen] = useState(false);
|
||||
return (
|
||||
<>
|
||||
<ModalVideo
|
||||
channel="youtube"
|
||||
autoplay
|
||||
isOpen={isOpen}
|
||||
videoId="7e90gBu4pas"
|
||||
onClose={() => setOpen(false)}
|
||||
/>
|
||||
|
||||
<div className="row">
|
||||
<div className="col-lg-6 mt-40" data-aos="fade-up">
|
||||
<div
|
||||
className="block-style-twentyNine"
|
||||
style={{ background: "#623A75" }}
|
||||
>
|
||||
<div className="logo">
|
||||
<Image width={127} height={66} src="/images/logo/logo-53.png" alt="brand" />
|
||||
</div>
|
||||
<div
|
||||
className="fancybox video-icon tran3s"
|
||||
onClick={() => setOpen(true)}
|
||||
>
|
||||
<Image width="17" height="20" src="/images/icon/152.svg" alt="icon" />
|
||||
</div>
|
||||
<h3>
|
||||
<Link href={`/blogs/1`}>
|
||||
Seattle Opera Simplifies Performance Planning with deski
|
||||
eSignature.
|
||||
</Link>
|
||||
</h3>
|
||||
<Link
|
||||
className="read-more-btn d-flex justify-content-between align-items-center w-100"
|
||||
href={`/blogs/1`}
|
||||
>
|
||||
<span>Continue Reading</span>
|
||||
<Image width="34" height="15" src="/images/icon/153.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
{/* /.block-style-twentyNine */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div className="col-lg-6 mt-40" data-aos="fade-up" data-aos-delay="100">
|
||||
<div
|
||||
className="block-style-twentyNine"
|
||||
style={{ background: "#314B7D" }}
|
||||
>
|
||||
<div className="logo">
|
||||
<Image width={156} height={36} src="/images/logo/logo-54.png" alt="brand" />
|
||||
</div>
|
||||
<div
|
||||
className="fancybox video-icon tran3s"
|
||||
onClick={() => setOpen(true)}
|
||||
>
|
||||
<Image width="17" height="20" src="/images/icon/152.svg" alt="icon" />
|
||||
</div>
|
||||
<h3>
|
||||
<Link href={`/blogs/1`}>
|
||||
How DocuSign CLM Helps Celonis Scale Its Global Business
|
||||
</Link>
|
||||
</h3>
|
||||
<Link
|
||||
className="read-more-btn d-flex justify-content-between align-items-center w-100"
|
||||
href={`/blogs/1`}
|
||||
>
|
||||
<span>Continue Reading</span>
|
||||
<Image width="34" height="15" src="/images/icon/153.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
{/* /.block-style-twentyNine */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div className="col-lg-6 mt-40" data-aos="fade-up">
|
||||
<div
|
||||
className="block-style-twentyNine"
|
||||
style={{ background: "#2B4E56" }}
|
||||
>
|
||||
<div className="logo">
|
||||
<Image width={130} height={26} src="/images/logo/logo-55.png" alt="brand" />
|
||||
</div>
|
||||
<div
|
||||
className="fancybox video-icon tran3s"
|
||||
onClick={() => setOpen(true)}
|
||||
>
|
||||
<Image width="17" height="20" src="/images/icon/152.svg" alt="icon" />
|
||||
</div>
|
||||
<h3>
|
||||
<Link href={`/blogs/1`}>
|
||||
Sunrun makes solar contracts convenient with deski and
|
||||
Salesforce
|
||||
</Link>
|
||||
</h3>
|
||||
<Link
|
||||
className="read-more-btn d-flex justify-content-between align-items-center w-100"
|
||||
href={`/blogs/1`}
|
||||
>
|
||||
<span>Continue Reading</span>
|
||||
<Image width="34" height="15" src="/images/icon/153.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
{/* /.block-style-twentyNine */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
|
||||
<div className="col-lg-6 mt-40" data-aos="fade-up" data-aos-delay="100">
|
||||
<div
|
||||
className="block-style-twentyNine"
|
||||
style={{ background: "#7A4040" }}
|
||||
>
|
||||
<div className="logo">
|
||||
<Image width={134} height={33} src="/images/logo/logo-56.png" alt="brand" />
|
||||
</div>
|
||||
<div
|
||||
className="fancybox video-icon tran3s"
|
||||
onClick={() => setOpen(true)}
|
||||
>
|
||||
<Image width="17" height="20" src="/images/icon/152.svg" alt="icon" />
|
||||
</div>
|
||||
<h3>
|
||||
<Link href={`/blogs/1`}>
|
||||
McCloskey Motors builds a touchless car sale process with
|
||||
Design.
|
||||
</Link>
|
||||
</h3>
|
||||
<Link
|
||||
className="read-more-btn d-flex justify-content-between align-items-center w-100"
|
||||
href={`/blogs/1`}
|
||||
>
|
||||
<span>Continue Reading</span>
|
||||
<Image width="34" height="15" src="/images/icon/153.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
{/* /.block-style-twentyNine */}
|
||||
</div>
|
||||
{/* End .col */}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTewentNine;
|
||||
@@ -0,0 +1,54 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const featuresContent = [
|
||||
{
|
||||
icon: "144",
|
||||
title: "Contracts",
|
||||
desc: "Simplify the process to create proposals.",
|
||||
delayAnimation: "",
|
||||
},
|
||||
{
|
||||
icon: "145",
|
||||
title: "Proposal",
|
||||
desc: "Create interactive, error-free quotes.",
|
||||
delayAnimation: "100",
|
||||
},
|
||||
{
|
||||
icon: "146",
|
||||
title: "eSignature",
|
||||
desc: "Create interactive, error-free quotes.",
|
||||
delayAnimation: "200",
|
||||
},
|
||||
{
|
||||
icon: "147",
|
||||
title: "Collect Doc",
|
||||
desc: "Create interactive, error-free quotes.",
|
||||
delayAnimation: "300",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureTewentySeven = () => {
|
||||
return (
|
||||
<div className="row">
|
||||
{featuresContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-3 col-sm-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={val.delayAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-twentySeven">
|
||||
<div className="icon d-flex align-items-end justify-content-center">
|
||||
<Image width={48} height={53} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4 className="font-gordita">{val.title}</h4>
|
||||
<p>{val.desc}</p>
|
||||
</div>
|
||||
{/* /.block-style-twentySeven */}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTewentySeven;
|
||||
@@ -0,0 +1,54 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const featuresContent = [
|
||||
{
|
||||
colorBasedClass: "color-variatin-one",
|
||||
title: "Deski eSignature",
|
||||
subTitle: `Join 1,000,000 customers & hundreds of millions of signers`,
|
||||
routerPath: "#",
|
||||
shapeOne: "222",
|
||||
shapeTwo: "223",
|
||||
},
|
||||
{
|
||||
colorBasedClass: "color-variatin-two",
|
||||
title: "Agreement Cloud",
|
||||
subTitle: `Connect and automate your entire agreement process.`,
|
||||
routerPath: "#",
|
||||
shapeOne: "224",
|
||||
shapeTwo: "225",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureTewentySix = () => {
|
||||
return (
|
||||
<div className="row">
|
||||
{featuresContent.map((val, i) => (
|
||||
<div className="col-md-6" data-aos="fade-right" key={i}>
|
||||
<div
|
||||
className={`block-style-twentySix text-center mb-40 ${val.colorBasedClass}`}
|
||||
>
|
||||
<h6>{val.title}</h6>
|
||||
<h4>{val.subTitle}</h4>
|
||||
<a href={val.routerPath} className="try-btn">
|
||||
Try it Free
|
||||
</a>
|
||||
<Image width={40} height={331}
|
||||
src={`/images/shape/${val.shapeOne}.jpg`}
|
||||
alt="shape"
|
||||
className="shapes shape-one"
|
||||
/>
|
||||
<Image width={26} height={330}
|
||||
src={`/images/shape/${val.shapeTwo}.jpg`}
|
||||
alt="shape"
|
||||
className="shapes shape-two"
|
||||
/>
|
||||
</div>
|
||||
{/* .block-style-twentySix */}
|
||||
</div>
|
||||
// End .col
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTewentySix;
|
||||
@@ -0,0 +1,63 @@
|
||||
import Image from "next/image";
|
||||
import React from "react";
|
||||
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "132",
|
||||
title: "Core PHP",
|
||||
subTitle: `Elit esse cillum dolore eu fugiat nulla pariatur`,
|
||||
bgColor: "#FFEBDB",
|
||||
delayAnimation: "",
|
||||
},
|
||||
{
|
||||
icon: "133",
|
||||
title: "Easy Customizable",
|
||||
subTitle: `quis nostrud exerct ullamo ea nisi ut aliqu dolor`,
|
||||
bgColor: "#E0F8F8",
|
||||
delayAnimation: "200",
|
||||
},
|
||||
{
|
||||
icon: "134",
|
||||
title: "Fast Support",
|
||||
subTitle: `Duis aute irure dolor reprehen derit in voluptat velit.`,
|
||||
bgColor: "#F7EDFF",
|
||||
delayAnimation: "400",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureTewentyThree = () => {
|
||||
return (
|
||||
<>
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.delayAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-twentyTwo">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: val.bgColor }}
|
||||
>
|
||||
<Image width={24} height={24} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4>{val.title}</h4>
|
||||
<p>{val.subTitle}</p>
|
||||
<a className="arrow-icon" href="#">
|
||||
<Image width="35" height="15"
|
||||
className="arrow-icon"
|
||||
src="/images/icon/135.svg"
|
||||
alt="icon"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
{/* /.block-style-twentyTwo */}
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTewentyThree;
|
||||
@@ -0,0 +1,51 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "121",
|
||||
title: "Appoinments",
|
||||
subTitle: `Online video meetings image Online Video Meetings SimplyBook`,
|
||||
bgColor: "#FF4A8B",
|
||||
},
|
||||
{
|
||||
icon: "122",
|
||||
title: "Class Booking",
|
||||
subTitle: `Add video meeting links to your appointments with the Zoom Ror Teleport integrations.`,
|
||||
bgColor: "#6D49FF",
|
||||
},
|
||||
{
|
||||
icon: "123",
|
||||
title: "Fast Support",
|
||||
subTitle: `Customize your virtual office with personalized page URLs, logos, colors and more.`,
|
||||
bgColor: "#FFB951",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureTewentyTwo = () => {
|
||||
return (
|
||||
<>
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-twentyTwo">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: val.bgColor }}
|
||||
>
|
||||
<Image width={27} height={27} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4>{val.title}</h4>
|
||||
<p>{val.subTitle}</p>
|
||||
</div>
|
||||
{/* /.block-style-twentyTwo */}
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTewentyTwo;
|
||||
@@ -0,0 +1,34 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import { featuresContent } from "@/data/service";
|
||||
import Image from "next/image";
|
||||
|
||||
const FancyFeatureThirtyFive = () => {
|
||||
return (
|
||||
<>
|
||||
{featuresContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dealyAnimation}
|
||||
key={i}
|
||||
>
|
||||
<Link href={`/services/${val.id}`} className="block-style-twentyTwo">
|
||||
<div
|
||||
style={{ background: val.bgColor }}
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
>
|
||||
<Image width={24} height={24} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4>{val.title}</h4>
|
||||
<p>{val.subTitle}</p>
|
||||
</Link>
|
||||
{/* <!-- /.block-style-twentyTwo --> */}
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureThirtyFive;
|
||||
@@ -0,0 +1,38 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import { featuresContentTwo } from "@/data/service";
|
||||
import Image from "next/image";
|
||||
|
||||
|
||||
const FancyFeatureThirtyFour = () => {
|
||||
return (
|
||||
<div className="row">
|
||||
{featuresContentTwo.map((item, i) => (
|
||||
<div
|
||||
className="col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={item.dealyAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-thirtyTwo d-flex">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: item.bgColor }}
|
||||
>
|
||||
<Image width={24} height={24} style={{objectFit:'contain'}} src={`/images/icon/${item.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>{item.title}</h4>
|
||||
<p>{item.descriptions}</p>
|
||||
<Link href={`/services/${item.id}`} className="tran3s">
|
||||
<Image width="35" height="15" src="/images/icon/182.svg" alt="icon" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureThirtyFour;
|
||||
@@ -0,0 +1,48 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const featuresContent = [
|
||||
{
|
||||
icon: "163",
|
||||
title: "Easy Customize",
|
||||
desc: `Keep a track on real-time performance while analyzing the success of your mail campaigns.`,
|
||||
delayAnimation: "",
|
||||
},
|
||||
{
|
||||
icon: "164",
|
||||
title: "100+ Template",
|
||||
desc: `Keep a track on real-time performance while analyzing the success of your mail campaigns.`,
|
||||
delayAnimation: "100",
|
||||
},
|
||||
{
|
||||
icon: "165",
|
||||
title: "Clean & Unique",
|
||||
desc: `Keep a track on real-time performance while analyzing the success of your mail campaigns.`,
|
||||
delayAnimation: "200",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureThirtyOne = () => {
|
||||
return (
|
||||
<div className="row justify-content-between">
|
||||
{featuresContent.map((item, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={item.delayAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-thirtyOne mt-40">
|
||||
<div className="icon d-flex align-items-end">
|
||||
<Image width={32} height={32} style={{objectFit:'contain'}} src={`/images/icon/${item.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4>{item.title}</h4>
|
||||
<p>{item.desc}</p>
|
||||
</div>
|
||||
{/* <!-- /.block-style-thirtyOne --> */}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureThirtyOne;
|
||||
@@ -0,0 +1,50 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const featuresContent = [
|
||||
{
|
||||
icon: "171",
|
||||
title: "Daily Updates",
|
||||
desc: `Elit esse cillum dolore eu fugiat nulla pariatur lorem elit`,
|
||||
delayAnimation: "",
|
||||
},
|
||||
{
|
||||
icon: "172",
|
||||
title: "Easu Cutomization",
|
||||
desc: ` Nulla vitae elit libero, a pharetra augue. Donec id elit non mi
|
||||
porta.`,
|
||||
delayAnimation: "100",
|
||||
},
|
||||
{
|
||||
icon: "173",
|
||||
title: "Fast Support",
|
||||
desc: `Elit esse cillum dolore eu fugiat nulla pariatur lorem elit`,
|
||||
delayAnimation: "200",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureThirtyThree = () => {
|
||||
return (
|
||||
<div className="row">
|
||||
{featuresContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={val.delayAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-thirtyThree pe-lg-5 mt-40">
|
||||
<div className="icon">
|
||||
<Image width={40} height={40} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h3 className="title">
|
||||
<span>{val.title}</span>
|
||||
</h3>
|
||||
<p>{val.desc}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureThirtyThree;
|
||||
@@ -0,0 +1,74 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const featuresContent = [
|
||||
{
|
||||
bgColor: "#F7EDFF",
|
||||
icon: "166",
|
||||
title: "Chat & Messaging",
|
||||
descriptions:
|
||||
"Chat section is as significant as other sections on your website and it works best for your customers.",
|
||||
link: "#",
|
||||
dealyAnimation: "",
|
||||
},
|
||||
{
|
||||
bgColor: "#D8FFF1",
|
||||
icon: "167",
|
||||
title: "eCommerce",
|
||||
descriptions:
|
||||
"Build an online store that rank higher & sell more and integrates easily ooCommerce, to enhance the quality",
|
||||
link: "#",
|
||||
dealyAnimation: "100",
|
||||
},
|
||||
{
|
||||
bgColor: "#E6FBFF",
|
||||
icon: "168",
|
||||
title: "Payment Gatway",
|
||||
descriptions:
|
||||
"It saves the client cards on file securely for an effortless checkout experience using our advanced, secure payments system.",
|
||||
link: "#",
|
||||
dealyAnimation: "",
|
||||
},
|
||||
{
|
||||
bgColor: "#FFEBDB",
|
||||
icon: "169",
|
||||
title: "Appointments",
|
||||
descriptions:
|
||||
"Our Scheduling Platform is Simple yet Powerful that you need to grow and manage your business in single user interface.",
|
||||
link: "#",
|
||||
dealyAnimation: "100",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureThirtyTwo = () => {
|
||||
return (
|
||||
<div className="row">
|
||||
{featuresContent.map((item, i) => (
|
||||
<div
|
||||
className="col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={item.dealyAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-thirtyTwo d-flex">
|
||||
<div
|
||||
className="icon d-flex align-items-center justify-content-center"
|
||||
style={{ background: item.bgColor }}
|
||||
>
|
||||
<Image width={24} height={24} style={{objectFit:'contain'}} src={`/images/icon/${item.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>{item.title}</h4>
|
||||
<p>{item.descriptions}</p>
|
||||
<a href={item.link} className="theme-btn-ten">
|
||||
Learn more
|
||||
<i className="fa fa-chevron-right" aria-hidden="true"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureThirtyTwo;
|
||||
@@ -0,0 +1,47 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "78",
|
||||
title: "Easy Customizable",
|
||||
subTitle: `Duis aute irure dolor reprehen derit in voluptat velit.`,
|
||||
hoverText: `Bring all team slit managment task quis togather.`,
|
||||
},
|
||||
{
|
||||
icon: "79",
|
||||
title: "Modern & Slick",
|
||||
subTitle: `Duis aute irure dolor reprehen derit in voluptat velit.`,
|
||||
hoverText: ` Bring all team slit managment task quis togather.`,
|
||||
},
|
||||
{
|
||||
icon: "80",
|
||||
title: "Trusted & Secure",
|
||||
subTitle: `Duis aute irure dolor reprehen derit in voluptat velit.`,
|
||||
hoverText: ` Bring all team slit managment task quis togather.`,
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureTwelve = () => {
|
||||
return (
|
||||
<div className="row justify-content-center pt-50 md-pt-20">
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div className="col-lg-4 col-md-6" key={i}>
|
||||
<div className="block-style-seventeen mt-40">
|
||||
<div className="icon d-flex align-items-center justify-content-center">
|
||||
<Image width={30} height={30} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<div className="static-text">
|
||||
<h3>{val.title}</h3>
|
||||
<p>{val.subTitle}</p>
|
||||
</div>
|
||||
<div className="hover-text">{val.hoverText}</div>
|
||||
</div>
|
||||
{/* /.block-style-seventeen */}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
// End .row
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTwelve;
|
||||
@@ -0,0 +1,49 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const featureContent = [
|
||||
{
|
||||
icon: "186",
|
||||
title: "Daily Updates",
|
||||
subTitle: "Elit esse cillum dolore eu fugiat nulla pariatur lom elit",
|
||||
dealyAnimation: "0",
|
||||
},
|
||||
{
|
||||
icon: "187",
|
||||
title: "Easy Cutomization",
|
||||
subTitle: "Nulla vitae elit libero, haretra augue. Donec id elit non m.",
|
||||
dealyAnimation: "100",
|
||||
},
|
||||
{
|
||||
icon: "188",
|
||||
title: "Fast Support",
|
||||
subTitle:
|
||||
" Nulla vitae elit libero, a phare augue. Donec id elit non mi porta.",
|
||||
dealyAnimation: "200",
|
||||
},
|
||||
];
|
||||
|
||||
const FancyFeatureTwentyEightV2 = () => {
|
||||
return (
|
||||
<div className="row justify-content-between">
|
||||
{featureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-md-4 aos-init aos-animate"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={val.dealyAnimation}
|
||||
key={i}
|
||||
>
|
||||
<div className="block-style-twentyEight text-center mt-40">
|
||||
<div className="icon d-flex justify-content-center align-items-end">
|
||||
<Image width={25} height={25} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4 className="font-gordita">{val.title}</h4>
|
||||
<p>{val.subTitle}</p>
|
||||
</div>{" "}
|
||||
{/* <!-- /.block-style-twentyEight --> */}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FancyFeatureTwentyEightV2;
|
||||
@@ -0,0 +1,56 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "12",
|
||||
title: "Media & Hospital",
|
||||
subTitle: `Lorem ipsum dolor amet, consetre adipiscing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dole magna aliqua. Ut enim`,
|
||||
dataDelay: "0",
|
||||
},
|
||||
{
|
||||
icon: "13",
|
||||
title: "Educational",
|
||||
subTitle: `Lorem ipsum dolor amet, consetre adipiscing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dole magna aliqua. Ut enim`,
|
||||
dataDelay: "100",
|
||||
},
|
||||
{
|
||||
icon: "14",
|
||||
title: "Financial Service",
|
||||
subTitle: `Lorem ipsum dolor amet, consetre adipiscing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dole magna aliqua. Ut enim`,
|
||||
dataDelay: "300",
|
||||
},
|
||||
];
|
||||
|
||||
const FeatureFive = () => {
|
||||
return (
|
||||
<div className="row justify-content-center">
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dataDelay}
|
||||
>
|
||||
<div className="block-style-four">
|
||||
<div className="icon">
|
||||
<Image width={75} height={75} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4>{val.title}</h4>
|
||||
<p>{val.subTitle}</p>
|
||||
<Link href="/about-pm">
|
||||
{" "}
|
||||
<i className="flaticon-right-arrow"></i>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FeatureFive;
|
||||
@@ -0,0 +1,52 @@
|
||||
'use client'
|
||||
import Image from "next/image";
|
||||
import React from "react";
|
||||
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "20",
|
||||
meta: "Smart popups",
|
||||
subTitle: `Create customized popups and show the message at the lorem`,
|
||||
dataDelay: "0",
|
||||
},
|
||||
{
|
||||
icon: "21",
|
||||
meta: "Embeded Forms",
|
||||
subTitle: `Collect website leads with embedded forms and integrate easily.`,
|
||||
dataDelay: "100",
|
||||
},
|
||||
{
|
||||
icon: "22",
|
||||
meta: "Autoresponder",
|
||||
subTitle: `Send welcome email to your new subscribers with a code.`,
|
||||
dataDelay: "300",
|
||||
},
|
||||
];
|
||||
|
||||
const FeatureFour = () => {
|
||||
return (
|
||||
<div className="row justify-content-center">
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dataDelay}
|
||||
>
|
||||
<div className="block-style-five">
|
||||
<div className="icon">
|
||||
<Image width={72} height={72} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h6 className="title">
|
||||
<span>{val.meta}</span>
|
||||
</h6>
|
||||
<p>{val.subTitle}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FeatureFour;
|
||||
@@ -0,0 +1,48 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "ils_15",
|
||||
meta: "Join Our Platform",
|
||||
subTitle: ` It only takes 5 minutes. Set up is smooth and simple fully lorem
|
||||
qui.`,
|
||||
},
|
||||
{
|
||||
icon: "ils_16",
|
||||
meta: "Manage you event",
|
||||
subTitle: `Choose a price package to suit you or pay per ticket. Sell on your
|
||||
website,`,
|
||||
},
|
||||
{
|
||||
icon: "ils_17",
|
||||
meta: "Start selling ticket",
|
||||
subTitle: `Get payments, detailed data on tickets sales & message guests lorem`,
|
||||
},
|
||||
];
|
||||
|
||||
const FeatureNine = () => {
|
||||
return (
|
||||
<div className="row justify-content-center">
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div className="block-style-fourteen">
|
||||
<div className="illustration">
|
||||
<Image width={240} height={230} style={{objectFit:'contain'}} src={`/images/assets/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<div className="title">{val.meta}</div>
|
||||
<p className="font-rubik">{val.subTitle}</p>
|
||||
</div>
|
||||
{/* /.block-style-fourteen */}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
// /.row
|
||||
);
|
||||
};
|
||||
|
||||
export default FeatureNine;
|
||||
@@ -0,0 +1,68 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "20",
|
||||
meta: "Smart popups",
|
||||
subTitle: `Create customized popups and show the message at the lorem`,
|
||||
dataDelay: "0",
|
||||
},
|
||||
{
|
||||
icon: "21",
|
||||
meta: "Embeded Forms",
|
||||
subTitle: `Collect website leads with embedded forms and integrate easily.`,
|
||||
dataDelay: "100",
|
||||
},
|
||||
{
|
||||
icon: "22",
|
||||
meta: "Autoresponder",
|
||||
subTitle: `Send welcome email to your new subscribers with a code.`,
|
||||
dataDelay: "0",
|
||||
},
|
||||
{
|
||||
icon: "21",
|
||||
meta: "Embeded Forms",
|
||||
subTitle: `Collect website leads with embedded forms and integrate easily.`,
|
||||
dataDelay: "100",
|
||||
},
|
||||
{
|
||||
icon: "22",
|
||||
meta: "Autoresponder",
|
||||
subTitle: `Send welcome email to your new subscribers with a code.`,
|
||||
dataDelay: "0",
|
||||
},
|
||||
{
|
||||
icon: "20",
|
||||
meta: "Smart popups",
|
||||
subTitle: `Create customized popups and show the message at the lorem`,
|
||||
dataDelay: "100",
|
||||
},
|
||||
];
|
||||
|
||||
const FeatureSix = () => {
|
||||
return (
|
||||
<div className="row justify-content-center">
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-md-6 "
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dataDelay}
|
||||
>
|
||||
<div className="block-style-five">
|
||||
<div className="icon">
|
||||
<Image width={75} height={75} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h6 className="title">
|
||||
<span>{val.meta}</span>
|
||||
</h6>
|
||||
<p>{val.subTitle}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FeatureSix;
|
||||
@@ -0,0 +1,33 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import { FeatureContentThree } from "@/data/service";
|
||||
import Image from "next/image";
|
||||
|
||||
|
||||
const FeatureSixV2 = () => {
|
||||
return (
|
||||
<div className="row justify-content-center">
|
||||
{FeatureContentThree.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dataDelay}
|
||||
>
|
||||
<Link href={`/services/${val.id}`} className="block-style-five">
|
||||
<div className="icon">
|
||||
<Image width={75} height={75} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h6 className="title">
|
||||
<span>{val.meta}</span>
|
||||
</h6>
|
||||
<p>{val.subTitle}</p>
|
||||
</Link>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FeatureSixV2;
|
||||
@@ -0,0 +1,48 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "09",
|
||||
meta: "Project management",
|
||||
subTitle: `tempor incididunt ut labor culpa dolore magna aliqua. Ut enim qui minim veniam,`,
|
||||
dataDelay: "0",
|
||||
},
|
||||
{
|
||||
icon: "10",
|
||||
meta: "Customer Support",
|
||||
subTitle: `Excepteur sint occaecat cupidatat non proident, sunt in culpa non officia.`,
|
||||
dataDelay: "100",
|
||||
},
|
||||
{
|
||||
icon: "11",
|
||||
meta: "Marketing",
|
||||
subTitle: `consectetur adipiscing elit, sed dou eiusmod tempor incididu ut lab et dolore.`,
|
||||
dataDelay: "300",
|
||||
},
|
||||
];
|
||||
|
||||
const FeatureThree = () => {
|
||||
return (
|
||||
<div className="row justify-content-center">
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
data-aos-delay={val.dataDelay}
|
||||
>
|
||||
<div className="block-style-three">
|
||||
<div className="icon">
|
||||
<Image width={78} height={78} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<h4>{val.meta}</h4>
|
||||
<p className="font-rubik">{val.subTitle}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FeatureThree;
|
||||
@@ -0,0 +1,44 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
const FeatureContent = [
|
||||
{
|
||||
icon: "60",
|
||||
meta: "Smart popups",
|
||||
subTitle: `Create customized popups and show the message at the lorem`,
|
||||
},
|
||||
{
|
||||
icon: "61",
|
||||
meta: "Embeded Forms",
|
||||
subTitle: `Collect website leads with embedded forms and integrate easily.`,
|
||||
},
|
||||
{
|
||||
icon: "62",
|
||||
meta: "Autoresponder",
|
||||
subTitle: `Send welcome email to your new subscribers with a code.`,
|
||||
},
|
||||
];
|
||||
|
||||
const FeaturesEight = () => {
|
||||
return (
|
||||
<div className="row justify-content-center">
|
||||
{FeatureContent.map((val, i) => (
|
||||
<div
|
||||
className="col-lg-4 col-md-6"
|
||||
key={i}
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1200"
|
||||
>
|
||||
<div className="block-style-thirteen">
|
||||
<div className="icon">
|
||||
<Image width={78} height={78} style={{objectFit:'contain'}} src={`/images/icon/${val.icon}.svg`} alt="icon" />
|
||||
</div>
|
||||
<div className="title font-rubik">{val.meta}</div>
|
||||
<p>{val.subTitle}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FeaturesEight;
|
||||
Reference in New Issue
Block a user