Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 360b84f829 | |||
| c881413b15 | |||
| dcdf3b5816 |
@@ -6752,12 +6752,12 @@ blockquote cite {
|
||||
}
|
||||
|
||||
.appie-about-8-box {
|
||||
padding: 50px 50px 0px 50px;
|
||||
padding: 50px;
|
||||
z-index: 10;
|
||||
}
|
||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
||||
.appie-about-8-box {
|
||||
padding: 50px 25px 0px 25px;
|
||||
padding: 25px;
|
||||
}
|
||||
}
|
||||
@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 |
+32
-30
@@ -1,6 +1,6 @@
|
||||
import React from 'react';
|
||||
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 Image from 'next/image';
|
||||
|
||||
@@ -23,23 +23,24 @@ function AfterHero() {
|
||||
<div className="row">
|
||||
<div className="col-lg-7 mb-3 mb-lg-0">
|
||||
<div className='appie-about-container'>
|
||||
<div className="appie-about-8-box">
|
||||
<h3 className="title">
|
||||
Reward Accomplishments
|
||||
</h3>
|
||||
<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
|
||||
</p>
|
||||
</div>
|
||||
<div className='row'>
|
||||
<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" />
|
||||
</a>
|
||||
<div className='row appie-about-8-box'>
|
||||
<div className="col-12 col-md-6">
|
||||
<h3 className="title">
|
||||
Reward Accomplishments
|
||||
</h3>
|
||||
<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
|
||||
</p>
|
||||
<div className=''>
|
||||
<a className="mb-5 mb-md-0 main-btn" href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
|
||||
Learn More <i className="fal fa-arrow-right" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-12 col-sm-8 order-1 order-sm-2">
|
||||
<div className="col-12 col-md-6">
|
||||
<Image
|
||||
src={cardImg}
|
||||
className='w-100 h-100'
|
||||
width={'100%'}
|
||||
height={'100%'}
|
||||
alt=""
|
||||
@@ -50,24 +51,25 @@ function AfterHero() {
|
||||
</div>
|
||||
<div className="col-lg-5">
|
||||
<div className='appie-about-container'>
|
||||
<div className="appie-about-8-box">
|
||||
<h3 className="title">
|
||||
Assign Faster with <br />
|
||||
wrenchAgent
|
||||
</h3>
|
||||
<p>
|
||||
Ask our ❛❛<span className=''>wrench</span><span className=''>Agent</span>❜❜ Generative AI to assist
|
||||
</p>
|
||||
</div>
|
||||
<div className='row'>
|
||||
<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" />
|
||||
</a>
|
||||
<div className='row appie-about-8-box'>
|
||||
<div className="col-12 col-md-6">
|
||||
<h3 className="title">
|
||||
Assign Faster with <br />
|
||||
wrenchAgent
|
||||
</h3>
|
||||
<p>
|
||||
Ask our ❛❛<span className=''>wrench</span><span className=''>Agent</span>❜❜ Generative AI to assist
|
||||
</p>
|
||||
<div className=''>
|
||||
<a className="mb-5 mb-md-0 main-btn" href={process.env.NEXT_PUBLIC_DASH_URL_LOGIN}>
|
||||
Learn More <i className="fal fa-arrow-right" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-12 col-sm-8 order-1 order-sm-2">
|
||||
<div className="col-12 col-md-6">
|
||||
<Image
|
||||
src={thumb5}
|
||||
className='w-100 h-100'
|
||||
width={'100%'}
|
||||
height={'100%'}
|
||||
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>
|
||||
<ul className='d-flex justify-content-center justify-content-lg-start'>
|
||||
<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>
|
||||
<span>
|
||||
Available on the <span>App Store</span>
|
||||
@@ -42,7 +42,7 @@ function HeroHomeOne() {
|
||||
</a>
|
||||
</li>
|
||||
<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>
|
||||
<span>
|
||||
Available on the <span>Google Play</span>
|
||||
|
||||
@@ -11,6 +11,7 @@ import TrafficHomeTwo from './TrafficHomeTwo';
|
||||
import AfterHero from './AfterHero';
|
||||
import NextAfterHero from './NextAfterHero';
|
||||
import BackToTop from './BackToTop';
|
||||
import SelectFeatures from "@/app/components/SelectFeatutes";
|
||||
|
||||
|
||||
|
||||
@@ -22,8 +23,9 @@ function HomeOne() {
|
||||
<HomeNav />
|
||||
<HeroHomeOne />
|
||||
<AfterHero />
|
||||
<SelectFeatures className='pb-55-err' />
|
||||
<NextAfterHero />
|
||||
<ServicesHomeOne />
|
||||
{/*<ServicesHomeOne />*/}
|
||||
<TrafficHomeOne />
|
||||
<TrafficHomeTwo />
|
||||
<BlogHomeOne />
|
||||
|
||||
@@ -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">
|
||||
<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" /> Settings
|
||||
</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" /> Report
|
||||
</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" /> Saeety Notices
|
||||
</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" /> App Lock
|
||||
</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 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="/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;
|
||||
Reference in New Issue
Block a user