MyFit/www-myfit
4
0
Fork 0
Code Issues Pull Requests Releases Activity

myfit starter commit

Browse Source
This commit is contained in:
Olu Amey
2022-12-28 07:50:33 -05:00
commit 0e6b91686e
502 changed files with 56358 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/component/HomeMain/AboutApp/Main.js
+103
View File
@@ -0,0 +1,103 @@
import { Link } from 'react-router-dom'
import React from 'react'
import frame from '../../../assets/images/about-frame.png'
import screen from '../../../assets/images/about-screen.png'
import img1 from '../../../assets/images/download.png'
import img2 from '../../../assets/images/followers.png'
import img3 from '../../../assets/images/reviews.png'
import img4 from '../../../assets/images/countries.png'
const Main = ({video , dark}) => {
return (
<>
<section className="row_am about_app_section">
<div className="container">
<div className="row">
<div className="col-lg-6">
<div className="about_img" data-aos="fade-in" data-aos-duration="1500">
<div className="frame_img">
<img className="moving_position_animatin" src={frame} alt="image"/>
</div>
<div className="screen_img">
<img className="moving_animation" src={screen} alt="image" />
</div>
</div>
</div>
<div className="col-lg-6">
<div className="about_text">
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100">
<h2>Some awesome words <span>about app.</span></h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry lorem Ipsum has been the
industrys standard dummy text ever since the when an unknown printer took a galley of type and. Lorem
ipsum dolor sit amet.
</p>
</div>
{dark ?
<ul className="list">
<li data-aos="fade-up" data-aos-duration="1500">
<i className="icofont-verification-check"></i> Simply dummy text of the printing and
</li>
<li data-aos="fade-up" data-aos-duration="1500">
<i className="icofont-verification-check"></i> Typesetting industry lorem Ipsum has been the
</li>
<li data-aos="fade-up" data-aos-duration="1500">
<i className="icofont-verification-check"></i> Industrys standard dummy text
</li>
<li data-aos="fade-up" data-aos-duration="1500">
<i className="icofont-verification-check"></i> Simply dummy text of the printing and
</li>
<li data-aos="fade-up" data-aos-duration="1500">
<i className="icofont-verification-check"></i> Typesetting industry lorem Ipsum has been the
</li>
</ul>
:
<ul className="app_statstic" id="counter" data-aos="fade-in" data-aos-duration="1500">
<li>
<div className="icon">
{video ? <img src="assets/images/download-one.png" alt="image" /> : <img src={img1} alt="image" />}
</div>
<div className="text">
<p><span className="counter-value" data-count="17">0</span><span>M+</span></p>
<p>Download</p>
</div>
</li>
<li>
<div className="icon">
{video ? <img src="assets/images/followers-one.png" alt="image" /> : <img src={img2} alt="image" /> }
</div>
<div className="text">
<p><span className="counter-value" data-count="08">0 </span><span>M+</span></p>
<p>Followers</p>
</div>
</li>
<li>
<div className="icon">
{video ? <img src="assets/images/reviews-one.png" alt="image" /> : <img src={img3} alt="image" /> }
</div>
<div className="text">
<p><span className="counter-value" data-count="2300">1500</span><span>+</span></p>
<p>Reviews</p>
</div>
</li>
<li>
<div className="icon">
{video ? <img src="assets/images/countries-one.png" alt="image" /> : <img src={img4} alt="image" /> }
</div>
<div className="text">
<p><span className="counter-value" data-count="150">0</span><span>+</span></p>
<p>Countries</p>
</div>
</li>
</ul>}
<Link to="/contact" className="btn puprple_btn" data-aos="fade-in" data-aos-duration="1500">START FREE TRIAL</Link>
</div>
</div>
</div>
</div>
</section>
</>
)
}
export default Main