CHIEFSOFT\ameye
527 lines
19 KiB
React
527 lines
19 KiB
React
import React from "react";
|
||
|
||
import HeaderTwo from "../../../components/header/HeaderTwo";
|
||
import HeroBannerTwo from "../../../components/hero-banner/HeroBannerTwo";
|
||
import FeatureFour from "../../../components/features/FeatureFour";
|
||
import Faq from "../../../components/faq/Faq";
|
||
import CounterThree from "../../../components/counter/CounterThree";
|
||
import AboutTwo from "../../../components/about/AboutTwo";
|
||
import Social from "../../../components/social/Social";
|
||
import Testimonial from "../../../components/testimonial/Testimonial";
|
||
import CallToActionThree from "../../../components/call-to-action/CallToActionThree";
|
||
import FooterTwo from "../../../components/footer/FooterTwo";
|
||
import CopyRightTwo from "../../../components/footer/CopyRightTwo";
|
||
import Image from "next/image";
|
||
|
||
|
||
export const metadata = {
|
||
title: 'Customer Support || Deski-Saas & Software Nextjs Template',
|
||
description: `Unleash the full potential of your software projects with our SaaS-focused Next.js template. Create engaging blogs, showcase your talented team, set up an online shop, provide helpful FAQs, and offer exceptional services with our feature-rich solution. Elevate your SaaS and software development with ease and drive growth. Try it now and take your projects to new heights.`,
|
||
}
|
||
|
||
|
||
const CustomerSupport = () => {
|
||
return (
|
||
<div className="main-page-wrapper">
|
||
|
||
{/* End Page SEO Content */}
|
||
|
||
{/* =============================================
|
||
Start Header
|
||
============================================== */}
|
||
<HeaderTwo />
|
||
{/* End HeaderTwo Variation Three */}
|
||
|
||
{/* =============================================
|
||
Hero Banner Two
|
||
============================================== */}
|
||
<HeroBannerTwo />
|
||
{/* End HeroBannerTwo */}
|
||
|
||
{/* =============================================
|
||
Fancy Feature Four
|
||
============================================== */}
|
||
<div className="fancy-feature-four mt-20">
|
||
<div className="bg-wrapper">
|
||
<Image width={288} height={273}
|
||
src="/images/shape/18.svg"
|
||
alt="shape"
|
||
className="shapes shape-right"
|
||
/>
|
||
<Image width={289} height={277}
|
||
src="/images/shape/19.svg"
|
||
alt="shape"
|
||
className="shapes shape-left"
|
||
/>
|
||
<div className="container">
|
||
<div className="title-style-two text-center mb-100 md-mb-50">
|
||
<div className="row">
|
||
<div className="col-xl-8 col-lg-9 col-md-10 m-auto">
|
||
<p>What we do</p>
|
||
<h2>
|
||
Use deski to drive growth at
|
||
<span>
|
||
your business.{" "}
|
||
<Image width={375} height={44} src="/images/shape/line-shape-2.svg" alt="shape" />
|
||
</span>
|
||
</h2>
|
||
</div>
|
||
{/* End .col */}
|
||
</div>
|
||
</div>
|
||
{/* End .title */}
|
||
|
||
<div className="inner-content">
|
||
<Image width={144} height={144}
|
||
src="/images/shape/20.svg"
|
||
alt="shape"
|
||
className="shapes shape-one"
|
||
/>
|
||
<Image width={201} height={202}
|
||
src="/images/shape/21.svg"
|
||
alt="shape"
|
||
className="shapes shape-two"
|
||
/>
|
||
<FeatureFour />
|
||
</div>
|
||
{/* End .inner-content */}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{/* /.fancy-feature-four */}
|
||
|
||
{/*
|
||
=============================================
|
||
Fancy Text Block Six
|
||
============================================== */}
|
||
<div className="fancy-text-block-six mt-250 md-mt-130">
|
||
<div className="container">
|
||
<div className="row">
|
||
<div
|
||
className="col-lg-6"
|
||
data-aos="fade-right"
|
||
data-aos-duration="1200"
|
||
>
|
||
<div className="title-style-three mb-35">
|
||
<p>GET STARTED IN MINUTES</p>
|
||
<h2>
|
||
<span>
|
||
3 Main Reaosn to{" "}
|
||
<Image width="440" height="46" src="/images/shape/line-shape-3.svg" alt="shape" />
|
||
</span>
|
||
Choose us.
|
||
</h2>
|
||
</div>
|
||
{/* End title */}
|
||
<Faq />
|
||
</div>
|
||
{/* End .col */}
|
||
</div>
|
||
{/* End .row */}
|
||
</div>
|
||
{/* End .container */}
|
||
|
||
<div
|
||
className="img-meta-container"
|
||
data-aos="fade-left"
|
||
data-aos-duration="1200"
|
||
data-aos-delay="100"
|
||
>
|
||
<Image width={799} height={633} style={{height:'fit-content'}} src="/images/assets/feature-img-08.png" alt="feature" />
|
||
<Image width={20} height={20}
|
||
src="/images/shape/22.svg"
|
||
alt="shape"
|
||
className="shapes shape-one"
|
||
/>
|
||
<Image width={8} height={8}
|
||
src="/images/shape/23.svg"
|
||
alt="shape"
|
||
className="shapes shape-two"
|
||
/>
|
||
<Image width={10} height={10}
|
||
src="/images/shape/24.svg"
|
||
alt="shape"
|
||
className="shapes shape-three"
|
||
/>
|
||
<Image width={17} height={17}
|
||
src="/images/shape/25.svg"
|
||
alt="shape"
|
||
className="shapes shape-four"
|
||
/>
|
||
<Image width={234} height={234}
|
||
src="/images/shape/26.svg"
|
||
alt="shape"
|
||
className="shapes shape-five"
|
||
/>
|
||
<Image width={13} height={14}
|
||
src="/images/shape/27.svg"
|
||
alt="shape"
|
||
className="shapes shape-six"
|
||
/>
|
||
<Image width={6} height={8}
|
||
src="/images/shape/28.svg"
|
||
alt="shape"
|
||
className="shapes shape-seven"
|
||
/>
|
||
</div>
|
||
</div>
|
||
{/* /.fancy-text-block-six */}
|
||
|
||
<div className="counter-with-icon-one pt-200 md-pt-80">
|
||
<div className="container">
|
||
<CounterThree />
|
||
</div>
|
||
</div>
|
||
{/* /.counter-with-icon-one */}
|
||
|
||
{/*
|
||
=============================================
|
||
Fancy Text Block
|
||
============================================== */}
|
||
<div className="fancy-text-block-seven mt-150 md-mt-100">
|
||
<div className="bg-wrapper" style={{background: `url(/images/shape/bg.png) no-repeat top`}}>
|
||
<Image width={9} height={9}
|
||
src="/images/shape/29.svg"
|
||
alt="shape"
|
||
className="shapes shape-one"
|
||
/>
|
||
<Image width={11} height={11}
|
||
src="/images/shape/30.svg"
|
||
alt="shape"
|
||
className="shapes shape-two"
|
||
/>
|
||
<Image width={8} height={8}
|
||
src="/images/shape/31.svg"
|
||
alt="shape"
|
||
className="shapes shape-three"
|
||
/>
|
||
<Image width={17} height={17}
|
||
src="/images/shape/32.svg"
|
||
alt="shape"
|
||
className="shapes shape-four"
|
||
/>
|
||
<Image width={8} height={8}
|
||
src="/images/shape/33.svg"
|
||
alt="shape"
|
||
className="shapes shape-five"
|
||
/>
|
||
<div className="container">
|
||
<AboutTwo />
|
||
</div>
|
||
</div>
|
||
{/* /.bg-wrapper */}
|
||
</div>
|
||
{/* /.fancy-text-block-seven */}
|
||
|
||
{/*
|
||
=============================================
|
||
Fancy Text block Eight
|
||
============================================== */}
|
||
<div className="fancy-text-block-eight pt-150 pb-200 md-pt-100 md-pb-150">
|
||
<div className="container">
|
||
<div className="title-style-two text-center mb-150 md-mb-70">
|
||
<div className="row">
|
||
<div className="col-xl-8 col-lg-9 col-md-10 m-auto">
|
||
<p>Features</p>
|
||
<h2>
|
||
Use deski to drive growth at
|
||
<span>
|
||
your business.
|
||
<Image width={375} height={44} src="/images/shape/line-shape-2.svg" alt="shape" />
|
||
</span>
|
||
</h2>
|
||
</div>
|
||
{/* End .col */}
|
||
</div>
|
||
</div>
|
||
{/* End .title */}
|
||
|
||
<div className="block-style-six pb-150 md-pb-70">
|
||
<div className="row">
|
||
<div
|
||
className="col-lg-5"
|
||
data-aos="fade-right"
|
||
data-aos-duration="1200"
|
||
>
|
||
<div className="text-details pt-35 md-pb-50">
|
||
<Image width="51" height="48" src="/images/icon/27.svg" alt="icon" className="icon" />
|
||
<h3 className="title font-gilroy-bold">
|
||
Make communication Fast & efficient.
|
||
</h3>
|
||
<p className="text-meta">
|
||
Our chatbots and live chat capture more ipsum of your best
|
||
leads and convert them while they’re hot dummy text.
|
||
</p>
|
||
<div className="quote-wrapper">
|
||
<div
|
||
className="
|
||
quote-icon
|
||
d-flex
|
||
align-items-center
|
||
justify-content-center
|
||
"
|
||
>
|
||
<Image width="40" height="28" src="/images/icon/28.svg" alt="icon" />
|
||
</div>
|
||
<blockquote>
|
||
“Our team really feels great to use deski apps specially
|
||
their quality”
|
||
</blockquote>
|
||
<div className="name">
|
||
<strong>Micle Duke,</strong> Product Manager <br />
|
||
Uber Inc.
|
||
</div>
|
||
</div>
|
||
{/* /.quote-wrapper */}
|
||
</div>
|
||
{/* /.text-details */}
|
||
</div>
|
||
{/* End .col */}
|
||
|
||
<div
|
||
className="col-lg-7 col-md-9 m-auto"
|
||
data-aos="fade-left"
|
||
data-aos-duration="1200"
|
||
>
|
||
<div className="illustration-holder illustration-one">
|
||
<Image width={614} height={649} style={{height:'fit-content'}}
|
||
src="/images/assets/feature-img-09.png"
|
||
alt="image"
|
||
className="ms-auto"
|
||
/>
|
||
<div className="shapes shape-one"></div>
|
||
<div className="shapes shape-two"></div>
|
||
<div className="shapes shape-three"></div>
|
||
<div className="shapes shape-four"></div>
|
||
<div className="shapes shape-five"></div>
|
||
<Image width={104} height={104}
|
||
src="/images/shape/35.svg"
|
||
alt="shape"
|
||
className="shapes shape-six"
|
||
/>
|
||
<Image width={143} height={143}
|
||
src="/images/shape/36.svg"
|
||
alt="shape"
|
||
className="shapes shape-seven"
|
||
/>
|
||
</div>
|
||
</div>
|
||
{/* End .col */}
|
||
</div>
|
||
{/* End .title */}
|
||
</div>
|
||
{/* /.block-style-six */}
|
||
|
||
<div className="block-style-six pt-150 md-pt-40">
|
||
<div className="row">
|
||
<div
|
||
className="col-lg-5 order-lg-last"
|
||
data-aos="fade-left"
|
||
data-aos-duration="1200"
|
||
>
|
||
<div className="text-details pt-35 md-pb-50">
|
||
<Image width="55" height="52" src="/images/icon/29.svg" alt="image" className="icon" />
|
||
<h3 className="title font-gilroy-bold">
|
||
Friendly user interface & easy to use.
|
||
</h3>
|
||
<p className="text-meta">
|
||
Deski stand with friendly interface with lots of features
|
||
that help our team and csutomer to collbarate easily.
|
||
</p>
|
||
<div className="quote-wrapper">
|
||
<div
|
||
className="
|
||
quote-icon
|
||
d-flex
|
||
align-items-center
|
||
justify-content-center
|
||
"
|
||
>
|
||
<Image width="40" height="28" src="/images/icon/28.svg" alt="icon" />
|
||
</div>
|
||
<blockquote>
|
||
“Our team really feels great to use deski apps specially
|
||
their quality”
|
||
</blockquote>
|
||
<div className="name">
|
||
<strong>Micle Duke,</strong> Product Manager <br />
|
||
Uber Inc.
|
||
</div>
|
||
</div>
|
||
{/* /.quote-wrapper */}
|
||
</div>
|
||
{/* /.text-details */}
|
||
</div>
|
||
{/* End .col */}
|
||
|
||
<div
|
||
className="col-lg-7 col-md-9 m-auto order-lg-first"
|
||
data-aos="fade-right"
|
||
data-aos-duration="1200"
|
||
>
|
||
<div className="illustration-holder illustration-two">
|
||
<Image width={599} height={529} style={{height:'fit-content'}}
|
||
src="/images/assets/feature-img-10.png"
|
||
alt="image"
|
||
className="me-auto"
|
||
/>
|
||
<div className="shapes shape-one"></div>
|
||
<div className="shapes shape-two"></div>
|
||
<div className="shapes shape-three"></div>
|
||
<div className="shapes shape-four"></div>
|
||
<Image width={162} height={163}
|
||
src="/images/shape/40.svg"
|
||
alt="shape"
|
||
className="shapes shape-five"
|
||
/>
|
||
<Image width={116} height={116}
|
||
src="/images/shape/41.svg"
|
||
alt="shape"
|
||
className="shapes shape-six"
|
||
/>
|
||
</div>
|
||
</div>
|
||
{/* End .col */}
|
||
</div>
|
||
</div>
|
||
{/* /.block-style-six */}
|
||
</div>
|
||
</div>
|
||
{/* /.fancy-text-block-eight */}
|
||
|
||
{/*=====================================================
|
||
Useable Tools
|
||
===================================================== */}
|
||
<div className="useable-tools-section-two bg-shape mb-200 md-mb-90">
|
||
<div className="bg-wrapper">
|
||
<div className="shapes shape-one"></div>
|
||
<div className="shapes shape-two"></div>
|
||
<div className="shapes shape-three"></div>
|
||
<div className="shapes shape-four"></div>
|
||
<div className="container">
|
||
<div className="title-style-two text-center mb-70 md-mb-10">
|
||
<div className="row">
|
||
<div className="col-lg-10 col-md-11 m-auto">
|
||
<p>Integrates with your tools</p>
|
||
<h2>
|
||
Connect deski with the software you
|
||
<span>
|
||
use every
|
||
<Image width={375} height={44} src="/images/shape/line-shape-2.svg" alt="shape" />
|
||
</span>
|
||
day.
|
||
</h2>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{/* /.title-style-two */}
|
||
|
||
<div className="icon-wrapper">
|
||
<Social />
|
||
</div>
|
||
{/* /.icon-wrapper */}
|
||
</div>
|
||
{/* /.container */}
|
||
</div>
|
||
{/* /.bg-wrapper */}
|
||
</div>
|
||
{/* /.useable-tools-section-two */}
|
||
|
||
{/* =====================================================
|
||
Client Feedback Slider One
|
||
===================================================== */}
|
||
<div className="client-feedback-slider-one pt-50 pb-170 md-pb-80">
|
||
<div className="shapes-holder">
|
||
<Image width={726} height={786} src="/images/shape/39.svg" alt="shape" />
|
||
<Image width={175} height={175}
|
||
src="/images/shape/42.svg"
|
||
alt="shape"
|
||
className="shapes shape-one"
|
||
/>
|
||
<Image width={61} height={61}
|
||
src="/images/media/img_21.png"
|
||
alt="shape"
|
||
className="cp-img-one"
|
||
/>
|
||
<Image width={76} height={76}
|
||
src="/images/media/img_22.png"
|
||
alt="shape"
|
||
className="cp-img-two"
|
||
/>
|
||
<Image width={51} height={51}
|
||
src="/images/media/img_23.png"
|
||
alt="shape"
|
||
className="cp-img-three"
|
||
/>
|
||
<Image width={82} height={82}
|
||
src="/images/media/img_24.png"
|
||
alt="shape"
|
||
className="cp-img-four"
|
||
/>
|
||
<div className="title-style-two">
|
||
<h2>
|
||
What’s <br />
|
||
Our Client Say <br />
|
||
About Us.
|
||
</h2>
|
||
</div>
|
||
</div>
|
||
{/* /.shapes-holder */}
|
||
<div className="container">
|
||
<div className="row">
|
||
<div className="col-lg-6 ms-auto">
|
||
<div className="feedback-meta">
|
||
<div className="watermark font-gilroy-bold">Feedback</div>
|
||
<Image width="75" height="53" src="/images/icon/30.svg" alt="shape" className="icon" />
|
||
<div className="clientSliderOne">
|
||
<Testimonial />
|
||
</div>
|
||
</div>
|
||
{/* /.feedback-meta */}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{/* /.container */}
|
||
</div>
|
||
{/* /.client-feedback-slider-one */}
|
||
|
||
{/* =====================================================
|
||
Fancy Short Banner Three
|
||
===================================================== */}
|
||
<div className="fancy-short-banner-three mt-100 md-mt-40">
|
||
<div className="container">
|
||
<div className="bg-wrapper">
|
||
<CallToActionThree />
|
||
</div>
|
||
{/* /.bg-wrapper */}
|
||
</div>
|
||
{/* /.container */}
|
||
</div>
|
||
{/* /.fancy-short-banner-four */}
|
||
|
||
{/* =====================================================
|
||
Footer Style Two
|
||
===================================================== */}
|
||
<footer className="theme-footer-two pt-150 md-pt-80">
|
||
<div className="top-footer">
|
||
<div className="container">
|
||
<FooterTwo />
|
||
</div>
|
||
{/* /.container */}
|
||
</div>
|
||
{/* /.top-footer */}
|
||
|
||
<div className="container">
|
||
<div className="bottom-footer-content">
|
||
<CopyRightTwo />
|
||
</div>
|
||
{/* /.bottom-footer */}
|
||
</div>
|
||
</footer>
|
||
{/* /.theme-footer-one */}
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default CustomerSupport;
|