clean up
This commit is contained in:
@@ -113,6 +113,23 @@ p {
|
||||
color: #505056;
|
||||
margin: 0px;
|
||||
}
|
||||
.designed-title {
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 10px;
|
||||
margin-top: 30px;
|
||||
padding-bottom: 7px;
|
||||
text-align: center;
|
||||
text-shadow: 3px 4px 10px rgba(0,0,0,.3);
|
||||
}
|
||||
|
||||
.designed-description {
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
font-weight: 400;
|
||||
color: #505056;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bg_cover {
|
||||
background-position: center center;
|
||||
@@ -3025,6 +3042,38 @@ p {
|
||||
color: #9b2cfa;
|
||||
}
|
||||
|
||||
/*===========================
|
||||
6.On WrenchBoard Area css
|
||||
===========================*/
|
||||
.wrench-on-area {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
z-index: 15;
|
||||
/* background-color: #fbf4fe; */
|
||||
}
|
||||
/* .wrench-on-area .traffic-thumb {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 42%;
|
||||
} */
|
||||
/* @media (max-width: 767px) {
|
||||
.wrench-on-area .traffic-thumb {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
||||
.wrench-on-area .traffic-thumb {
|
||||
display: none;
|
||||
}
|
||||
} */
|
||||
|
||||
.withFadeEdge{
|
||||
border-radius: 10px 10px 10px 10px;
|
||||
/* box-shadow: inset 0 0 15px 25px white; */
|
||||
box-shadow: 0 0 10px 20px #fff inset;
|
||||
}
|
||||
/*===========================
|
||||
6.APPIE TRAFFICE css
|
||||
===========================*/
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 114 KiB |
@@ -0,0 +1,96 @@
|
||||
import React from "react";
|
||||
|
||||
import Design from "../../assets/images/design.png";
|
||||
import Approach from "../../assets/images/approach.png";
|
||||
import Interactive from "../../assets/images/interactive.png";
|
||||
import Mobility from "../../assets/images/mobility-approach.png";
|
||||
import Privacy from "../../assets/images/privacy.png";
|
||||
import Seamless from "../../assets/images/seamless.png";
|
||||
|
||||
function ServiceItem(props) {
|
||||
return (
|
||||
<div
|
||||
className={`appie-single-service-2 appie-single-service-about item-${props.index} mt-30 wow animated fadeInUp`}
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay={`${props.delay}ms`}
|
||||
style={{ cursor: "default" }}
|
||||
>
|
||||
<div className="icon d-flex justify-content-center align-items-center">
|
||||
<img src={props.image} />
|
||||
</div>
|
||||
<h4 className="title">{props.title}</h4>
|
||||
<p>{props.description}</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function AboutTextComponent() {
|
||||
return (
|
||||
<>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="row">
|
||||
{servicesContent?.map(({ id, ...item }) => (
|
||||
<div className="col-lg-4 col-md-6">
|
||||
<ServiceItem index={id} {...item} />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default AboutTextComponent;
|
||||
|
||||
const servicesContent = [
|
||||
{
|
||||
id: 1,
|
||||
image: Design,
|
||||
delay: 200,
|
||||
title: "Carefully designed",
|
||||
description:
|
||||
"WrenchBoard focuses on your needs and desires. Your success is our priority, driving us to listen and adapt to your feedback. We're dedicated to enhancing our products for your convenience. It's all about you, not us.",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: Approach,
|
||||
delay: 400,
|
||||
title: "Modern Approach",
|
||||
description:
|
||||
"Our commitment is delivering a top-tier solution for you. Our aim: an intuitive, user-friendly product that continually evolves. By focusing on you, we'll surpass expectations and make a real impact.",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: Interactive,
|
||||
delay: 600,
|
||||
title: "User Interactive",
|
||||
description:
|
||||
"WrenchBoard keeps you engaged with diverse features. Email alerts guarantee you're always in the loop. Get updates your way: email, text, or push notifications . We've got you covered.",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
image: Mobility,
|
||||
delay: 200,
|
||||
title: "Mobility Approach",
|
||||
description:
|
||||
"WrenchBoard's tools unite devices for seamless organization and productivity anywhere. Manage tasks, track responses, and stay connected effortlessly. Experience a true mobile lifestyle with WrenchBoard!",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
image: Seamless,
|
||||
delay: 400,
|
||||
title: "Seamless Sync",
|
||||
description:
|
||||
"WrenchBoard simplifies cross-platform activity management. Our features sync seamlessly on desktop, tablet, and phone, ensuring organization and productivity. No more app hopping . WrenchBoard streamlines the process.",
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
image: Privacy,
|
||||
delay: 600,
|
||||
title: "Privacy",
|
||||
description:
|
||||
"Your privacy matters. WrenchBoard works without data sharing, ensuring your information stays secure. Manage tasks across platforms confidently, enjoying a unified experience that respects your privacy.",
|
||||
},
|
||||
];
|
||||
@@ -17,8 +17,7 @@ function HeroAbout() {
|
||||
<div className="col-12">
|
||||
<div className="appie-about-page-content">
|
||||
<h3 className="title">
|
||||
Empower Young Talent to Earn and Learn Financial
|
||||
Literacy
|
||||
We Empower Reward for Achievements
|
||||
</h3>
|
||||
<p>
|
||||
WrenchBoard prioritizes safety above all. Parents can
|
||||
|
||||
@@ -1,28 +1,5 @@
|
||||
import React from "react";
|
||||
|
||||
import Design from "../../assets/images/design.png";
|
||||
import Approach from "../../assets/images/approach.png";
|
||||
import Interactive from "../../assets/images/interactive.png";
|
||||
import Mobility from "../../assets/images/mobility-approach.png";
|
||||
import Privacy from "../../assets/images/privacy.png";
|
||||
import Seamless from "../../assets/images/seamless.png";
|
||||
|
||||
function ServiceItem(props) {
|
||||
return (
|
||||
<div
|
||||
className={`appie-single-service-2 appie-single-service-about item-${props.index} mt-30 wow animated fadeInUp`}
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay={`${props.delay}ms`}
|
||||
style={{ cursor: "default" }}
|
||||
>
|
||||
<div className="icon d-flex justify-content-center align-items-center">
|
||||
<img src={props.image} />
|
||||
</div>
|
||||
<h4 className="title">{props.title}</h4>
|
||||
<p>{props.description}</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
import React from 'react';
|
||||
import AboutTextComponent from '../AboutText/AboutText';
|
||||
|
||||
function ServicesAbout() {
|
||||
return (
|
||||
@@ -32,18 +9,11 @@ function ServicesAbout() {
|
||||
<div className="row align-items-end">
|
||||
<div className="col-12 col-lg-8">
|
||||
<div className="appie-section-title">
|
||||
<h3 className="appie-title">{servicesContent.heading}</h3>
|
||||
<p>{servicesContent.subTitle}</p>
|
||||
<h3 className="appie-title">We’re driven by your values</h3>
|
||||
{/* <p>{servicesContent.subTitle}</p> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
{servicesContent.list?.map(({ id, ...item }) => (
|
||||
<div className="col-lg-4 col-md-6">
|
||||
<ServiceItem index={id} {...item} />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
@@ -51,58 +21,3 @@ function ServicesAbout() {
|
||||
}
|
||||
|
||||
export default ServicesAbout;
|
||||
|
||||
const servicesContent = {
|
||||
heading: "We’re driven by your values",
|
||||
subTitle: "The app provides design and digital marketing.",
|
||||
list: [
|
||||
{
|
||||
id: 1,
|
||||
image: Design,
|
||||
delay: 200,
|
||||
title: "Carefully designed",
|
||||
description:
|
||||
"WrenchBoard focuses on your needs and desires. Your success is our priority, driving us to listen and adapt to your feedback. We're dedicated to enhancing our products for your convenience. It's all about you, not us.",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: Approach,
|
||||
delay: 400,
|
||||
title: "Modern Approach",
|
||||
description:
|
||||
"Our commitment is delivering a top-tier solution for you. Our aim: an intuitive, user-friendly product that continually evolves. By focusing on you, we'll surpass expectations and make a real impact.",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: Interactive,
|
||||
delay: 600,
|
||||
title: "User Interactive",
|
||||
description:
|
||||
"WrenchBoard keeps you engaged with diverse features. Email alerts guarantee you're always in the loop. Get updates your way: email, text, or push notifications . We've got you covered.",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
image: Mobility,
|
||||
delay: 200,
|
||||
title: "Mobility Approach",
|
||||
description:
|
||||
"WrenchBoard's tools unite devices for seamless organization and productivity anywhere. Manage tasks, track responses, and stay connected effortlessly. Experience a true mobile lifestyle with WrenchBoard!",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
image: Seamless,
|
||||
delay: 400,
|
||||
title: "Seamless Sync",
|
||||
description:
|
||||
"WrenchBoard simplifies cross-platform activity management. Our features sync seamlessly on desktop, tablet, and phone, ensuring organization and productivity. No more app hopping . WrenchBoard streamlines the process.",
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
image: Privacy,
|
||||
delay: 600,
|
||||
title: "Privacy",
|
||||
description:
|
||||
"Your privacy matters. WrenchBoard works without data sharing, ensuring your information stays secure. Manage tasks across platforms confidently, enjoying a unified experience that respects your privacy.",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
@@ -10,6 +10,7 @@ import HeroAbout from './HeroAbout';
|
||||
import ServicesAbout from './ServicesAbout';
|
||||
import TeamAbout from './TeamAbout';
|
||||
import StickyHeaderNav from '../StickyHeader/StickyHeaderNav';
|
||||
import AboutTextComponent from '../AboutText/AboutText';
|
||||
|
||||
function AboutUs() {
|
||||
const [drawer, drawerAction] = useToggle(false);
|
||||
@@ -23,6 +24,7 @@ function AboutUs() {
|
||||
{/* <TeamAbout />*/}
|
||||
{/* <SponserHomeTwo />
|
||||
<SignupHomeEight />*/}
|
||||
<AboutTextComponent/>
|
||||
<FooterHomeOne className="appie-footer-about-area" />
|
||||
<BackToTop />
|
||||
</>
|
||||
|
||||
@@ -20,7 +20,7 @@ function FooterHomeOne({ className }) {
|
||||
</a>
|
||||
</div>
|
||||
<p>
|
||||
{`It is simple. You can do something that somebody is ready to pay you for. WrenchBoard is the platform to connect you with earning opportunities. `}
|
||||
{`It is simple. You can set goals, task, or anything that need to be done and reward accomplishment. WrenchBoard is the platform to connect opportunities. `}
|
||||
</p>
|
||||
<a href="/service">
|
||||
Read More <i className="fal fa-arrow-right" />
|
||||
|
||||
@@ -22,7 +22,7 @@ function ServiceItem({ icon, title, description, index }) {
|
||||
}
|
||||
|
||||
function ServicesHomeOne({ className }) {
|
||||
const serviceTitle = "";
|
||||
const serviceTitle = "Set Goals and Rewards to Inspire";
|
||||
const serviceItems = [
|
||||
{
|
||||
icon: IconOne,
|
||||
@@ -49,10 +49,7 @@ function ServicesHomeOne({ className }) {
|
||||
];
|
||||
|
||||
return (
|
||||
<section
|
||||
className={`appie-service-area pt-90 pb-50 ${className}`}
|
||||
id="service"
|
||||
>
|
||||
<section className={`appie-service-area pt-10 pb-50 ${className}`} id="service">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-lg-8">
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
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 thumb from '../../assets/images/PerformingTask2.jpg';
|
||||
import getConfig from './../../Config/config'
|
||||
|
||||
function TrafficHomeOne() {
|
||||
var site = getConfig()[0];
|
||||
return (
|
||||
<section className="appie-traffic-area pt-140 pb-180">
|
||||
<section className="wrench-on-area pt-140 pb-180">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-7">
|
||||
@@ -39,17 +40,30 @@ function TrafficHomeOne() {
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className="traffic-thumb d-none d-lg-flex col-lg-5 justify-content-center align-items-center">
|
||||
<div className='position-relative d-flex'>
|
||||
<div className='withFadeEdge position-absolute bg-transparent w-100 h-100' style={{zIndex: '1'}}></div>
|
||||
<img
|
||||
className="position-relative wow animated fadeInRight p-1"
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay="200ms"
|
||||
src={thumb}
|
||||
alt=""
|
||||
style={{zIndex: '0'}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="traffic-thumb ">
|
||||
{/* <div className="traffic-thumb">
|
||||
<img
|
||||
className="wow animated fadeInRight"
|
||||
className="withFadeEdge wow animated fadeInRight"
|
||||
data-wow-duration="2000ms"
|
||||
data-wow-delay="200ms"
|
||||
src={thumb}
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</div> */}
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user