.
This commit is contained in:
Ebube
@@ -1,74 +1,83 @@
|
||||
import React from 'react';
|
||||
import heroThumbOne from '../../assets/images/app-thumb-1.png';
|
||||
import heroThumbTwo from '../../assets/images/app-pic.png';
|
||||
import shapeTwo from '../../assets/images/shape/shape-2.png';
|
||||
import shapeThree from '../../assets/images/shape/shape-3.png';
|
||||
import shapeFour from '../../assets/images/shape/shape-4.png';
|
||||
import getConfig from './../../Config/config'
|
||||
import CustomSlider from '../customSlider/CustomSlider';
|
||||
|
||||
import React from "react";
|
||||
import heroThumbOne from "../../assets/images/app-thumb-1.png";
|
||||
import heroThumbTwo from "../../assets/images/app-pic.png";
|
||||
import shapeTwo from "../../assets/images/shape/shape-2.png";
|
||||
import shapeThree from "../../assets/images/shape/shape-3.png";
|
||||
import shapeFour from "../../assets/images/shape/shape-4.png";
|
||||
import getConfig from "./../../Config/config";
|
||||
import CustomSlider from "../customSlider/CustomSlider";
|
||||
|
||||
function HeroHomeOne() {
|
||||
var site = getConfig()[0];
|
||||
return (
|
||||
<>
|
||||
<section className="appie-hero-area">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div className="appie-hero-content">
|
||||
{/*<span>Welcome To WrenchBoard..</span>*/}
|
||||
<h1 className="appie-title">
|
||||
Turn Chores into Exciting Challenges and Earn <span className='earn-rewards px-2'>Rewards!</span>
|
||||
</h1>
|
||||
<p>
|
||||
Your place to set family goals and reward achievements. Find tasks to earn from, or build a tasks portfolio and find others to perform tasks for you. </p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href={process.env.REACT_APP_APPLE_APP} className="dark" target="_blank">
|
||||
<i className="fab fa-apple" /> Download for iOS
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a className="item-2 light" href={process.env.REACT_APP_ANDROID_APP} target="_blank">
|
||||
<i className="fab fa-google-play" /> Download for
|
||||
Android
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="appie-hero-thumb">
|
||||
<div
|
||||
className="thumb wow animated fadeInUp"
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay="200ms"
|
||||
>
|
||||
{/* <img src={heroThumbOne} alt="WrenchBoard" /> */}
|
||||
<div style={{width: '350px', margin: 'auto'}}>
|
||||
<CustomSlider
|
||||
images={[heroThumbOne, heroThumbOne, heroThumbOne]}
|
||||
speed='5'
|
||||
indicatorColor='#333'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="thumb-2 wow animated fadeInRight"
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay="600ms"
|
||||
>
|
||||
<img src={heroThumbTwo} alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
var site = getConfig()[0];
|
||||
return (
|
||||
<>
|
||||
<section className="appie-hero-area">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div className="appie-hero-content">
|
||||
{/*<span>Welcome To WrenchBoard..</span>*/}
|
||||
<h1 className="appie-title">
|
||||
Turn Chores into Exciting Challenges and Earn{" "}
|
||||
<span className="earn-rewards px-2">Rewards!</span>
|
||||
</h1>
|
||||
<p>
|
||||
Your place to set family goals and reward achievements. Find
|
||||
tasks to earn from, or build a tasks portfolio and find others
|
||||
to perform tasks for you.{" "}
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a
|
||||
href={process.env.REACT_APP_APPLE_APP}
|
||||
className="dark"
|
||||
target="_blank"
|
||||
>
|
||||
<i className="fab fa-apple" /> Download for iOS
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
className="item-2 light"
|
||||
href={process.env.REACT_APP_ANDROID_APP}
|
||||
target="_blank"
|
||||
>
|
||||
<i className="fab fa-google-play" /> Download for Android
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="appie-hero-thumb">
|
||||
<div
|
||||
className="thumb wow animated fadeInUp"
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay="200ms"
|
||||
>
|
||||
{/* <img src={heroThumbOne} alt="WrenchBoard" /> */}
|
||||
<div style={{ width: "350px", margin: "auto" }}>
|
||||
<CustomSlider
|
||||
images={[heroThumbOne, heroThumbOne, heroThumbOne]}
|
||||
speed="5"
|
||||
indicatorColor="#333"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</>
|
||||
);
|
||||
<div
|
||||
className="thumb-2 wow animated fadeInRight"
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay="600ms"
|
||||
>
|
||||
<img src={heroThumbTwo} alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default HeroHomeOne;
|
||||
|
||||
@@ -1,12 +1,17 @@
|
||||
import React from 'react';
|
||||
import IconOne from '../../assets/images/icon/usericon.png';
|
||||
import IconTwo from '../../assets/images/icon/Findtaskicon.png';
|
||||
import IconThree from '../../assets/images/icon/taskicon.png';
|
||||
import IconFour from '../../assets/images/icon/walleticon.png';
|
||||
import React from "react";
|
||||
import IconOne from "../../assets/images/icon/usericon.png";
|
||||
import IconTwo from "../../assets/images/icon/Findtaskicon.png";
|
||||
import IconThree from "../../assets/images/icon/taskicon.png";
|
||||
import IconFour from "../../assets/images/icon/walleticon.png";
|
||||
|
||||
function ServiceItem({ icon, title, description, index }) {
|
||||
return (
|
||||
<div className="appie-single-service text-center mt-30 wow animated fadeInUp" data-wow-duration="2000ms" data-wow-delay={`${200 * (index + 1)}ms`} style={{ cursor: "default" }}>
|
||||
<div
|
||||
className="appie-single-service text-center mt-30 wow animated fadeInUp"
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay={`${200 * (index + 1)}ms`}
|
||||
style={{ cursor: "default" }}
|
||||
>
|
||||
<div className="icon">
|
||||
<img src={icon} alt={title} />
|
||||
</div>
|
||||
@@ -17,39 +22,42 @@ function ServiceItem({ icon, title, description, index }) {
|
||||
}
|
||||
|
||||
function ServicesHomeOne({ className }) {
|
||||
const serviceTitle = ""
|
||||
const serviceTitle = "";
|
||||
const serviceItems = [
|
||||
{
|
||||
icon: IconOne,
|
||||
title: 'Free Account',
|
||||
description: 'Join WrenchBoard. Create an account for Income.',
|
||||
title: "Free Account",
|
||||
description: "Join WrenchBoard. Create an account for Income.",
|
||||
},
|
||||
{
|
||||
icon: IconTwo,
|
||||
title: 'Find Task',
|
||||
description: 'Build a Self-Portfolio with sole purpose to Cash-Out.',
|
||||
title: "Find Task",
|
||||
description: "Build a Self-Portfolio with sole purpose to Cash-Out.",
|
||||
},
|
||||
{
|
||||
icon: IconThree,
|
||||
title: 'Complete',
|
||||
description: 'Organize and Manage your teams efficiently. Manage your workgroup.',
|
||||
title: "Complete",
|
||||
description:
|
||||
"Organize and Manage your teams efficiently. Manage your workgroup.",
|
||||
},
|
||||
{
|
||||
icon: IconFour,
|
||||
title: 'Get Paid',
|
||||
description: 'Start Boosting your Income by earning Cash for your Time and Skills.',
|
||||
title: "Get Paid",
|
||||
description:
|
||||
"Start Boosting your Income by earning Cash for your Time and Skills.",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<section className={`appie-service-area pt-90 pb-50 ${className}`} id="service">
|
||||
<section
|
||||
className={`appie-service-area pt-90 pb-50 ${className}`}
|
||||
id="service"
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-lg-8">
|
||||
<div className="appie-section-title text-center">
|
||||
<h3 className="appie-title">
|
||||
{serviceTitle}
|
||||
</h3>
|
||||
<h3 className="appie-title">{serviceTitle}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -70,4 +78,4 @@ function ServicesHomeOne({ className }) {
|
||||
);
|
||||
}
|
||||
|
||||
export default ServicesHomeOne;
|
||||
export default ServicesHomeOne;
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import React from 'react';
|
||||
import thumb from '../../assets/images/PerformingTaskNew.png';
|
||||
import getConfig from './../../Config/config'
|
||||
import React from "react";
|
||||
import thumb from "../../assets/images/PerformingTaskNew.png";
|
||||
import getConfig from "./../../Config/config";
|
||||
|
||||
function TrafficHomeOne() {
|
||||
var site = getConfig()[0];
|
||||
@@ -16,7 +16,12 @@ function TrafficHomeOne() {
|
||||
<div className="row">
|
||||
{featuresContent.list?.map(({ icon, header, paragraph }, idx) => (
|
||||
<div className="col-lg-6 col-md-6" key={idx}>
|
||||
<div className={`appie-traffic-service features item-${idx + 1} mb-30`} style={{ paddingRight: "45px" }}>
|
||||
<div
|
||||
className={`appie-traffic-service features item-${
|
||||
idx + 1
|
||||
} mb-30`}
|
||||
style={{ paddingRight: "45px" }}
|
||||
>
|
||||
<div className="icon">
|
||||
<i className={icon} />
|
||||
</div>
|
||||
@@ -53,11 +58,28 @@ export default TrafficHomeOne;
|
||||
|
||||
const featuresContent = {
|
||||
title: "on WrenchBoard.",
|
||||
detail: "Performing task on WrenchBoard is easy. All you need is a free account.",
|
||||
detail:
|
||||
"Performing task on WrenchBoard is easy. All you need is a free account.",
|
||||
list: [
|
||||
{ icon: "fal fa-check", header: "Free account", paragraph: "Get family access from parents, or create your free account." },
|
||||
{ icon: "fal fa-check", header: "Suggest or Find Task", paragraph: "Suggest tasks to parents or pick from the market." },
|
||||
{ icon: "fal fa-check", header: "Complete Task", paragraph: "Complete the task as specified." },
|
||||
{ icon: "fal fa-check", header: "Reward", paragraph: "Get your reward as specified." },
|
||||
]
|
||||
}
|
||||
{
|
||||
icon: "fal fa-check",
|
||||
header: "Free account",
|
||||
paragraph: "Get family access from parents, or create your free account.",
|
||||
},
|
||||
{
|
||||
icon: "fal fa-check",
|
||||
header: "Suggest or Find Task",
|
||||
paragraph: "Suggest tasks to parents or pick from the market.",
|
||||
},
|
||||
{
|
||||
icon: "fal fa-check",
|
||||
header: "Complete Task",
|
||||
paragraph: "Complete the task as specified.",
|
||||
},
|
||||
{
|
||||
icon: "fal fa-check",
|
||||
header: "Reward",
|
||||
paragraph: "Get your reward as specified.",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user