WrenchBoard/WrenchBoardMainSite
2
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

image added to section after hero section #102

Merged
ameye merged 1 commits from after-hero-com into master 2024-07-25 21:31:24 +00:00
Conversation 0 Commits 1 Files Changed 3
+71 -31
3 changed files with 71 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/css/main.css
+22 -8
View File
@@ -160,6 +160,11 @@ p {
border: 1px solid #89216b;
background-image: linear-gradient(90deg, #89216b 0%, #da4453 100%); */
}
@media only screen and (max-width: 568px) {
.main-btn {
padding: 0 15px;
}
}
.main-btn:hover {
background-color: #fff;
color: #2b70fa;
@@ -6730,29 +6735,38 @@ blockquote cite {
background-repeat: no-repeat;
}
.appie-about-8-box {
padding: 50px 50px 145px;
.appie-about-container {
background: #fff;
border-radius: 6px;
box-shadow: 0px 40px 40px 0px rgba(14, 17, 51, 0.1);
position: relative;
overflow: hidden;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.appie-about-8-box {
padding: 50px 50px 0px 50px;
z-index: 10;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
.appie-about-8-box {
padding: 50px 25px 145px;
padding: 50px 25px 0px 25px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.appie-about-8-box {
.appie-about-container {
margin-bottom: 30px;
}
}
@media (max-width: 767px) {
.appie-about-8-box {
.appie-about-container{
margin-bottom: 30px;
padding: 50px 20px 145px;
}
.appie-about-8-box {
padding: 50px 20px 0px 20px;
}
}
.appie-about-8-box .thumb {
@@ -6779,13 +6793,13 @@ blockquote cite {
line-height: 40px;
}
}
.appie-about-8-box a {
.appie-about-container a {
border: 2px solid #db0f30;
color: #db0f30;
background: #fff;
margin-top: 30px;
}
.appie-about-8-box a:hover {
.appie-about-container a:hover {
color: #fff;
background: #db0f30;
border-color: #db0f30;
src/assets/images/home/card-home-01.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 92 KiB

src/components/HomeOne/AfterHero.js
+49 -23
View File
@@ -1,6 +1,7 @@
import React from 'react';
import thumb4 from '../../assets/images/about-thumb-4.png';
import thumb5 from '../../assets/images/about-thumb-5.png';
import cardImg from '../../assets/images/home/card-home-01.png'
function AfterHero() {
return (
@@ -11,47 +12,72 @@ function AfterHero() {
<div className="col-lg-12">
<div className="appie-section-title mb-30">
<h3 className="appie-title">
We bring everything <br />
that's required to build apps
{/* We bring everything <br />
that's required to build apps */}
Set Chores, Set Goals
</h3>
</div>
</div>
</div>
<div className="row">
<div className="col-lg-7">
<div className="appie-about-8-box">
<h3 className="title">
Will my Template be <br />
Mobile Friendly
</h3>
<p>
A load of old tosh spiffing pear shaped show <br />
off pick your nose and blow
</p>
<a className="main-btn" href="#">
Learn More <i className="fal fa-arrow-right" />
</a>
<div className="thumb">
<img src={thumb4} alt="" />
<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>
<div className="col-12 col-sm-8 order-1 order-sm-2">
<img className='w-100 h-100' src={cardImg} alt="Child Card" />
</div>
</div>
</div>
</div>
<div className="col-lg-5">
<div className="appie-about-8-box">
{/* <div className="appie-about-8-box">
<h3 className="title">
Website & Mobile <br />
App Design
Assign Faster with <br />
wrenchAgent
</h3>
<p>
A load of old tosh spiffing pear shaped show <br />
off pick your nose and blow
Ask our &#x275B;&#x275B;<span className=''>wrench</span><span className=''>Agent</span>&#x275C;&#x275C; Generative AI to assist
</p>
<a className="main-btn" href="#">
<a className="main-btn" href={process.env.REACT_APP_DASH_URL_LOGIN}>
Learn More <i className="fal fa-arrow-right" />
</a>
<div className="thumb mr-30">
<img src={thumb5} alt="" />
</div>
</div> */}
<div className='appie-about-container'>
<div className="appie-about-8-box">
<h3 className="title">
Assign Faster with <br />
wrenchAgent
</h3>
<p>
Ask our &#x275B;&#x275B;<span className=''>wrench</span><span className=''>Agent</span>&#x275C;&#x275C; 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>
<div className="col-12 col-sm-8 order-1 order-sm-2">
<img className='w-100 h-100' src={thumb5} alt="" />
</div>
</div>
</div>
</div>
</div>