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

Merge branch 'after-hero-com' of WrenchBoard/WrenchBoardMainSite into master

Browse Source
This commit is contained in:
Olusesan Ameye
2024-07-25 21:31:22 +00:00
committed by Gogs
parent d08b1ee86d 0af4f2cdab
commit 4092bf4e48
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; border: 1px solid #89216b;
background-image: linear-gradient(90deg, #89216b 0%, #da4453 100%); */ background-image: linear-gradient(90deg, #89216b 0%, #da4453 100%); */
} }
@media only screen and (max-width: 568px) {
.main-btn {
padding: 0 15px;
}
}
.main-btn:hover { .main-btn:hover {
background-color: #fff; background-color: #fff;
color: #2b70fa; color: #2b70fa;
@@ -6730,29 +6735,38 @@ blockquote cite {
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.appie-about-8-box { .appie-about-container {
padding: 50px 50px 145px;
background: #fff; background: #fff;
border-radius: 6px; border-radius: 6px;
box-shadow: 0px 40px 40px 0px rgba(14, 17, 51, 0.1); box-shadow: 0px 40px 40px 0px rgba(14, 17, 51, 0.1);
position: relative; position: relative;
overflow: hidden; 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; z-index: 10;
} }
@media only screen and (min-width: 992px) and (max-width: 1200px) { @media only screen and (min-width: 992px) and (max-width: 1200px) {
.appie-about-8-box { .appie-about-8-box {
padding: 50px 25px 145px; padding: 50px 25px 0px 25px;
} }
} }
@media only screen and (min-width: 768px) and (max-width: 991px) { @media only screen and (min-width: 768px) and (max-width: 991px) {
.appie-about-8-box { .appie-about-container {
margin-bottom: 30px; margin-bottom: 30px;
} }
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.appie-about-8-box { .appie-about-container{
margin-bottom: 30px; margin-bottom: 30px;
padding: 50px 20px 145px; }
.appie-about-8-box {
padding: 50px 20px 0px 20px;
} }
} }
.appie-about-8-box .thumb { .appie-about-8-box .thumb {
@@ -6779,13 +6793,13 @@ blockquote cite {
line-height: 40px; line-height: 40px;
} }
} }
.appie-about-8-box a { .appie-about-container a {
border: 2px solid #db0f30; border: 2px solid #db0f30;
color: #db0f30; color: #db0f30;
background: #fff; background: #fff;
margin-top: 30px; margin-top: 30px;
} }
.appie-about-8-box a:hover { .appie-about-container a:hover {
color: #fff; color: #fff;
background: #db0f30; background: #db0f30;
border-color: #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 React from 'react';
import thumb4 from '../../assets/images/about-thumb-4.png'; import thumb4 from '../../assets/images/about-thumb-4.png';
import thumb5 from '../../assets/images/about-thumb-5.png'; import thumb5 from '../../assets/images/about-thumb-5.png';
import cardImg from '../../assets/images/home/card-home-01.png'
function AfterHero() { function AfterHero() {
return ( return (
@@ -11,47 +12,72 @@ function AfterHero() {
<div className="col-lg-12"> <div className="col-lg-12">
<div className="appie-section-title mb-30"> <div className="appie-section-title mb-30">
<h3 className="appie-title"> <h3 className="appie-title">
We bring everything <br /> {/* We bring everything <br />
that's required to build apps that's required to build apps */}
Set Chores, Set Goals
</h3> </h3>
</div> </div>
</div> </div>
</div> </div>
<div className="row"> <div className="row">
<div className="col-lg-7"> <div className="col-lg-7 mb-3 mb-lg-0">
<div className="appie-about-8-box"> <div className='appie-about-container'>
<h3 className="title"> <div className="appie-about-8-box">
Will my Template be <br /> <h3 className="title">
Mobile Friendly Reward Accomplishments
</h3> </h3>
<p> <p>
A load of old tosh spiffing pear shaped show <br /> 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
off pick your nose and blow </p>
</p> </div>
<a className="main-btn" href="#"> <div className='row'>
Learn More <i className="fal fa-arrow-right" /> <div className='col-12 col-sm-4 order-2 order-sm-1 align-self-end'>
</a> <a className="m-1 main-btn" href={process.env.REACT_APP_DASH_URL_LOGIN}>
<div className="thumb"> Learn More <i className="fal fa-arrow-right" />
<img src={thumb4} alt="" /> </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>
</div> </div>
<div className="col-lg-5"> <div className="col-lg-5">
<div className="appie-about-8-box"> {/* <div className="appie-about-8-box">
<h3 className="title"> <h3 className="title">
Website & Mobile <br /> Assign Faster with <br />
App Design wrenchAgent
</h3> </h3>
<p> <p>
A load of old tosh spiffing pear shaped show <br /> Ask our &#x275B;&#x275B;<span className=''>wrench</span><span className=''>Agent</span>&#x275C;&#x275C; Generative AI to assist
off pick your nose and blow
</p> </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" /> Learn More <i className="fal fa-arrow-right" />
</a> </a>
<div className="thumb mr-30"> <div className="thumb mr-30">
<img src={thumb5} alt="" /> <img src={thumb5} alt="" />
</div> </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> </div>
</div> </div>