FloatSystems/float-www
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Adding text variables in about page #10

Merged
tokslaw merged 1 commits from about-text-variables into master 2023-03-29 16:02:45 +00:00
Conversation 0 Commits 1 Files Changed 1
+22 -30
1 changed files with 22 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/About.js
+22 -30
View File
@@ -5,8 +5,8 @@ class About extends React.Component {
render() { render() {
let heroInfo = { let heroInfo = {
title: { title: {
h2: 'No, we are ', //leave a space after writing for proper indentation normal: 'No, we are ', //leave a space after writing for proper indentation
span: 'not just another travel app.' bold: 'not just another travel app.'
}, },
desc: "Float is a global Start Up working on improving everyone’s city life." desc: "Float is a global Start Up working on improving everyone’s city life."
} }
@@ -33,13 +33,11 @@ class About extends React.Component {
}, },
right: "You are interested in public infrastructure and promote eco-friendly alternatives - however keeping track of what is the fastest, cheapest and greenest way to get somewhere isn’t easily done while being in a rush. We feel you - we are here to support you with by finding a better way to go." right: "You are interested in public infrastructure and promote eco-friendly alternatives - however keeping track of what is the fastest, cheapest and greenest way to get somewhere isn’t easily done while being in a rush. We feel you - we are here to support you with by finding a better way to go."
}, },
button: "Read the Reviews" cta: "Read the Reviews"
} }
let testimonials = { let testimonials = {
title: { tag: 'MADE FOR US',
p: 'MADE FOR US', title:'Created from urbanists'
h2: 'Created from urbanists'
}
} }
let valueInfo = { let valueInfo = {
id: 'Values', id: 'Values',
@@ -52,17 +50,13 @@ class About extends React.Component {
} }
let brands = 'You might know Float from:' let brands = 'You might know Float from:'
let team = { let team = {
title: { tag: 'One Team Many Talents',
p: 'Our Team is as vibrating and diversified as your urban life.', title: 'Our Team is as vibrating and diversified as your urban life.',
h2: 'One Team Many Talents'
}
} }
let newsletter = { let newsletter = {
title: { tag: 'Subscribe to Our Newsletter',
span: 'Subscribe to Our Newsletter', title: 'Stay up to date with our news, ideas and updates',
h4: 'Stay up to date with our news, ideas and updates' cta: 'Subscribe Now'
},
button: 'Subscribe Now'
} }
return( return(
@@ -88,7 +82,7 @@ class About extends React.Component {
<div className="col-lg-8 offset-lg-2"> <div className="col-lg-8 offset-lg-2">
<div className="hero-txt text-center white-color"> <div className="hero-txt text-center white-color">
{/* Title */} {/* Title */}
<h2 className="h2-md">{heroInfo.title.h2} <span>{heroInfo.title.span}</span> </h2> <h2 className="h2-md">{heroInfo.title.normal} <span>{heroInfo.title.bold}</span> </h2>
{/* Text */} {/* Text */}
<p className="p-xl">{heroInfo.desc}</p> <p className="p-xl">{heroInfo.desc}</p>
</div> </div>
@@ -142,7 +136,7 @@ class About extends React.Component {
</div> </div>
{/* TEXT BLOCK */} {/* TEXT BLOCK */}
<div className="about-2-txt pc-50"> <div className="about-2-txt pc-50">
<h5 className="h5-lg"> <span>MADE FOR YOU</span><br />Created for urbanists</h5> <h5 className="h5-lg"> <span>{aboutDesc.lowerSection.caption.first}</span><br />{aboutDesc.lowerSection.caption.second}</h5>
<div className="row"> <div className="row">
{/* LEFT COLUMN */} {/* LEFT COLUMN */}
<div className="col-md-6"> <div className="col-md-6">
@@ -150,9 +144,7 @@ class About extends React.Component {
{/* Title */} {/* Title */}
{/* <h5 className="h5-lg">We care about the details</h5> */} {/* <h5 className="h5-lg">We care about the details</h5> */}
{/* Text */} {/* Text */}
<p className="p-lg">A classic day in your urban life:<br /> <p className="p-lg">{aboutDesc.lowerSection.left.first}<br />{aboutDesc.lowerSection.left.second}</p>
You drive to work, drive to the store, maybe drive your kids to school, drive back home, meet some friends if there is little time left. Distances are so vast, it takes forever to get anywhere and there’s little chance for spontaneity and diversity in daily routines - Vibrating urban Citylife is just passing you by.
</p>
</div> </div>
</div> {/* END LEFT COLUMN */} </div> {/* END LEFT COLUMN */}
{/* RIGHT COLUMN */} {/* RIGHT COLUMN */}
@@ -161,7 +153,7 @@ You drive to work, drive to the store, maybe drive your kids to school, drive ba
{/* Title */} {/* Title */}
{/* <h5 className="h5-lg">With knowledge, skill and hard work</h5> */} {/* <h5 className="h5-lg">With knowledge, skill and hard work</h5> */}
{/* List */} {/* List */}
<p className="p-lg">You are interested in public infrastructure and promote eco-friendly alternatives - however keeping track of what is the fastest, cheapest and greenest way to get somewhere isn’t easily done while being in a rush. We feel you - we are here to support you with by finding a better way to go.</p> {/* End List */} <p className="p-lg">{aboutDesc.lowerSection.right}</p> {/* End List */}
</div> </div>
</div> {/* END RIGHT COLUMN */} </div> {/* END RIGHT COLUMN */}
</div> </div>
@@ -170,7 +162,7 @@ You drive to work, drive to the store, maybe drive your kids to school, drive ba
<div className="row"> <div className="row">
<div className="col-md-12"> <div className="col-md-12">
<div className="about-2-btn text-center mt-40"> <div className="about-2-btn text-center mt-40">
<a href="#" className="btn btn-md btn-skyblue tra-skyblue-hover">Read the Reviews</a> <a href="#" className="btn btn-md btn-skyblue tra-skyblue-hover">{aboutDesc.cta}</a>
</div> </div>
</div> </div>
</div> {/* END BUTTON */} </div> {/* END BUTTON */}
@@ -184,9 +176,9 @@ You drive to work, drive to the store, maybe drive your kids to school, drive ba
<div className="row"> <div className="row">
<div className="col-lg-10 offset-lg-1"> <div className="col-lg-10 offset-lg-1">
<div className="section-title text-center mb-60"> <div className="section-title text-center mb-60">
<p>{testimonials.title.p}</p> <p>{testimonials.tag}</p>
{/* Title */} {/* Title */}
<h2 className="h2-md">{testimonials.title.h2}</h2> <h2 className="h2-md">{testimonials.title}</h2>
{/* Text */} {/* Text */}
{/* <p className="p-xl">Our Team is as vibrating and diversified as your urban life. */} {/* <p className="p-xl">Our Team is as vibrating and diversified as your urban life. */}
{/* </p> */} {/* </p> */}
@@ -368,9 +360,9 @@ You drive to work, drive to the store, maybe drive your kids to school, drive ba
<div className="col-lg-10 offset-lg-1"> <div className="col-lg-10 offset-lg-1">
<div className="section-title text-center mb-70"> <div className="section-title text-center mb-70">
{/* Title */} {/* Title */}
<h2 className="h2-md">{team.title.h2}</h2> <h2 className="h2-md">{team.tag}</h2>
{/* Text */} {/* Text */}
<p className="p-xl">{team.title.p}</p> <p className="p-xl">{team.title}</p>
</div> </div>
</div> </div>
</div> </div>
@@ -411,9 +403,9 @@ You drive to work, drive to the store, maybe drive your kids to school, drive ba
<div className="col-lg-6"> <div className="col-lg-6">
<div className="newsletter-txt"> <div className="newsletter-txt">
{/* Section ID */} {/* Section ID */}
<span className="section-id">{newsletter.title.span}</span> <span className="section-id">{newsletter.tag}</span>
{/* Title */} {/* Title */}
<h4 className="h4-xl">{newsletter.title.h4}</h4> <h4 className="h4-xl">{newsletter.title}</h4>
</div> </div>
</div> </div>
{/* NEWSLETTER FORM */} {/* NEWSLETTER FORM */}
@@ -422,7 +414,7 @@ You drive to work, drive to the store, maybe drive your kids to school, drive ba
<div className="input-group"> <div className="input-group">
<input type="email" autoComplete="off" className="form-control" placeholder="Your email address" required id="s-email" /> <input type="email" autoComplete="off" className="form-control" placeholder="Your email address" required id="s-email" />
<span className="input-group-btn"> <span className="input-group-btn">
<button type="submit" className="btn btn-md btn-skyblue tra-skyblue-hover">{newsletter.button}</button> <button type="submit" className="btn btn-md btn-skyblue tra-skyblue-hover">{newsletter.cta}</button>
</span> </span>
</div> </div>
{/* Newsletter Form Notification */} {/* Newsletter Form Notification */}