Compare commits
8 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 victorAnumudu
|
cfe6517bc8 | ||
|
CHIEFSOFT\ameye
|
6c2f918a88 | ||
 ameye
|
94b57bb414 | ||
|
victorAnumudu
|
e2463ac6af | ||
|
ameye
|
29310a8da3 | ||
|
victorAnumudu
|
360b84f829 | ||
|
ameye
|
c881413b15 | ||
|
CHIEFSOFT\ameye
|
dcdf3b5816 |
@@ -61,7 +61,7 @@ function Drawer({ drawer, action }) {
|
|||||||
<div className="offcanvas-social">
|
<div className="offcanvas-social">
|
||||||
<ul className="text-center">
|
<ul className="text-center">
|
||||||
<li>
|
<li>
|
||||||
<a href={process.env.REACT_APP_FACEBOOK_LINK} >
|
<a href={process.env.NEXT_PUBLIC_FACEBOOK_LINK} >
|
||||||
<i className="fab fa-facebook-f"></i>
|
<i className="fab fa-facebook-f"></i>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
@@ -78,12 +78,12 @@ function Drawer({ drawer, action }) {
|
|||||||
<li>
|
<li>
|
||||||
<a href="#">
|
<a href="#">
|
||||||
<i className="fal fa-envelope"></i>{' '}
|
<i className="fal fa-envelope"></i>{' '}
|
||||||
{process.env.REACT_APP_SUPPORT_EMAIL}
|
{process.env.NEXT_PUBLIC_SUPPORT_EMAIL}
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#">
|
<a href="#">
|
||||||
<i className="fal fa-phone"></i> {process.env.REACT_APP_SUPPORT_PHONE}
|
<i className="fal fa-phone"></i> {process.env.NEXT_PUBLIC_SUPPORT_PHONE}
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
|
|||||||
@@ -6752,12 +6752,12 @@ blockquote cite {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.appie-about-8-box {
|
.appie-about-8-box {
|
||||||
padding: 50px 50px 0px 50px;
|
padding: 50px;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
}
|
}
|
||||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
||||||
.appie-about-8-box {
|
.appie-about-8-box {
|
||||||
padding: 50px 25px 0px 25px;
|
padding: 25px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
||||||
|
|||||||
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
+23
-2
@@ -1,5 +1,9 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import FooterHomeOne from '../components/FooterHomeOne';
|
import FooterHomeOne from '../components/FooterHomeOne';
|
||||||
|
import HeroNews from '../components/News/HeroNews';
|
||||||
|
import BackToTop from '../components/BackToTop';
|
||||||
|
import ServiceNav from '../components/navigation/ServiceNav';
|
||||||
|
import Blogs from '../components/News/Blogs';
|
||||||
|
|
||||||
// must be a better way to centralize the style = TEMPORARY USE
|
// must be a better way to centralize the style = TEMPORARY USE
|
||||||
import '../assets/css/bootstrap.min.css';
|
import '../assets/css/bootstrap.min.css';
|
||||||
@@ -14,8 +18,25 @@ import '../assets/css/style.css';
|
|||||||
function page() {
|
function page() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div>Bog Here</div>
|
<ServiceNav />
|
||||||
<FooterHomeOne className={undefined} />
|
<HeroNews
|
||||||
|
title="Blogs"
|
||||||
|
breadcrumb={[
|
||||||
|
{ link: "/", title: "Home" },
|
||||||
|
{ link: "/blog", title: "Blogs" },
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<section className="blogpage-section">
|
||||||
|
<div className="container">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-12">
|
||||||
|
<Blogs pathname='/blog' />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<FooterHomeOne className='' />
|
||||||
|
<BackToTop className='' />
|
||||||
</>
|
</>
|
||||||
|
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -0,0 +1,55 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import frame from '../assets/images/use-case-side-main.png'; //about-frame.png'
|
||||||
|
import screen from '../assets/images/use-case-side-extra.png'; //about-screen.png'
|
||||||
|
import Image from 'next/image';
|
||||||
|
|
||||||
|
const AboutApp = ({ video, dark }) => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<section className="row_am about_app_section _">
|
||||||
|
<div className="container">
|
||||||
|
<div className="row modern_ui_section">
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div className="about_img" data-aos="fade-in" data-aos-duration="1500">
|
||||||
|
<div className="frame_img">
|
||||||
|
<Image width='100%' height='auto' className="w-100 moving_position_animatin" src={frame} alt="image" />
|
||||||
|
</div>
|
||||||
|
<div className="screen_img">
|
||||||
|
<Image width='100%' height='auto' className="w-100 moving_animation" src={screen} alt="image" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div className="about_text">
|
||||||
|
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100">
|
||||||
|
<h2>Motivate & Organize <br /> <span>Rewards</span></h2>
|
||||||
|
<p>
|
||||||
|
With a planned reward, the parent can introduce the family to earning and start financial education early.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<ul className="design_block">
|
||||||
|
<li data-aos="fade-up" data-aos-duration="1500">
|
||||||
|
<h4>Goals Completed</h4>
|
||||||
|
<p>Motivate with rewards for goals completed, passing the exam, finishing chores, and learning new skills. </p>
|
||||||
|
</li>
|
||||||
|
<li data-aos="fade-up" data-aos-duration="1500">
|
||||||
|
<h4>Connect Family</h4>
|
||||||
|
<p>It takes a village to raise a kid and share good news and encouragement from the more prominent family. Connect family to the achievements to boost encouragement. </p>
|
||||||
|
</li>
|
||||||
|
<li data-aos="fade-up" data-aos-duration="1500">
|
||||||
|
<h4>Find any Task </h4>
|
||||||
|
<p>Make more, connect to the marketplace, and earn from appropriate tasks.</p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default AboutApp
|
||||||
+15
-13
@@ -1,6 +1,6 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import thumb5 from '../assets/images/about-thumb-5.png';
|
import thumb5 from '../assets/images/about-thumb-5.png';
|
||||||
import cardImg from '../assets/images/home/card-home-01.png'
|
import cardImg from '../assets/images/home/wrench-card-only.png'
|
||||||
// import bg from '../assets/images/background-bg.jpg'
|
// import bg from '../assets/images/background-bg.jpg'
|
||||||
import Image from 'next/image';
|
import Image from 'next/image';
|
||||||
|
|
||||||
@@ -23,23 +23,24 @@ function AfterHero() {
|
|||||||
<div className="row">
|
<div className="row">
|
||||||
<div className="col-lg-7 mb-3 mb-lg-0">
|
<div className="col-lg-7 mb-3 mb-lg-0">
|
||||||
<div className='appie-about-container'>
|
<div className='appie-about-container'>
|
||||||
<div className="appie-about-8-box">
|
<div className='row appie-about-8-box'>
|
||||||
|
<div className="col-12 col-md-6">
|
||||||
<h3 className="title">
|
<h3 className="title">
|
||||||
Reward Accomplishments
|
Reward Accomplishments
|
||||||
</h3>
|
</h3>
|
||||||
<p>
|
<p>
|
||||||
Set goals, tasks, or anything that motivates or needs to be done and reward completion. WrenchBoard is the platform to plan rewards off pick your nose and blow
|
Set goals, tasks, or anything that motivates or needs to be done and reward completion. WrenchBoard is the platform to plan rewards off pick your nose and blow
|
||||||
</p>
|
</p>
|
||||||
</div>
|
<div className=''>
|
||||||
<div className='row'>
|
<a className="mb-5 mb-md-0 main-btn" href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
|
||||||
<div className='col-12 col-sm-4 order-2 order-sm-1 align-self-end'>
|
|
||||||
<a className="m-1 main-btn" href={process.env.REACT_APP_DASH_URL_LOGIN}>
|
|
||||||
Learn More <i className="fal fa-arrow-right" />
|
Learn More <i className="fal fa-arrow-right" />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-12 col-sm-8 order-1 order-sm-2">
|
</div>
|
||||||
|
<div className="col-12 col-md-6">
|
||||||
<Image
|
<Image
|
||||||
src={cardImg}
|
src={cardImg}
|
||||||
|
className='w-100 h-100'
|
||||||
width={'100%'}
|
width={'100%'}
|
||||||
height={'100%'}
|
height={'100%'}
|
||||||
alt=""
|
alt=""
|
||||||
@@ -50,7 +51,8 @@ function AfterHero() {
|
|||||||
</div>
|
</div>
|
||||||
<div className="col-lg-5">
|
<div className="col-lg-5">
|
||||||
<div className='appie-about-container'>
|
<div className='appie-about-container'>
|
||||||
<div className="appie-about-8-box">
|
<div className='row appie-about-8-box'>
|
||||||
|
<div className="col-12 col-md-6">
|
||||||
<h3 className="title">
|
<h3 className="title">
|
||||||
Assign Faster with <br />
|
Assign Faster with <br />
|
||||||
wrenchAgent
|
wrenchAgent
|
||||||
@@ -58,16 +60,16 @@ function AfterHero() {
|
|||||||
<p>
|
<p>
|
||||||
Ask our ❛❛<span className=''>wrench</span><span className=''>Agent</span>❜❜ Generative AI to assist
|
Ask our ❛❛<span className=''>wrench</span><span className=''>Agent</span>❜❜ Generative AI to assist
|
||||||
</p>
|
</p>
|
||||||
</div>
|
<div className=''>
|
||||||
<div className='row'>
|
<a className="mb-5 mb-md-0 main-btn" href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
|
||||||
<div className='col-12 col-sm-4 order-2 order-sm-1 align-self-end'>
|
|
||||||
<a className="m-1 main-btn" href={process.env.REACT_APP_DASH_URL_LOGIN}>
|
|
||||||
Learn More <i className="fal fa-arrow-right" />
|
Learn More <i className="fal fa-arrow-right" />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-12 col-sm-8 order-1 order-sm-2">
|
</div>
|
||||||
|
<div className="col-12 col-md-6">
|
||||||
<Image
|
<Image
|
||||||
src={thumb5}
|
src={thumb5}
|
||||||
|
className='w-100 h-100'
|
||||||
width={'100%'}
|
width={'100%'}
|
||||||
height={'100%'}
|
height={'100%'}
|
||||||
alt=""
|
alt=""
|
||||||
|
|||||||
@@ -34,7 +34,7 @@ function HeroHomeOne() {
|
|||||||
<p>Your place to set family goals and reward achievements. Find tasks to earn from, or build a task portfolio and find others to perform tasks for you.</p>
|
<p>Your place to set family goals and reward achievements. Find tasks to earn from, or build a task portfolio and find others to perform tasks for you.</p>
|
||||||
<ul className='d-flex justify-content-center justify-content-lg-start'>
|
<ul className='d-flex justify-content-center justify-content-lg-start'>
|
||||||
<li className=''>
|
<li className=''>
|
||||||
<a className="item-2" target='_blank' href={process.env.REACT_APP_APPLE_APP}>
|
<a className="item-2" target='_blank' href={process.env.NEXT_PUBLIC_APPLE_APP}>
|
||||||
<i className="fab fa-apple"></i>
|
<i className="fab fa-apple"></i>
|
||||||
<span>
|
<span>
|
||||||
Available on the <span>App Store</span>
|
Available on the <span>App Store</span>
|
||||||
@@ -42,7 +42,7 @@ function HeroHomeOne() {
|
|||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li className=''>
|
<li className=''>
|
||||||
<a className="item-2" target='_blank' href={process.env.REACT_APP_ANDROID_APP}>
|
<a className="item-2" target='_blank' href={process.env.NEXT_PUBLIC_ANDROID_APP}>
|
||||||
<i className="fab fa-google-play"></i>
|
<i className="fab fa-google-play"></i>
|
||||||
<span>
|
<span>
|
||||||
Available on the <span>Google Play</span>
|
Available on the <span>Google Play</span>
|
||||||
|
|||||||
@@ -11,6 +11,7 @@ import TrafficHomeTwo from './TrafficHomeTwo';
|
|||||||
import AfterHero from './AfterHero';
|
import AfterHero from './AfterHero';
|
||||||
import NextAfterHero from './NextAfterHero';
|
import NextAfterHero from './NextAfterHero';
|
||||||
import BackToTop from './BackToTop';
|
import BackToTop from './BackToTop';
|
||||||
|
import SelectFeatures from "@/app/components/SelectFeatutes";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -22,10 +23,11 @@ function HomeOne() {
|
|||||||
<HomeNav />
|
<HomeNav />
|
||||||
<HeroHomeOne />
|
<HeroHomeOne />
|
||||||
<AfterHero />
|
<AfterHero />
|
||||||
<NextAfterHero />
|
<SelectFeatures className='pb-55-err' />
|
||||||
<ServicesHomeOne />
|
{/*<NextAfterHero />*/}
|
||||||
|
{/*<ServicesHomeOne />*/}
|
||||||
<TrafficHomeOne />
|
<TrafficHomeOne />
|
||||||
<TrafficHomeTwo />
|
{/*<TrafficHomeTwo />*/}
|
||||||
<BlogHomeOne />
|
<BlogHomeOne />
|
||||||
<FooterHomeOne />
|
<FooterHomeOne />
|
||||||
<BackToTop className='' />
|
<BackToTop className='' />
|
||||||
|
|||||||
@@ -0,0 +1,252 @@
|
|||||||
|
"use client"
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
//import { Link } from 'react-router-dom';
|
||||||
|
import thumb from '../assets/images/features-thumb-01.png';
|
||||||
|
import shapeSix from '../assets/images/shape/shape-6.png';
|
||||||
|
import shapeSeven from '../assets/images/shape/shape-7.png';
|
||||||
|
import shapeEight from '../assets/images/shape/shape-8.png';
|
||||||
|
import Image from 'next/image';
|
||||||
|
function SelectFeatures({ className }) {
|
||||||
|
const [tab, setTab] = useState('setting');
|
||||||
|
const handleClick = (e, value) => {
|
||||||
|
e.preventDefault();
|
||||||
|
setTab(value);
|
||||||
|
};
|
||||||
|
//appie-services-2-area appie-services-8-area pt-90 pb-55
|
||||||
|
return (
|
||||||
|
<section className={`appie-features-area pt-100 ${className}`} id="features" style={{ marginBottom: '20px' }} >
|
||||||
|
<div className="container">
|
||||||
|
<div className="row align-items-center">
|
||||||
|
<div className="col-lg-3">
|
||||||
|
<div className="appie-features-tabs-btn">
|
||||||
|
<div
|
||||||
|
className="nav flex-column nav-pills"
|
||||||
|
id="v-pills-tab"
|
||||||
|
role="tablist"
|
||||||
|
aria-orientation="vertical"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
onClick={(e) => handleClick(e, 'setting')}
|
||||||
|
className={`nav-link ${tab === 'setting' ? 'active' : ''}`}
|
||||||
|
id="v-pills-home-tab"
|
||||||
|
data-toggle="pill"
|
||||||
|
href="#v-pills-home"
|
||||||
|
role="tab"
|
||||||
|
aria-controls="v-pills-home"
|
||||||
|
aria-selected="true"
|
||||||
|
>
|
||||||
|
<i className="fas fa-cog" /> Reward achievement
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
onClick={(e) => handleClick(e, 'report')}
|
||||||
|
className={`nav-link ${tab === 'report' ? 'active' : ''}`}
|
||||||
|
id="v-pills-profile-tab"
|
||||||
|
data-toggle="pill"
|
||||||
|
href="#v-pills-profile"
|
||||||
|
role="tab"
|
||||||
|
aria-controls="v-pills-profile"
|
||||||
|
aria-selected="false"
|
||||||
|
>
|
||||||
|
<i className="fas fa-exclamation-triangle" /> Assign tasks or chores
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
onClick={(e) => handleClick(e, 'notice')}
|
||||||
|
className={`nav-link ${tab === 'notice' ? 'active' : ''}`}
|
||||||
|
id="v-pills-messages-tab"
|
||||||
|
data-toggle="pill"
|
||||||
|
href="#v-pills-messages"
|
||||||
|
role="tab"
|
||||||
|
aria-controls="v-pills-messages"
|
||||||
|
aria-selected="false"
|
||||||
|
>
|
||||||
|
<i className="fas fa-bell" /> Family engagement
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
onClick={(e) => handleClick(e, 'app')}
|
||||||
|
className={`nav-link ${tab === 'app' ? 'active' : ''}`}
|
||||||
|
id="v-pills-settings-tab"
|
||||||
|
data-toggle="pill"
|
||||||
|
href="#v-pills-settings"
|
||||||
|
role="tab"
|
||||||
|
aria-controls="v-pills-settings"
|
||||||
|
aria-selected="false"
|
||||||
|
>
|
||||||
|
<i className="fas fa-lock" /> Fund wallets
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-lg-9">
|
||||||
|
<div className="tab-content" id="v-pills-tabContent">
|
||||||
|
<div
|
||||||
|
className={`${
|
||||||
|
tab === 'setting' ? 'show active' : ''
|
||||||
|
} tab-pane fade`}
|
||||||
|
id="v-pills-home"
|
||||||
|
role="tabpanel"
|
||||||
|
aria-labelledby="v-pills-home-tab"
|
||||||
|
>
|
||||||
|
<div className="row align-items-center">
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div
|
||||||
|
className="appie-features-thumb text-center wow animated fadeInUp"
|
||||||
|
data-wow-duration="2000ms"
|
||||||
|
data-wow-delay="200ms"
|
||||||
|
>
|
||||||
|
<Image src={thumb} alt=""
|
||||||
|
style={{ width: '350px', height:'auto', margin: 'auto' }} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div
|
||||||
|
className="appie-features-content wow animated fadeInRight"
|
||||||
|
data-wow-duration="2000ms"
|
||||||
|
data-wow-delay="600ms"
|
||||||
|
>
|
||||||
|
<span>Custom Reactions</span>
|
||||||
|
<h3 className="title">
|
||||||
|
Let the <br /> Conversation flow
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
Car boot absolutely bladdered posh burke the
|
||||||
|
wireless mush some dodg.
|
||||||
|
</p>
|
||||||
|
<a className="main-btn" href="/about-us">
|
||||||
|
Learn More
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className={`${tab === 'report' ? 'show active' : ''} tab-pane fade`}
|
||||||
|
id="v-pills-profile"
|
||||||
|
role="tabpanel"
|
||||||
|
aria-labelledby="v-pills-profile-tab"
|
||||||
|
>
|
||||||
|
<div className="row align-items-center">
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div
|
||||||
|
className="appie-features-thumb text-center animated fadeInUp"
|
||||||
|
data-wow-duration="2000ms"
|
||||||
|
data-wow-delay="200ms"
|
||||||
|
>
|
||||||
|
<Image src={thumb} alt=""
|
||||||
|
style={{ width: '350px', height:'auto', margin: 'auto' }} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div
|
||||||
|
className="appie-features-content animated fadeInRight"
|
||||||
|
data-wow-duration="2000ms"
|
||||||
|
data-wow-delay="600ms"
|
||||||
|
>
|
||||||
|
<span>Custom Reacyions</span>
|
||||||
|
<h3 className="title">
|
||||||
|
Let the <br /> Conversation flow
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
Car boot absolutely bladdered posh burke the
|
||||||
|
wireless mush some dodg.
|
||||||
|
</p>
|
||||||
|
<a className="main-btn" href="#">
|
||||||
|
Learn More
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className={`${tab === 'notice' ? 'show active' : ''} tab-pane fade`}
|
||||||
|
id="v-pills-messages"
|
||||||
|
role="tabpanel"
|
||||||
|
aria-labelledby="v-pills-messages-tab"
|
||||||
|
>
|
||||||
|
<div className="row align-items-center">
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div
|
||||||
|
className="appie-features-thumb text-center animated fadeInUp"
|
||||||
|
data-wow-duration="2000ms"
|
||||||
|
data-wow-delay="200ms"
|
||||||
|
>
|
||||||
|
<Image src={thumb} alt=""
|
||||||
|
style={{ width: '350px', height:'auto', margin: 'auto' }} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div
|
||||||
|
className="appie-features-content animated fadeInRight"
|
||||||
|
data-wow-duration="2000ms"
|
||||||
|
data-wow-delay="600ms"
|
||||||
|
>
|
||||||
|
<span>Custom Reacyions</span>
|
||||||
|
<h3 className="title">
|
||||||
|
Let the <br /> Conversation flow
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
Car boot absolutely bladdered posh burke the
|
||||||
|
wireless mush some dodg.
|
||||||
|
</p>
|
||||||
|
<a className="main-btn" href="#">
|
||||||
|
Learn More
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className={`${tab === 'app' ? 'show active' : ''} tab-pane fade`}
|
||||||
|
id="v-pills-settings"
|
||||||
|
role="tabpanel"
|
||||||
|
aria-labelledby="v-pills-settings-tab"
|
||||||
|
>
|
||||||
|
<div className="row align-items-center">
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div
|
||||||
|
className="appie-features-thumb text-center animated fadeInUp"
|
||||||
|
data-wow-duration="2000ms"
|
||||||
|
data-wow-delay="200ms"
|
||||||
|
>
|
||||||
|
<Image src={thumb} alt=""
|
||||||
|
style={{ width: '350px', height:'auto', margin: 'auto' }} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-lg-6">
|
||||||
|
<div
|
||||||
|
className="appie-features-content animated fadeInRight"
|
||||||
|
data-wow-duration="2000ms"
|
||||||
|
data-wow-delay="600ms"
|
||||||
|
>
|
||||||
|
<span>Custom Reacyions</span>
|
||||||
|
<h3 className="title">
|
||||||
|
Let the <br /> Conversation flow
|
||||||
|
</h3>
|
||||||
|
<p>
|
||||||
|
Car boot absolutely bladdered posh burke the
|
||||||
|
wireless mush some dodg.
|
||||||
|
</p>
|
||||||
|
<a className="main-btn" href="#">
|
||||||
|
Learn More
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/*<div className="features-shape-1">*/}
|
||||||
|
{/* <Image src={shapeSix} alt="" />*/}
|
||||||
|
{/*</div>*/}
|
||||||
|
{/*<div className="features-shape-2">*/}
|
||||||
|
{/* <Image src={shapeSeven} alt="" />*/}
|
||||||
|
{/*</div>*/}
|
||||||
|
{/*<div className="features-shape-3">*/}
|
||||||
|
{/* <Image src={shapeEight} alt="" />*/}
|
||||||
|
{/*</div>*/}
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default SelectFeatures;
|
||||||
@@ -26,10 +26,10 @@ function Services({ action }) {
|
|||||||
</div>
|
</div>
|
||||||
<div className="col-lg-4 col-md-7 col-sm-6 col-6 order-2 order-sm-3">
|
<div className="col-lg-4 col-md-7 col-sm-6 col-6 order-2 order-sm-3">
|
||||||
<div className="appie-btn-box text-right">
|
<div className="appie-btn-box text-right">
|
||||||
<a className="login-btn" href={process.env.REACT_APP_DASH_URL_LOGIN}>
|
<a className="login-btn" href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
|
||||||
<i className="fal fa-user"></i> Login
|
<i className="fal fa-user"></i> Login
|
||||||
</a>
|
</a>
|
||||||
<a className="main-btn ml-30" href={process.env.REACT_APP_DASH_URL_SIGNUP}>
|
<a className="main-btn ml-30" href={process.env.NEXT_PUBLIC_DASH_URL_SIGNUP}>
|
||||||
Get Started
|
Get Started
|
||||||
</a>
|
</a>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -0,0 +1,202 @@
|
|||||||
|
"use client"
|
||||||
|
import React, {useState} from 'react';
|
||||||
|
import ContactData from '../Services/ContactData';
|
||||||
|
|
||||||
|
|
||||||
|
function Forms() {
|
||||||
|
|
||||||
|
const [formDetails, setFormDetails] = useState({
|
||||||
|
first_name: '',
|
||||||
|
last_name: '',
|
||||||
|
email: '',
|
||||||
|
subject: '',
|
||||||
|
phone_number: '',
|
||||||
|
action: 1001,
|
||||||
|
message: '',
|
||||||
|
channel: 'WEB',
|
||||||
|
terms_conditions: false
|
||||||
|
})
|
||||||
|
|
||||||
|
const validForm = formDetails.first_name && formDetails.last_name && formDetails.email && formDetails.phone_number && formDetails.subject && formDetails.message
|
||||||
|
|
||||||
|
const handleChange = ({target:{name, value}}) => {
|
||||||
|
setFormDetails(prev => ({...prev, [name]:value}))
|
||||||
|
}
|
||||||
|
|
||||||
|
const [requestStatus, setRequestStatus] = useState({loading:false, status:false, msg:''})
|
||||||
|
|
||||||
|
function handleSubmit(e) {
|
||||||
|
e.preventDefault()
|
||||||
|
setRequestStatus({loading:true, status:false, msg:''})
|
||||||
|
if(!validForm){
|
||||||
|
setRequestStatus({loading:false, status:false, msg:'please, fill all fields'})
|
||||||
|
setTimeout(()=>{
|
||||||
|
setRequestStatus({loading:false, status:false, msg:''})
|
||||||
|
},3000)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
delete formDetails.terms_conditions
|
||||||
|
|
||||||
|
ContactData(formDetails).then(res =>{
|
||||||
|
if(res?.data?.result != '100'){
|
||||||
|
setRequestStatus({loading:false, status:false, msg:'failed to send message'})
|
||||||
|
setTimeout(()=>{
|
||||||
|
setRequestStatus({loading:false, status:false, msg:''})
|
||||||
|
},3000)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
setRequestStatus({loading:false, status:true, msg:'message Sent'})
|
||||||
|
setTimeout(()=>{
|
||||||
|
setRequestStatus({loading:false, status:false, msg:''})
|
||||||
|
setFormDetails({
|
||||||
|
first_name: '',
|
||||||
|
last_name: '',
|
||||||
|
email: '',
|
||||||
|
subject: '',
|
||||||
|
phone_number: '',
|
||||||
|
action: 1001,
|
||||||
|
message: '',
|
||||||
|
channel: 'WEB',
|
||||||
|
terms_conditions: false
|
||||||
|
})
|
||||||
|
},3000)
|
||||||
|
}).catch(err => {
|
||||||
|
setRequestStatus({loading:false, status:false, msg:'failed something went wrong'})
|
||||||
|
setTimeout(()=>{
|
||||||
|
setRequestStatus({loading:false, status:false, msg:''})
|
||||||
|
},3000)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<section className="contact-section">
|
||||||
|
<div className="container">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-4">
|
||||||
|
<div className="contact--info-area">
|
||||||
|
<h3>Get in touch</h3>
|
||||||
|
<p>Looking for help? Fill the form and start a new discussion.</p>
|
||||||
|
<div className="single-info">
|
||||||
|
<h5>Headquaters</h5>
|
||||||
|
<p>
|
||||||
|
<i className="fal fa-home"></i>
|
||||||
|
{process.env.NEXT_PUBLIC_SUPPORT_US_ADDRESS}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="single-info">
|
||||||
|
<h5>Phone</h5>
|
||||||
|
<p>
|
||||||
|
<i className="fal fa-phone"></i>
|
||||||
|
{process.env.NEXT_PUBLIC_SUPPORT_PHONE}
|
||||||
|
<br />
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="single-info">
|
||||||
|
<h5>Support</h5>
|
||||||
|
<p>
|
||||||
|
<i className="fal fa-envelope"></i>
|
||||||
|
{process.env.NEXT_PUBLIC_SUPPORT_EMAIL}
|
||||||
|
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="ab-social">
|
||||||
|
<h5>Follow Us</h5>
|
||||||
|
<a className="fac" href={process.env.NEXT_PUBLIC_FACEBOOK_LINK}>
|
||||||
|
<i className="fab fa-facebook-f"></i>
|
||||||
|
</a>
|
||||||
|
<a className="twi" href={process.env.NEXT_PUBLIC_TWITTER_LINK}>
|
||||||
|
{/* <i className="fab fa-twitter"></i> */}
|
||||||
|
<i className="fab fa-x-twitter" />
|
||||||
|
</a>
|
||||||
|
<a className="you" href="#">
|
||||||
|
<i className="fab fa-youtube"></i>
|
||||||
|
</a>
|
||||||
|
<a className="lin" href={process.env.NEXT_PUBLIC_LINKEDIN_LINK}>
|
||||||
|
<i className="fab fa-linkedin-in"></i>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-8">
|
||||||
|
<div className="contact-form">
|
||||||
|
<h4>Let’s Connect</h4>
|
||||||
|
<form onSubmit={handleSubmit} className="row">
|
||||||
|
<div className="col-md-6">
|
||||||
|
<input type="text" name="first_name" placeholder="First Name" maxLength={15} onChange={handleChange} value={formDetails.first_name} />
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6">
|
||||||
|
<input type="text" name="last_name" placeholder="Last Name" maxLength={15} onChange={handleChange} value={formDetails.last_name} />
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6">
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
name="email"
|
||||||
|
placeholder="Email Address"
|
||||||
|
maxLength={35}
|
||||||
|
onChange={handleChange}
|
||||||
|
value={formDetails.email}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6">
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
name="phone_number"
|
||||||
|
placeholder="Phone Number"
|
||||||
|
maxLength={15}
|
||||||
|
onChange={handleChange}
|
||||||
|
value={formDetails.phone_number}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-12">
|
||||||
|
<input type="text" name="subject" placeholder="Subject" maxLength={35} value={formDetails.subject} onChange={handleChange} />
|
||||||
|
</div>
|
||||||
|
<div className="col-md-12">
|
||||||
|
<textarea
|
||||||
|
name="message"
|
||||||
|
placeholder="How can we help?"
|
||||||
|
onChange={handleChange}
|
||||||
|
value={formDetails.message}
|
||||||
|
></textarea>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6">
|
||||||
|
<div className="condition-check">
|
||||||
|
<input id="terms-conditions" name="terms_conditions" type="checkbox" value={formDetails.terms_conditions} onChange={handleChange} />
|
||||||
|
<label htmlFor="terms-conditions">
|
||||||
|
I agree to the <a href="#">Terms & Conditions</a>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6 text-right">
|
||||||
|
<input
|
||||||
|
type="submit"
|
||||||
|
value={ requestStatus.loading ? 'Sending...' : 'Send Message'}
|
||||||
|
disabled={requestStatus.loading}
|
||||||
|
className={`${!validForm ? 'opacity-25' : 'opacity-100'}`}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
{/* <div className="p-2 col-12">
|
||||||
|
{requestStatus.msg &&
|
||||||
|
}
|
||||||
|
</div> */}
|
||||||
|
<p className={`p-1 w-100 text-center ${requestStatus.status ? 'text-success' : 'text-danger'}`}>{requestStatus.msg}</p>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<div className="bisylms-map">
|
||||||
|
<iframe
|
||||||
|
title="map"
|
||||||
|
src="https://maps.google.com/maps?width=720&height=600&hl=en&coord=33.8573837,-84.4766235&q=Cumberland+Pkwy+SE,+Atlanta,+GA+30339&ie=UTF8&t=p&z=16&iwloc=B&output=embed"
|
||||||
|
></iframe>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Forms;
|
||||||
+15
-2
@@ -1,5 +1,9 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import FooterHomeOne from '../components/FooterHomeOne';
|
import FooterHomeOne from '../components/FooterHomeOne';
|
||||||
|
import BackToTop from '../components/BackToTop';
|
||||||
|
import HeroNews from '../components/News/HeroNews';
|
||||||
|
import ServiceNav from '../components/navigation/ServiceNav';
|
||||||
|
import Forms from './Forms'
|
||||||
|
|
||||||
// must be a better way to centralize the style = TEMPORARY USE
|
// must be a better way to centralize the style = TEMPORARY USE
|
||||||
import '../assets/css/bootstrap.min.css';
|
import '../assets/css/bootstrap.min.css';
|
||||||
@@ -14,8 +18,17 @@ import '../assets/css/style.css';
|
|||||||
function page() {
|
function page() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div>Contact us Here</div>
|
<ServiceNav />
|
||||||
<FooterHomeOne className={undefined} />
|
<HeroNews
|
||||||
|
title="Contact us"
|
||||||
|
breadcrumb={[
|
||||||
|
{ link: '/', title: 'home' },
|
||||||
|
{ link: '/contact', title: 'Contact' },
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<Forms />
|
||||||
|
<FooterHomeOne className='' />
|
||||||
|
<BackToTop className='' />
|
||||||
</>
|
</>
|
||||||
|
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -0,0 +1,47 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import blogImg1 from '../assets/images/blog/1.jpg';
|
||||||
|
import UseCaseData from '../Services/UseCaseData';
|
||||||
|
import Image from 'next/image';
|
||||||
|
import Link from 'next/link';
|
||||||
|
|
||||||
|
|
||||||
|
function UseCase() {
|
||||||
|
|
||||||
|
var UseCaseDataResult = UseCaseData();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="row">
|
||||||
|
{
|
||||||
|
UseCaseDataResult.map((i, index )=> {
|
||||||
|
var blgImg = i.meta_value != null ? "/images/" + i.meta_value : blogImg1;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div key={index} className="col-12 col-md-6 col-lg-4">
|
||||||
|
<div className="post-item-1">
|
||||||
|
|
||||||
|
{<img src={blgImg} alt={i.title} />}
|
||||||
|
<div className="b-post-details">
|
||||||
|
<h3>
|
||||||
|
<Link href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
|
||||||
|
{i.title}
|
||||||
|
</Link>
|
||||||
|
</h3>
|
||||||
|
<Link className="read-more" href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
|
||||||
|
Learn more<i className="fal fa-arrow-right"></i>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
)
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default UseCase;
|
||||||
+26
-2
@@ -1,5 +1,10 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import FooterHomeOne from '../components/FooterHomeOne';
|
import FooterHomeOne from '../components/FooterHomeOne';
|
||||||
|
import BackToTop from '../components/BackToTop';
|
||||||
|
import HeroNews from '../components/News/HeroNews';
|
||||||
|
import ServiceNav from '../components/navigation/ServiceNav';
|
||||||
|
import AboutApp from '../components/AboutApp'
|
||||||
|
import UseCase from './UseCase'
|
||||||
|
|
||||||
// must be a better way to centralize the style = TEMPORARY USE
|
// must be a better way to centralize the style = TEMPORARY USE
|
||||||
import '../assets/css/bootstrap.min.css';
|
import '../assets/css/bootstrap.min.css';
|
||||||
@@ -14,8 +19,27 @@ import '../assets/css/style.css';
|
|||||||
function page() {
|
function page() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div>use Case Here</div>
|
<ServiceNav />
|
||||||
<FooterHomeOne className={undefined} />
|
<HeroNews
|
||||||
|
title="Use Cases"
|
||||||
|
breadcrumb={[
|
||||||
|
{ link: '/', title: 'Home' },
|
||||||
|
{ link: '/use-cases', title: 'Use Cases' },
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<AboutApp video='' dark='' />
|
||||||
|
<section className="blogpage-section">
|
||||||
|
<div className="container">
|
||||||
|
<div className="row">
|
||||||
|
{/* <div className="col-lg-12 col-md-7">
|
||||||
|
<UseCase />
|
||||||
|
</div> */}
|
||||||
|
<UseCase />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<FooterHomeOne className='' />
|
||||||
|
<BackToTop className='' />
|
||||||
</>
|
</>
|
||||||
|
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user