Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 victorAnumudu
|
8a4c7d92e8 | ||
|
victorAnumudu
|
0c4e464c5e | ||
|
CHIEFSOFT\ameye
|
3586b01756 | ||
 ameye
|
715972dbde | ||
|
Ebube
|
9cc252b2cd | ||
|
ameye
|
a1b56a0b81 | ||
|
Ebube
|
87ea20bde8 | ||
|
Ebube
|
0ebbc26104 | ||
|
CHIEFSOFT\ameye
|
e323168927 | ||
|
ameye
|
2224472046 |
@@ -18,6 +18,8 @@
|
|||||||
.env.test.local
|
.env.test.local
|
||||||
.env.production.local
|
.env.production.local
|
||||||
|
|
||||||
|
.idea
|
||||||
|
|
||||||
|
|
||||||
npm-debug.log*
|
npm-debug.log*
|
||||||
yarn-debug.log*
|
yarn-debug.log*
|
||||||
|
|||||||
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
+33
-23
@@ -49,6 +49,16 @@
|
|||||||
</noscript>
|
</noscript>
|
||||||
|
|
||||||
<title>WrenchBoard</title>
|
<title>WrenchBoard</title>
|
||||||
|
<!-- Google tag (gtag.js) -->
|
||||||
|
<script async src="https://www.googletagmanager.com/gtag/js?id=G-WB8G0ZD483"></script>
|
||||||
|
<script>
|
||||||
|
window.dataLayer = window.dataLayer || [];
|
||||||
|
function gtag(){dataLayer.push(arguments);}
|
||||||
|
gtag('js', new Date());
|
||||||
|
|
||||||
|
gtag('config', 'G-WB8G0ZD483');
|
||||||
|
</script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
@@ -56,29 +66,29 @@
|
|||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
<script>
|
<!-- <script>-->
|
||||||
(function (i, s, o, g, r, a, m) {
|
<!-- (function (i, s, o, g, r, a, m) {-->
|
||||||
i["GoogleAnalyticsObject"] = r;
|
<!-- i["GoogleAnalyticsObject"] = r;-->
|
||||||
(i[r] =
|
<!-- (i[r] =-->
|
||||||
i[r] ||
|
<!-- i[r] ||-->
|
||||||
function () {
|
<!-- function () {-->
|
||||||
(i[r].q = i[r].q || []).push(arguments);
|
<!-- (i[r].q = i[r].q || []).push(arguments);-->
|
||||||
}),
|
<!-- }),-->
|
||||||
(i[r].l = 1 * new Date());
|
<!-- (i[r].l = 1 * new Date());-->
|
||||||
(a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);
|
<!-- (a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);-->
|
||||||
a.async = 1;
|
<!-- a.async = 1;-->
|
||||||
a.src = g;
|
<!-- a.src = g;-->
|
||||||
m.parentNode.insertBefore(a, m);
|
<!-- m.parentNode.insertBefore(a, m);-->
|
||||||
})(
|
<!-- })(-->
|
||||||
window,
|
<!-- window,-->
|
||||||
document,
|
<!-- document,-->
|
||||||
"script",
|
<!-- "script",-->
|
||||||
"https://www.google-analytics.com/analytics.js",
|
<!-- "https://www.google-analytics.com/analytics.js",-->
|
||||||
"ga"
|
<!-- "ga"-->
|
||||||
);
|
<!-- );-->
|
||||||
ga("create", "UA-54829827-4", "auto");
|
<!-- ga("create", "UA-54829827-4", "auto");-->
|
||||||
ga("send", "pageview");
|
<!-- ga("send", "pageview");-->
|
||||||
</script>
|
<!-- </script>-->
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
var LHC_API = LHC_API || {};
|
var LHC_API = LHC_API || {};
|
||||||
|
|||||||
@@ -3227,6 +3227,54 @@ p {
|
|||||||
background: linear-gradient(135deg, #d8aaff 0%, #9b2cfa 100%);
|
background: linear-gradient(135deg, #d8aaff 0%, #9b2cfa 100%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.modern_ui_section{
|
||||||
|
margin-top: 100px;
|
||||||
|
}
|
||||||
|
.appie-modern-design .icon i {
|
||||||
|
height: 26px;
|
||||||
|
width: 26px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 26px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: purple;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 14px;
|
||||||
|
box-shadow: 0px 6px 10px 0px rgba(16, 73, 189, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modern_ui_section .ui_images{
|
||||||
|
border-radius: 100%;
|
||||||
|
background-color: #fff;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
padding: 30px 0;
|
||||||
|
}
|
||||||
|
.modern_ui_section .right_img{
|
||||||
|
left: -60px;
|
||||||
|
top: -20px;
|
||||||
|
}
|
||||||
|
.modern_ui_section .left_img{
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
|
.modern_ui_section .right_img{
|
||||||
|
width: 40%;
|
||||||
|
}
|
||||||
|
.modern_ui_section .right_img .right_img_one{
|
||||||
|
width: 120px;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
.modern_ui_section .right_img .right_img_two{
|
||||||
|
margin-top: -20px !important;
|
||||||
|
}
|
||||||
|
.modern_ui_section .right_img .right_img_three{
|
||||||
|
left: -20px;
|
||||||
|
}
|
||||||
|
@media only screen and (min-width: 0px) and (max-width: 500px) {
|
||||||
|
.modern_ui_section .right_img{
|
||||||
|
left: -30px;
|
||||||
|
top: -20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
||||||
.traffic-btn {
|
.traffic-btn {
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
@@ -4894,6 +4942,28 @@ p {
|
|||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.service-item{
|
||||||
|
background: transparent;
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 30px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-item .icon {
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
border-radius: 20px;
|
||||||
|
height: 80px;
|
||||||
|
line-height: 70px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
position: relative;
|
||||||
|
width: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-item h4 {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
.tags a {
|
.tags a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
height: 34px;
|
height: 34px;
|
||||||
|
|||||||
Binary file not shown.
|
After Width: | Height: | Size: 163 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 151 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 151 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 113 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 123 KiB |
@@ -19,12 +19,12 @@ function Blog({ blogItem, imgUrl, loader }) {
|
|||||||
|
|
||||||
const headerLoaderStyles = {
|
const headerLoaderStyles = {
|
||||||
"--text-container-width": "300px",
|
"--text-container-width": "300px",
|
||||||
"--text-container-height": "34px",
|
"--text-container-height": "18px",
|
||||||
};
|
};
|
||||||
|
|
||||||
const bodyTextLoaderStyles = {
|
const bodyTextLoaderStyles = {
|
||||||
"--text-container-width": "770px",
|
"--text-container-width": "770px",
|
||||||
"--text-container-height": "150px",
|
"--text-container-height": "15px",
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -1,13 +1,14 @@
|
|||||||
import React from "react";
|
import React from 'react';
|
||||||
import IconOne from "../../assets/images/icon/account_login.png";
|
import IconOne from '../../assets/images/icon/reward.png';
|
||||||
import IconTwo from "../../assets/images/icon/task.png";
|
import IconTwo from '../../assets/images/icon/assign-chores.png';
|
||||||
import IconThree from "../../assets/images/icon/target.png";
|
import IconThree from '../../assets/images/icon/financial-education.png';
|
||||||
import IconFour from "../../assets/images/icon/reward.png";
|
import IconFour from '../../assets/images/icon/family-connect.png';
|
||||||
|
import Main from '../lnd/LndParts/Design/Main';
|
||||||
|
|
||||||
function ServiceItem({ icon, title, description, index }) {
|
function ServiceItem({ icon, title, description, index }) {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="appie-single-service text-center mt-30 wow animated fadeInUp"
|
className="service-item text-center mt-30 wow animated fadeInUp"
|
||||||
data-wow-duration="2000ms"
|
data-wow-duration="2000ms"
|
||||||
data-wow-delay={`${200 * (index + 1)}ms`}
|
data-wow-delay={`${200 * (index + 1)}ms`}
|
||||||
style={{ cursor: "default" }}
|
style={{ cursor: "default" }}
|
||||||
@@ -22,40 +23,19 @@ function ServiceItem({ icon, title, description, index }) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function ServicesHomeOne({ className }) {
|
function ServicesHomeOne({ className }) {
|
||||||
const serviceTitle = "Set Goals and Rewards to Inspire";
|
|
||||||
const serviceItems = [
|
|
||||||
{
|
|
||||||
icon: IconOne,
|
|
||||||
title: "Free Account",
|
|
||||||
description: "Join WrenchBoard. Get your free account.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: IconTwo,
|
|
||||||
title: "Set Goals",
|
|
||||||
description: "Suggest or find what you want to get rewarded for.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: IconThree,
|
|
||||||
title: "Complete",
|
|
||||||
description: "Complete task, and notify assigner with ease.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: IconFour,
|
|
||||||
title: "Reward",
|
|
||||||
description: "Task completed. Find your reward.",
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section
|
<section
|
||||||
className={`appie-service-area pt-10 pb-50 ${className}`}
|
className={`appie-service-area pt-20 pb-50 ${className}`}
|
||||||
id="service"
|
id="service"
|
||||||
>
|
>
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<div className="row justify-content-center">
|
<div className="row justify-content-center">
|
||||||
<div className="col-lg-8">
|
<div className="col-lg-8">
|
||||||
<div className="appie-section-title text-center">
|
<div className="appie-section-title text-center">
|
||||||
<h3 className="appie-title">{serviceTitle}</h3>
|
<h3 className="appie-title">
|
||||||
|
Set Chores, Set Goals and <br /> Rewards Accomplishments
|
||||||
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -72,8 +52,34 @@ function ServicesHomeOne({ className }) {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<Main />
|
||||||
</section>
|
</section>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export default ServicesHomeOne;
|
export default ServicesHomeOne;
|
||||||
|
|
||||||
|
const serviceTitle = `Set Chores, Set Goals and Rewards Accomplishments`;
|
||||||
|
const serviceItems = [
|
||||||
|
{
|
||||||
|
icon: IconOne,
|
||||||
|
title: 'Reward Goals Met',
|
||||||
|
description: 'Set goals together and reward accomplishment',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconTwo,
|
||||||
|
title: 'Assign Regular Chores',
|
||||||
|
description: 'Organize essential regular chores to be done',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconThree,
|
||||||
|
title: 'Financial Education',
|
||||||
|
description: 'Get Kids start early on money management',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconFour,
|
||||||
|
title: 'Family Connect',
|
||||||
|
description: 'Connect family, share accomplishments with friends',
|
||||||
|
},
|
||||||
|
];
|
||||||
@@ -9,9 +9,9 @@ function Navigation() {
|
|||||||
<Link to="/">Home</Link>
|
<Link to="/">Home</Link>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<Link to="/service">Services</Link>
|
<Link to="/about-us">About</Link>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
{/* <li>
|
||||||
<a href="#">
|
<a href="#">
|
||||||
Resources <i className="fal fa-angle-down" />
|
Resources <i className="fal fa-angle-down" />
|
||||||
</a>
|
</a>
|
||||||
@@ -26,8 +26,7 @@ function Navigation() {
|
|||||||
<Link to="/faq">FAQs</Link>
|
<Link to="/faq">FAQs</Link>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li> */}
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -10,45 +10,68 @@ const Main = ({gredient}) => {
|
|||||||
<>
|
<>
|
||||||
<section className={`row_am modern_ui_section ${gredient && "gredient-bg"}`} >
|
<section className={`row_am modern_ui_section ${gredient && "gredient-bg"}`} >
|
||||||
{gredient &&
|
{gredient &&
|
||||||
<div className="modernui_section_bg modernui-gredient"> <img src="assets/images/section-bg.png" alt="image"/> </div>}
|
<div className="modernui_section_bg modernui-gredient">
|
||||||
|
<img src="assets/images/section-bg.png" alt="image"/>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<div className="row">
|
<div className="row align-items-center">
|
||||||
<div className="col-lg-6">
|
<div className="col-lg-6">
|
||||||
<div className="ui_text">
|
<div className="ui_text w-100">
|
||||||
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100">
|
<div className="appie-traffic-title section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100" style={{padding: '0'}}>
|
||||||
<h2>Beautiful design with <span>modern UI</span></h2>
|
<h3 className='title'>Beautiful design with <div style={{color:'purple'}}>modern UI</div></h3>
|
||||||
<p>
|
<p className=''>
|
||||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry lorem Ipsum has been the
|
Lorem Ipsum is simply dummy text of the printing and typesetting industry lorem Ipsum has been the
|
||||||
industrys standard dummy text ever since the when an unknown printer took a galley of type and.
|
industrys standard dummy text ever since the when an unknown printer took a galley of type and.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<ul className="design_block">
|
{/* <ul className="design_block">
|
||||||
<li data-aos="fade-up" data-aos-duration="1500">
|
<li data-aos="fade-up" data-aos-duration="1500">
|
||||||
<h4>Carefully designed</h4>
|
<h4>Carefully designed</h4>
|
||||||
<p>Lorem Ipsum is simply dummy text of the printing and type esetting industry lorem Ipsum has.</p>
|
<p>Lorem Ipsum is simply dummy text of the printing and type esetting industry lorem Ipsum has.</p>
|
||||||
</li>
|
</li>
|
||||||
<li data-aos="fade-up" data-aos-duration="1500">
|
<li data-aos="fade-up" data-aos-duration="1500">
|
||||||
<h4>Seamless Sync</h4>
|
<h4>Seamless Sync</h4>
|
||||||
<p>Simply dummy text of the printing and typesetting inustry lorem Ipsum has Lorem dollar summit.</p>
|
<p>Simply dummy text of the printing and typesetting inustry lorem Ipsum has Lorem dollar summit.</p>
|
||||||
</li>
|
</li>
|
||||||
<li data-aos="fade-up" data-aos-duration="1500">
|
<li data-aos="fade-up" data-aos-duration="1500">
|
||||||
<h4>Access Drive</h4>
|
<h4>Access Drive</h4>
|
||||||
<p>Printing and typesetting industry lorem Ipsum has been the industrys standard dummy text of type
|
<p>Printing and typesetting industry lorem Ipsum has been the industrys standard dummy text of type
|
||||||
setting.</p>
|
setting.</p>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul> */}
|
||||||
|
<div className="row">
|
||||||
|
{list?.map(({ icon, header, paragraph }, idx) => (
|
||||||
|
<div className="col-12" key={idx}>
|
||||||
|
<div
|
||||||
|
className={`appie-traffic-service features appie-modern-design mb-30`}
|
||||||
|
style={{ paddingRight: "45px" }}
|
||||||
|
>
|
||||||
|
<div className="icon">
|
||||||
|
<i className={icon} />
|
||||||
|
</div>
|
||||||
|
<h5 className="title">{header}</h5>
|
||||||
|
<p>{paragraph}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-lg-6">
|
<div className="col-lg-6">
|
||||||
<div className="ui_images" data-aos="fade-in" data-aos-duration="1500">
|
<div className='w-100 ui_image_con d-flex justify-content-center align-items-center'>
|
||||||
<div className="left_img">
|
<div className="ui_images position-relative d-flex justify-content-center align-items-center" data-aos="fade-in" data-aos-duration="1500">
|
||||||
<img className="moving_position_animatin" src={img1} alt="image" />
|
<div className="left_img">
|
||||||
</div>
|
<img className="moving_position_animatin" src={img1} alt="image" />
|
||||||
<div className="right_img">
|
</div>
|
||||||
<img className="moving_position_animatin" src={img2} alt="image" />
|
<div className="right_img position-relative d-flex flex-column justify-content-start align-items-center">
|
||||||
<img className="moving_position_animatin" src={img3} alt="image" />
|
<div className='d-flex flex-column justify-content-start align-items-center'>
|
||||||
<img className="moving_position_animatin" src={img4} alt="image" />
|
<img className="moving_position_animatin right_img_one" src={img2} alt="image" />
|
||||||
</div>
|
<img className="moving_position_animatin right_img_two" src={img3} alt="image" />
|
||||||
|
</div>
|
||||||
|
<img className="moving_position_animatin right_img_three position-relative" src={img4} alt="image" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -58,4 +81,24 @@ const Main = ({gredient}) => {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
export default Main
|
export default Main
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const list = [
|
||||||
|
{
|
||||||
|
icon: "fal fa-check",
|
||||||
|
header: "Carefully designed",
|
||||||
|
paragraph: "Get family access from parents, or create your free account.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "fal fa-check",
|
||||||
|
header: "Seamless Sync",
|
||||||
|
paragraph: "Simply dummy text of the printing and typesetting inustry lorem Ipsum has Lorem dollar summit.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "fal fa-check",
|
||||||
|
header: "Access Drive",
|
||||||
|
paragraph: "Printing and typesetting industry lorem Ipsum has been the industrys standard dummy text of typesetting.",
|
||||||
|
},
|
||||||
|
]
|
||||||
Reference in New Issue
Block a user