Compare commits

..

7 Commits

12 changed files with 126 additions and 226 deletions
+32 -12
View File
@@ -2319,6 +2319,14 @@ p {
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: auto; background-size: auto;
} }
.appie-service-area.features-section{
/* background: #fff; */
position: relative;
background-position: 92% 100%;
background-repeat: no-repeat;
background-size: auto;
}
.appie-service-area.appie-service-3-area { .appie-service-area.appie-service-3-area {
background: none; background: none;
} }
@@ -2786,26 +2794,38 @@ p {
color: #2b70fa; color: #2b70fa;
margin-bottom: 8px; margin-bottom: 8px;
} }
.appie-features-content {
background: #fff;
border-radius: 6px;
padding: 20px;
transition: all .25s;
}
.appie-features-content:hover {
box-shadow: 0px 40px 40px 0px rgba(14, 17, 51, 0.1);
}
.appie-features-content .title { .appie-features-content .title {
font-size: 44px; font-size: 20px;
line-height: 54px; line-height: 24px;
margin-bottom: 10px; margin-bottom: 10px;
} }
@media only screen and (min-width: 992px) and (max-width: 1200px) { @media only screen and (min-width: 992px) and (max-width: 1200px) {
.appie-features-content .title { .appie-features-content .title {
font-size: 36px; font-size: 18px;
line-height: 44px; line-height: 24px;
} }
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.appie-features-content .title { .appie-features-content .title {
font-size: 30px; font-size: 18px;
line-height: 40px; line-height: 24px;
} }
} }
.appie-features-content p { .appie-features-content p {
font-size: 18px; font-size: 16px;
line-height: 28px; line-height: 20px;
padding-bottom: 30px; padding-bottom: 30px;
} }
@@ -2936,13 +2956,13 @@ p {
@media only screen and (min-width: 768px) and (max-width: 991px) { @media only screen and (min-width: 768px) and (max-width: 991px) {
.appie-features-thumb { .appie-features-thumb {
text-align: center; text-align: center;
margin-top: 50px; margin-top: 10px;
} }
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.appie-features-thumb { .appie-features-thumb {
text-align: center; text-align: center;
margin-top: 50px; margin-top: 10px;
} }
} }
@@ -5760,9 +5780,9 @@ blockquote cite {
} }
.footer-copyright { .footer-copyright {
padding-top: 35px; /* padding-top: 35px; */
border-top: 1px solid #e1e5ec; border-top: 1px solid #e1e5ec;
margin-top: 80px; margin-top: 10px;
} }
@media only screen and (min-width: 768px) and (max-width: 991px) { @media only screen and (min-width: 768px) and (max-width: 991px) {
.footer-copyright { .footer-copyright {
Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 100 KiB

After

Width:  |  Height:  |  Size: 85 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 84 KiB

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 61 KiB

After

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 51 KiB

After

Width:  |  Height:  |  Size: 44 KiB

+92 -212
View File
@@ -9,234 +9,114 @@ import marketPlace from '../../assets/images/market_place.png';
import task from '../../assets/images/task.png'; import task from '../../assets/images/task.png';
import getPaid from '../../assets/images/get_paid.png'; import getPaid from '../../assets/images/get_paid.png';
import shapeSix from '../../assets/images/shape/shape-6.png'; import taskThumbnail from '../../assets/images/task-thumb.png'
import shapeSeven from '../../assets/images/shape/shape-7.png'; import marketThumbnail from '../../assets/images/market-thumb.png'
import shapeEight from '../../assets/images/shape/shape-8.png'; import getPaidThumbnail from '../../assets/images/getpaid-thumb.png'
import accountThumbnail from '../../assets/images/account-thumb.png'
import getConfig from './../../Config/config' import getConfig from './../../Config/config'
function FeaturesHomeOne({ className }) { function FeaturesHomeOne({ className }) {
var site = getConfig()[0]; var site = getConfig()[0];
const [tab, setTab] = useState('setting');
const handleClick = (e, value) => {
e.preventDefault();
setTab(value);
};
return ( return (
<section className={`appie-features-area pt-100 pb-90 ${className}`} id="features"> <section className={`appie-service-area features-section pt-50 pb-100 ${className}`} id="service">
<div className="container"> <div className="container">
<div className="row align-items-center"> <div className="row">
<div className="col-lg-3"> <div className="col-xl-3 col-md-6 mb-50">
<div className="appie-features-tabs-btn"> <div
<div className="appie-features-content wow animated fadeInRight"
className="nav flex-column nav-pills" data-wow-duration="2000ms"
id="v-pills-tab" data-wow-delay="600ms"
role="tablist" >
aria-orientation="vertical" <div className='text-center'>
> <img className='pb-2' src={accountThumbnail} alt='image thumbnail' />
<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-user" /> Free Account
</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-search-dollar" /> Marketplace
</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-check" /> Complete Task
</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-comments-dollar" /> Get Paid
</a>
</div> </div>
<h3 className="title">
Create free account.
</h3>
<p>
If you are either currently employed, unemployed or unsatisfied with your job or want extra cash on the side, consider WrenchBoard as a reliable partner to connect you with new opportunities.
</p>
<Link className="main-btn" to="/about-us">
Learn More
</Link>
{/* <div
className="appie-features-thumb text-center wow animated fadeInUp"
data-wow-duration="2000ms"
data-wow-delay="200ms"
>
<img className='p-3' src={freeAccount} alt="" />
</div> */}
</div> </div>
</div> </div>
<div className="col-lg-9"> <div className="col-xl-3 col-md-6 mb-50">
<div className="tab-content" id="v-pills-tabContent"> <div
<div className="appie-features-content animated fadeInRight"
className={`${ data-wow-duration="2000ms"
tab === 'setting' ? 'show active' : '' data-wow-delay="600ms"
} tab-pane fade`} >
id="v-pills-home" <div className='text-center'>
role="tabpanel" <img className='pb-2' src={marketThumbnail} alt='image thumbnail' />
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"
>
<img src={freeAccount} alt="" />
</div>
</div>
<div className="col-lg-6">
<div
className="appie-features-content wow animated fadeInRight"
data-wow-duration="2000ms"
data-wow-delay="600ms"
>
<h3 className="title">
Create free account.
</h3>
<p>
If you are either currently employed, unemployed or unsatisfied with your job or want extra cash on the side, consider WrenchBoard as a reliable partner to connect you with new opportunities.
</p>
<Link className="main-btn" to="/about-us">
Learn More
</Link>
</div>
</div>
</div>
</div> </div>
<div
className={`${tab === 'report' ? 'show active' : ''} tab-pane fade`} <h3 className="title">
id="v-pills-profile" Browse Marketplace
role="tabpanel" </h3>
aria-labelledby="v-pills-profile-tab" <p>
> WrenchBoard platform connects you with quality service that need articles writing, blog management, photography, product testing research and surveys and more to deliver your project with ease.
<div className="row align-items-center"> </p>
<div className="col-lg-6"> <a className="main-btn" href={site.dash_url_login}>
<div Learn More
className="appie-features-thumb text-center animated fadeInUp" </a>
data-wow-duration="2000ms" </div>
data-wow-delay="200ms" </div>
> <div className="col-xl-3 col-md-6 mb-50">
<img src={marketPlace} alt="" /> <div
</div> className="appie-features-content animated fadeInRight"
</div> data-wow-duration="2000ms"
<div className="col-lg-6"> data-wow-delay="600ms"
<div >
className="appie-features-content animated fadeInRight" <div className='text-center'>
data-wow-duration="2000ms" <img className='pb-2' src={taskThumbnail} alt='image thumbnail' />
data-wow-delay="600ms"
>
<h3 className="title">
Browse Marketplace
</h3>
<p>
WrenchBoard platform connects you with quality service that need articles writing, blog management, photography, product testing research and surveys and more to deliver your project with ease.
</p>
<a className="main-btn" href={site.dash_url_login}>
Learn More
</a>
</div>
</div>
</div>
</div> </div>
<div
className={`${tab === 'notice' ? 'show active' : ''} tab-pane fade`} <h3 className="title">
id="v-pills-messages" Complete Task
role="tabpanel" </h3>
aria-labelledby="v-pills-messages-tab" <p>
> Cash in the Pocket with WrenchBoard as a reliable partner to connect you with new opportunities.Track, Organize your Portfolio and Manage your Skills, preferred workgroup and teams efficiently.
<div className="row align-items-center"> </p>
<div className="col-lg-6"> <a className="main-btn" href={site.dash_url_login}>
<div Learn More
className="appie-features-thumb text-center animated fadeInUp" </a>
data-wow-duration="2000ms" </div>
data-wow-delay="200ms" </div>
> <div className="col-xl-3 col-md-6 mb-50">
<img src={task} alt="" /> <div
</div> className="appie-features-content animated fadeInRight"
</div> data-wow-duration="2000ms"
<div className="col-lg-6"> data-wow-delay="600ms"
<div >
className="appie-features-content animated fadeInRight" <div className='text-center'>
data-wow-duration="2000ms" <img className='pb-2' src={getPaidThumbnail} alt='image thumbnail' />
data-wow-delay="600ms"
>
<h3 className="title">
Complete Task
</h3>
<p>
Cash in the Pocket with WrenchBoard as a reliable partner to connect you with new opportunities.Track, Organize your Portfolio and Manage your Skills, preferred workgroup and teams efficiently.
</p>
<a className="main-btn" href={site.dash_url_login}>
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"
>
<img src={getPaid} alt="" />
</div>
</div>
<div className="col-lg-6">
<div
className="appie-features-content animated fadeInRight"
data-wow-duration="2000ms"
data-wow-delay="600ms"
>
<h3 className="title">
Get Paid
</h3>
<p>
Get paid Instantly for completed task using WrenchBoard. Achieve your short-term goals or long-term income by Connecting with WrenchBoard. Complete access to your earnings.
</p>
<a className="main-btn" href={site.dash_url_login}>
Learn More
</a>
</div>
</div>
</div>
</div> </div>
<h3 className="title">
Get Paid
</h3>
<p>
Get paid Instantly for completed task using WrenchBoard. Achieve your short-term goals or long-term income by Connecting with WrenchBoard. Complete access to your earnings.
</p>
<a className="main-btn" href={site.dash_url_login}>
Learn More
</a>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
{/* <hr className='mt-50'/> */}
</section> </section>
); );
} }
+1 -1
View File
@@ -107,7 +107,7 @@ function FooterHomeOne({ className }) {
</div> </div>
<div className="row"> <div className="row">
<div className="col-lg-12"> <div className="col-lg-12">
<div className="footer-copyright d-flex align-items-center justify-content-between pt-35"> <div className="footer-copyright d-flex align-items-center justify-content-between pt-2">
<div className="apps-download-btn"> <div className="apps-download-btn">
<ul> <ul>
<li> <li>
+1 -1
View File
@@ -9,7 +9,7 @@ import IconFour from '../../assets/images/icon/walleticon.png';
function ServicesHomeOne({ className }) { function ServicesHomeOne({ className }) {
return ( return (
<section className={`appie-service-area pt-90 pb-100 ${className}`} id="service"> <section className={`appie-service-area pt-90 pb-50 ${className}`} 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">