fixed text alignment and clean up

This commit is contained in:
Ebube
2023-08-28 18:15:13 +01:00
parent 34844c08de
commit f3eb3858e1
+22 -38
View File
@@ -10,48 +10,21 @@ function TrafficHomeOne() {
<div className="row">
<div className="col-lg-7">
<div className="appie-traffic-title">
<h3 className="title">on WrenchBoard.</h3>
<p>
Performing task on WrenchBoard is easy. All you need is a free account.
</p>
<h3 className="title">{featuresContent.title}</h3>
<p>{featuresContent.detail}</p>
</div>
<div className="row">
<div className="col-lg-6 col-md-6">
<div className="appie-traffic-service mb-30">
<div className="icon">
<i className="fal fa-check" />
{featuresContent.list?.map(({ icon, header, paragraph }, idx) => (
<div className="col-lg-6 col-md-6" key={idx}>
<div className={`appie-traffic-service features item-${idx} mb-30`} style={{ paddingRight: "45px" }}>
<div className="icon">
<i className={icon} />
</div>
<h5 className="title">{header}</h5>
<p>{paragraph}</p>
</div>
<h5 className="title">Free account</h5>
<p>Get family access from parents, or create your free account.</p>
</div>
</div>
<div className="col-lg-6 col-md-6">
<div className="appie-traffic-service item-2 mb-30">
<div className="icon">
<i className="fal fa-check" />
</div>
<h5 className="title">Suggest or Find Task</h5>
<p>Suggest tasks to parents or pick from the market.</p>
</div>
</div>
<div className="col-lg-6 col-md-6">
<div className="appie-traffic-service item-3">
<div className="icon">
<i className="fal fa-check" />
</div>
<h5 className="title">Complete Task</h5>
<p>Complete the task as specified.</p>
</div>
</div>
<div className="col-lg-6 col-md-6">
<div className="appie-traffic-service item-4">
<div className="icon">
<i className="fal fa-check" />
</div>
<h5 className="title">Reward</h5>
<p>Get your reward as specified.</p>
</div>
</div>
))}
{/* <div className="col-lg-12">
<div className="traffic-btn mt-50">
<a className="main-btn" href={process.env.REACT_APP_DASH_URL_LOGIN}>
@@ -77,3 +50,14 @@ function TrafficHomeOne() {
}
export default TrafficHomeOne;
const featuresContent = {
title: "on WrenchBoard.",
detail: "Performing task on WrenchBoard is easy. All you need is a free account.",
list: [
{ icon: "fal fa-check", header: "Free account", paragraph: "Get family access from parents, or create your free account." },
{ icon: "fal fa-check", header: "Suggest or Find Task", paragraph: "Suggest tasks to parents or pick from the market." },
{ icon: "fal fa-check", header: "Complete Task", paragraph: "Complete the task as specified." },
{ icon: "fal fa-check", header: "Reward", paragraph: "Get your reward as specified." },
]
}