Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 07db62278f | |||
| deda7c4c74 | |||
| e2eea47196 | |||
| c2eda57bf3 | |||
| 528034296e | |||
| 96d18db2c3 |
Binary file not shown.
|
Before Width: | Height: | Size: 57 KiB After Width: | Height: | Size: 39 KiB |
@@ -882,6 +882,9 @@ a {
|
||||
.pl-125 {
|
||||
padding-left: 125px;
|
||||
}
|
||||
.pl-150 {
|
||||
padding-left: 150px;
|
||||
}
|
||||
/*-- Padding right --*/
|
||||
|
||||
.pr-0 {
|
||||
|
||||
@@ -183,6 +183,16 @@ p {
|
||||
letter-spacing: 2px;
|
||||
text-shadow: 0px 4px 10px rgba(0,0,0,0.3);
|
||||
}
|
||||
.generative-ai{
|
||||
padding-left: 150px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 568px) {
|
||||
.generative-ai{
|
||||
padding-left: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
||||
.appie-section-title .appie-title {
|
||||
font-size: 36px;
|
||||
@@ -3100,6 +3110,11 @@ p {
|
||||
/* box-shadow: inset 0 0 15px 25px white; */
|
||||
box-shadow: 0 0 10px 20px #fff inset;
|
||||
}
|
||||
.withFadeEdge-light-purple{
|
||||
border-radius: 10px 10px 10px 10px;
|
||||
/* box-shadow: inset 0 0 15px 25px white; */
|
||||
box-shadow: 0 0 5px 10px #fbf4fe inset;
|
||||
}
|
||||
/*===========================
|
||||
6.APPIE TRAFFICE css
|
||||
===========================*/
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 52 KiB |
@@ -28,7 +28,7 @@ const Main = ({gredient}) => {
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
<div className="w-100">
|
||||
<div className="appie-traffic-title section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100" style={{padding: '0'}}>
|
||||
<div className="p-0 appie-traffic-title section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100">
|
||||
<h3 className='title'>Set Chores, Set Goals <div className='section_sub_title'>Rewards Accomplishments</div></h3>
|
||||
<p className=''>
|
||||
Set goals, tasks, or anything that motivates or needs to be done and reward completion. WrenchBoard is the platform plan rewards.
|
||||
@@ -52,43 +52,6 @@ const Main = ({gredient}) => {
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
{/* <div className='w-100 ui_image_con d-flex justify-content-center align-items-center'>
|
||||
<div className="ui_images position-relative d-flex justify-content-center align-items-center" data-aos="fade-in" data-aos-duration="1500">
|
||||
<div className="left_img position-relative">
|
||||
<img
|
||||
className="moving_position_animatin position-relative"
|
||||
src={ localImgLoad(`images/home/${activeImg}.jpg`)}
|
||||
alt="image"
|
||||
width='332px'
|
||||
height='auto'
|
||||
/>
|
||||
</div>
|
||||
<div className="right_img position-relative d-flex flex-column justify-content-start align-items-center">
|
||||
<div className='d-flex flex-column justify-content-start align-items-center'>
|
||||
<img
|
||||
className="moving_position_animatin right_img_two"
|
||||
src={
|
||||
activeImg == 'reward-goals' ? localImgLoad(`images/home/box-reward.png`)
|
||||
:
|
||||
activeImg == 'assign-chores' ? localImgLoad(`images/home/box-chores.png`)
|
||||
:
|
||||
activeImg == 'financial-edu' ? localImgLoad(`images/home/box-financial.png`)
|
||||
:
|
||||
activeImg == 'family-connect' ? localImgLoad(`images/home/box-family.png`)
|
||||
:
|
||||
null
|
||||
}
|
||||
alt="image"
|
||||
/>
|
||||
</div>
|
||||
<img
|
||||
className="d-none moving_position_animatin right_img_three position-relative"
|
||||
src={localImgLoad(`images/home/wrenchboard_logo_4.png`)}
|
||||
alt="image"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
<Right />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import React from 'react'
|
||||
import BGImage from "../../../../assets/images/sec-background.jpg";
|
||||
|
||||
export default function Right() {
|
||||
return (
|
||||
@@ -9,28 +10,33 @@ export default function Right() {
|
||||
<div className='color-blue italic'>Wrench</div><div className='color-purple'>Agent</div>
|
||||
</h3>
|
||||
</div>
|
||||
<div className='p-2 w-100 bg-white my-2'>
|
||||
<div className='p-2 w-100 my-2'>
|
||||
<div className='color-purple text-center'>
|
||||
<h3 className='color-purple font-25 mb-10'>Ask our "WrenchAgent" Generative AI to assist</h3>
|
||||
<h3 className='font_black font-20 mb-10'>"Recommend 4 summer chores for a 12 years old"</h3>
|
||||
<h3 className='color-purple font-25 mb-10'>Ask our <span className='black'>❛❛WrenchAgent❜❜</span> Generative AI to assist</h3>
|
||||
<h3 className='font_black font-20 mb-10'>❛❛Recommend 4 summer chores for a 12 years old❜❜</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div className="p-2 bg-white custom-w-90 mx-auto border-thin border-r-10 border-skyblue">
|
||||
{list?.map((item, idx) => (
|
||||
<div className="col-12 mb-20" key={idx}>
|
||||
<div
|
||||
className={`appie-traffic-service-two features appie-modern-design`}
|
||||
>
|
||||
<div className="icon">
|
||||
<i className='fal fa-check' />
|
||||
{/* withFadeEdge-light-purple border-skyblue border-thin*/}
|
||||
<div className="p-2 pt-3 bg-white custom-w-90 mx-auto border-r-10 overflow-hidden"
|
||||
style={{ backgroundImage: `url(${BGImage})`, backgroundPosition: 'left center', backgroundRepeat: 'no-repeat' }}
|
||||
>
|
||||
<div className='generative-ai'>
|
||||
{list?.map((item, idx) => (
|
||||
<div className="col-12 mb-20" key={idx}>
|
||||
<div
|
||||
className={`appie-traffic-service-two features appie-modern-design`}
|
||||
>
|
||||
<div className="icon">
|
||||
<i className='fal fa-check' />
|
||||
</div>
|
||||
<h5 className="title italic color-purple">{item}</h5>
|
||||
</div>
|
||||
</div>
|
||||
<h5 className="title italic color-purple">{item}</h5>
|
||||
))}
|
||||
<div className='w-100 d-flex justify-content-end'>
|
||||
<a className='main-btn' href={process.env.REACT_APP_DASH_URL_SIGNUP}>Get Started</a>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
<div className='w-100 d-flex justify-content-end'>
|
||||
<button className='main-btn'>Get Started</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user