Compare commits
16 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 VICTOR\anumu
|
ce1879d0a2 | ||
 tokslaw
|
c0d589a115 | ||
|
ChineseChikki
|
89fc6adfdd | ||
|
tokslaw
|
6323b86c6b | ||
|
VICTOR\anumu
|
d946417490 | ||
|
tokslaw
|
cf9601b87f | ||
|
VICTOR\anumu
|
56d961acbb | ||
|
dev-chiefworks
|
b591f333fd | ||
|
dev-chiefworks
|
3d4328e59f | ||
|
dev-chiefworks
|
05111a2a25 | ||
|
dev-chiefworks
|
68eeae2913 | ||
|
dev-chiefworks
|
003ce4196d | ||
|
dev-chiefworks
|
bc3b72ff95 | ||
|
tokslaw
|
44ba0ef178 | ||
|
Chukwumdiebube Ojinta
|
faf5bed72f | ||
|
Chukwumdiebube Ojinta
|
f4cdc84043 |
@@ -9,3 +9,5 @@ REACT_APP_FACEBOOK="https://www.facebook.com/profile.php?id=100066498622246"
|
||||
REACT_APP_TWITTER="https://twitter.com/fluxtra"
|
||||
|
||||
REACT_APP_APPSITE="https://myfitapp.mermsemr.com"
|
||||
|
||||
REACT_APP_AUX_ENDPOINT = "https://devapi.mermsemr.com/en/desktop/api/v2/myfit"
|
||||
|
||||
@@ -1,11 +1,25 @@
|
||||
import React, { useEffect } from "react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import Bredcrumb from "../Bredcrumb/Main";
|
||||
import BGImg from "../../assets/images/bread_crumb_bg.png";
|
||||
import BGImg1 from "../../assets/images/bread_crumb_bg_one.png";
|
||||
import BGImg2 from "../../assets/images/bread_crumb_bg_two.png";
|
||||
|
||||
import SiteService from "../../vendors/service/siteService";
|
||||
|
||||
const Main = ({ brdcum }) => {
|
||||
let [countries, setCountries] = useState([]) // initial state for country dropdown
|
||||
let countryClass = new SiteService() // instantiating the class
|
||||
|
||||
const allCountry = () => {
|
||||
return countryClass.countryData();
|
||||
}
|
||||
|
||||
//CALLS THE API AFTER COMPONENT LOADS
|
||||
useEffect(()=>{
|
||||
allCountry().then((data)=> setCountries(Object.values(data.data)))
|
||||
},[])
|
||||
|
||||
return (
|
||||
<>
|
||||
{brdcum.b1 && (
|
||||
@@ -86,6 +100,7 @@ const Main = ({ brdcum }) => {
|
||||
<div className="form-group">
|
||||
<select className="form-control">
|
||||
<option value="">Country</option>
|
||||
{countries.length > 0 && countries.map((country, index) => <option key={index} value={country}>{country}</option>)}
|
||||
</select>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
|
||||
@@ -68,8 +68,7 @@ const Main = ({video}) => {
|
||||
<div className="container">
|
||||
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100">
|
||||
<h2><span>Features</span> that makes app different!</h2>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe
|
||||
standard dummy.</p>
|
||||
<p>Fitness Integration with your health plan in your pocket bolsters<br/>healthier life by tracking and experiencing life-changing results.</p>
|
||||
</div>
|
||||
<div className="feature_detail">
|
||||
<div className="left_data feature_box">
|
||||
|
||||
@@ -1,13 +1,30 @@
|
||||
import { Link } from 'react-router-dom'
|
||||
import React , { useState} from 'react'
|
||||
import React , { useState, useEffect} from 'react'
|
||||
import AOS from "aos";
|
||||
import img1 from '../../../assets/images/standard.png'
|
||||
import img2 from '../../../assets/images/unlimited.png'
|
||||
import img3 from '../../../assets/images/premium.png'
|
||||
|
||||
import SiteService from '../../../vendors/service/siteService'
|
||||
|
||||
const Main = ({gredient , video}) => {
|
||||
|
||||
const[tog, setTog] = useState()
|
||||
|
||||
const [prices, setPrices] = useState([]); // initial state for FAQs before API call
|
||||
|
||||
let priceServices = new SiteService(); // instantiating the class
|
||||
|
||||
const getAllPriceData = () => {
|
||||
return priceServices.priceData();
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getAllPriceData().then((data) => setPrices(data.data));
|
||||
AOS.init();
|
||||
AOS.refresh();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
{gredient ?
|
||||
@@ -29,37 +46,52 @@ const Main = ({gredient , video}) => {
|
||||
|
||||
<div className={`pricing_pannel monthly_plan ${tog ? '' : 'active'}`}>
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
<img src="assets/images/standard-one.png" alt="image" />
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Standard</h3>
|
||||
<span>For the basics</span>
|
||||
</div>
|
||||
<span className="price">$15</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Up to 5 Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>50 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>10 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>2 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Support on request</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
|
||||
{prices.length > 0 &&
|
||||
prices.map((price, index) => {
|
||||
if (index % 2 == 0) {
|
||||
return (
|
||||
<div key={index} className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={price.icon} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>{price.title}</h3>
|
||||
<span>{price.text}</span>
|
||||
</div>
|
||||
<span className="price">{price.price}</span>
|
||||
<ul className="benifits">
|
||||
{price.features.map((feature, index)=> <p key={index}>{feature}</p>)}
|
||||
</ul>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<div key={index} className="col-md-4">
|
||||
<div className="pricing_block highlited_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={price.icon} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>{price.title}</h3>
|
||||
<span>{price.text}</span>
|
||||
</div>
|
||||
<span className="price">{price.price}</span>
|
||||
<ul className="benifits">
|
||||
{price.features.map((feature, index)=> <p key={index}>{feature}</p>)}
|
||||
</ul>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
{/* <div className="col-md-4">
|
||||
<div className="pricing_block highlited_block">
|
||||
<div className="icon">
|
||||
<img src="assets/images/unlimited-one.png" alt="image"/>
|
||||
@@ -86,136 +118,60 @@ const Main = ({gredient , video}) => {
|
||||
<p>24/7 Customer support</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
<img src="assets/images/premium-one.png" alt="image" />
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Premium</h3>
|
||||
<span>For small team</span>
|
||||
</div>
|
||||
<span className="price">$55</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Up to 10 Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>100 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>15 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>4 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>24/7 Customer support</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={`pricing_pannel yearly_plan ${tog ? 'active' : ''}`} >
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
<img src="assets/images/standard.png" alt="image" />
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Standard</h3>
|
||||
<span>For the basics</span>
|
||||
</div>
|
||||
<span className="price">$150</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Up to 10 Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>100 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>25 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>4 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Support on request</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block highlited_block">
|
||||
<div className="icon">
|
||||
<img src="assets/images/unlimited.png" alt="image" />
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Unlimited</h3>
|
||||
<span>For the professionals</span>
|
||||
</div>
|
||||
<span className="price">$999</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Unlimited Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>400 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>40 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>20 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>24/7 Customer support</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
{prices.length > 0 &&
|
||||
prices.map((price, index) => {
|
||||
if (index % 2 == 0) {
|
||||
return (
|
||||
<div key={index} className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={price.icon} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>{price.title}</h3>
|
||||
<span>{price.text}</span>
|
||||
</div>
|
||||
<span className="price">{price.price}</span>
|
||||
<ul className="benifits">
|
||||
{price.features.map((feature, index)=> <p key={index}>{feature}</p>)}
|
||||
</ul>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<div key={index} className="col-md-4">
|
||||
<div className="pricing_block highlited_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={price.icon} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>{price.title}</h3>
|
||||
<span>{price.text}</span>
|
||||
</div>
|
||||
<span className="price">{price.price}</span>
|
||||
<ul className="benifits">
|
||||
{price.features.map((feature, index)=> <p key={index}>{feature}</p>)}
|
||||
</ul>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
<img src="assets/images/premium.png" alt="image" />
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Premium</h3>
|
||||
<span>For small team</span>
|
||||
</div>
|
||||
<span className="price">$550</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Up to 20 Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>200 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>25 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>8 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>24/7 Customer support</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -241,193 +197,101 @@ const Main = ({gredient , video}) => {
|
||||
|
||||
<div className={`pricing_pannel monthly_plan ${tog ? '' : 'active'}`}>
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={img1} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Standard</h3>
|
||||
<span>For the basics</span>
|
||||
</div>
|
||||
<span className="price">$15</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Up to 5 Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>50 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>10 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>2 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Support on request</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block highlited_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/unlimited-one.png" alt="image"/> : <img src={img2} alt="image"/> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Unlimited</h3>
|
||||
<span>For the professionals</span>
|
||||
</div>
|
||||
<span className="price">$99</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Unlimited Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>200 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>20 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>10 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>24/7 Customer support</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
{video ? <img src="assets/images/premium-one.png" alt="image" /> : <img src={img3} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Premium</h3>
|
||||
<span>For small team</span>
|
||||
</div>
|
||||
<span className="price">$55</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Up to 10 Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>100 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>15 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>4 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>24/7 Customer support</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{prices.length > 0 &&
|
||||
prices.map((price, index) => {
|
||||
if (index % 2 == 0) {
|
||||
return (
|
||||
<div key={index} className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={price.icon} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>{price.title}</h3>
|
||||
<span>{price.text}</span>
|
||||
</div>
|
||||
<span className="price">{price.price}</span>
|
||||
<ul className="benifits">
|
||||
{price.features.map((feature, index)=> <p key={index}>{feature}</p>)}
|
||||
</ul>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<div key={index} className="col-md-4">
|
||||
<div className="pricing_block highlited_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={price.icon} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>{price.title}</h3>
|
||||
<span>{price.text}</span>
|
||||
</div>
|
||||
<span className="price">{price.price}</span>
|
||||
<ul className="benifits">
|
||||
{price.features.map((feature, index)=> <p key={index}>{feature}</p>)}
|
||||
</ul>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={`pricing_pannel yearly_plan ${tog ? 'active' : ''}`} >
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={img1} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Standard</h3>
|
||||
<span>For the basics</span>
|
||||
</div>
|
||||
<span className="price">$150</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Up to 10 Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>100 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>25 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>4 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Support on request</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block highlited_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/unlimited-one.png" alt="image"/> : <img src={img2}alt="image"/> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Unlimited</h3>
|
||||
<span>For the professionals</span>
|
||||
</div>
|
||||
<span className="price">$999</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Unlimited Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>400 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>40 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>20 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>24/7 Customer support</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
{prices.length > 0 &&
|
||||
prices.map((price, index) => {
|
||||
if (index % 2 == 0) {
|
||||
return (
|
||||
<div key={index} className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={price.icon} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>{price.title}</h3>
|
||||
<span>{price.text}</span>
|
||||
</div>
|
||||
<span className="price">{price.price}</span>
|
||||
<ul className="benifits">
|
||||
{price.features.map((feature, index)=> <p key={index}>{feature}</p>)}
|
||||
</ul>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<div key={index} className="col-md-4">
|
||||
<div className="pricing_block highlited_block">
|
||||
<div className="icon">
|
||||
{ video ? <img src="assets/images/standard-one.png" alt="image" /> : <img src={price.icon} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>{price.title}</h3>
|
||||
<span>{price.text}</span>
|
||||
</div>
|
||||
<span className="price">{price.price}</span>
|
||||
<ul className="benifits">
|
||||
{price.features.map((feature, index)=> <p key={index}>{feature}</p>)}
|
||||
</ul>
|
||||
<Link to="/" className="btn white_btn">Start Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
<div className="col-md-4">
|
||||
<div className="pricing_block">
|
||||
<div className="icon">
|
||||
{video ? <img src="assets/images/premium-one.png" alt="image" /> : <img src={img3} alt="image" /> }
|
||||
</div>
|
||||
<div className="pkg_name">
|
||||
<h3>Premium</h3>
|
||||
<span>For small team</span>
|
||||
</div>
|
||||
<span className="price">$550</span>
|
||||
<ul className="benifits">
|
||||
<li>
|
||||
<p>Up to 20 Website</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>200 GB disk space</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>25 Customize sub pages</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>8 Domains access</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>24/7 Customer support</p>
|
||||
</li>
|
||||
</ul>
|
||||
<Link to="/faq" className="btn white_btn">BUY NOW</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -20,8 +20,7 @@ const Main = ({dark}) => {
|
||||
<div className={`how_it_inner ${dark && "dark"}`}>
|
||||
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="300">
|
||||
<h2><span>How it works</span> - 3 easy steps</h2>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe
|
||||
standard dummy.</p>
|
||||
<p>myFit has powerful connectivity, fitness, health, and safety features,<br/> Also makes provision Fitness tracking,Workout tracking,Heart rate monitoring.</p>
|
||||
</div>
|
||||
<div className="step_block">
|
||||
<ul>
|
||||
|
||||
@@ -5,9 +5,23 @@ import BGImg from "../../../assets/images/bread_crumb_bg.png"
|
||||
import BGImg1 from "../../../assets/images/bread_crumb_bg_one.png"
|
||||
import BGImg2 from "../../../assets/images/bread_crumb_bg_two.png"
|
||||
|
||||
import SiteService from '../../../vendors/service/siteService'
|
||||
|
||||
const Main = ({brdcum}) => {
|
||||
|
||||
const[activeFaq, setActiveFaq] = useState({a : true})
|
||||
|
||||
const [faqs, setFaqs] = useState([]); // initial state for FAQs before API call
|
||||
|
||||
let faqServices = new SiteService(); // instantiating the class
|
||||
|
||||
const allFaqData = () => {
|
||||
return faqServices.faqData();
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
allFaqData().then((data) => setFaqs(data.data));
|
||||
}, []);
|
||||
return (
|
||||
<>
|
||||
{brdcum.b1 &&
|
||||
@@ -54,7 +68,8 @@ const Main = ({brdcum}) => {
|
||||
<div className="container">
|
||||
<div className="faq_panel">
|
||||
<div className="accordion" id="accordionExample">
|
||||
<div className="card" data-aos="fade-up" >
|
||||
|
||||
{/* <div className="card" data-aos="fade-up" >
|
||||
<div className="card-header" id="headingOne">
|
||||
<h2 className="mb-0">
|
||||
<button type="button" className={`btn btn-link ${activeFaq.a && "active"}`} onClick= {() => setActiveFaq(activeFaq.a ? {a : false} : {a : true})} data-toggle="collapse" data-target="#collapseOne">
|
||||
@@ -69,8 +84,9 @@ const Main = ({brdcum}) => {
|
||||
leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="card" data-aos="fade-up" >
|
||||
</div> */}
|
||||
|
||||
{/* <div className="card" data-aos="fade-up" >
|
||||
<div className="card-header" id="headingTwo">
|
||||
<h2 className="mb-0">
|
||||
<button type="button" className={`btn btn-link collapsed ${activeFaq.b && "active"}`} onClick= {() => setActiveFaq(activeFaq.b ? {b : false} : {b : true})} data-toggle="collapse"
|
||||
@@ -85,9 +101,9 @@ const Main = ({brdcum}) => {
|
||||
leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<div className="card" data-aos="fade-up" >
|
||||
{/* <div className="card" data-aos="fade-up" >
|
||||
<div className="card-header" id="headingThree">
|
||||
<h2 className="mb-0">
|
||||
<button type="button" className={`btn btn-link collapsed ${activeFaq.c && "active"}`} onClick= {() => setActiveFaq(activeFaq.c ? {c : false} : {c : true})} data-toggle="collapse"
|
||||
@@ -103,9 +119,9 @@ const Main = ({brdcum}) => {
|
||||
leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<div className="card" data-aos="fade-up" >
|
||||
{/* <div className="card" data-aos="fade-up" >
|
||||
<div className="card-header" id="headingFour">
|
||||
<h2 className="mb-0">
|
||||
<button type="button" className={`btn btn-link collapsed ${activeFaq.d && "active"}`} onClick= {() => setActiveFaq(activeFaq.d ? {d : false} : {d : true})} data-toggle="collapse"
|
||||
@@ -122,9 +138,9 @@ const Main = ({brdcum}) => {
|
||||
leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<div className="card" data-aos="fade-up" >
|
||||
{/* <div className="card" data-aos="fade-up" >
|
||||
<div className="card-header" id="headingFive">
|
||||
<h2 className="mb-0">
|
||||
<button type="button" className={`btn btn-link collapsed ${activeFaq.e && "active"}`} onClick= {() => setActiveFaq(activeFaq.e ? {e : false} : {e : true})} data-toggle="collapse"
|
||||
@@ -141,9 +157,9 @@ const Main = ({brdcum}) => {
|
||||
leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<div className="card" data-aos="fade-up" >
|
||||
{/* <div className="card" data-aos="fade-up" >
|
||||
<div className="card-header" id="headingSix">
|
||||
<h2 className="mb-0">
|
||||
<button type="button" className={`btn btn-link collapsed ${activeFaq.f && "active"}`} onClick= {() => setActiveFaq(activeFaq.f ? {f : false} : {f : true})} data-toggle="collapse"
|
||||
@@ -160,9 +176,9 @@ const Main = ({brdcum}) => {
|
||||
leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<div className="card" data-aos="fade-up" >
|
||||
{/* <div className="card" data-aos="fade-up" >
|
||||
<div className="card-header" id="headingSeven">
|
||||
<h2 className="mb-0">
|
||||
<button type="button" className={`btn btn-link collapsed ${activeFaq.g && "active"}`} onClick= {() => setActiveFaq(activeFaq.g ? {g : false} : {g : true})} data-toggle="collapse"
|
||||
@@ -179,7 +195,33 @@ const Main = ({brdcum}) => {
|
||||
leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
{/* displays loading ... while the page fetches the FAQs */}
|
||||
{faqs.length < 1 && <h3>Loading...</h3>}
|
||||
|
||||
{faqs.length > 0 && faqs.map((faq, index) => {
|
||||
let id = `heading${index}`; //headingSeven
|
||||
let target = `collapse${index}`; //#collapseSeven
|
||||
|
||||
return(
|
||||
<div key={index} className="card" data-aos="fade-up" >
|
||||
<div className="card-header" id={id}>
|
||||
<h2 className="mb-0">
|
||||
<button type="button" className={`btn btn-link collapsed ${activeFaq.b && "active"}`} data-toggle="collapse"
|
||||
data-target={`#${target}`}>{activeFaq.b ? <i className="icon_faq icofont-minus"></i> : <i className="icon_faq icofont-plus"></i>}{faq.title}
|
||||
</button>
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<div id={target} className="collapse" aria-labelledby={id} data-parent="#accordionExample">
|
||||
<div className="card-body">
|
||||
<p>{faq.text}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -28,8 +28,8 @@ const Main = ({ brdcum }) => {
|
||||
collection, use, purpose, and sharing of personally identifiable
|
||||
information ("PII") related to the use of Merms's myFit website{" "}
|
||||
<span>
|
||||
<a href="https://myfit.mermsemr.com/">
|
||||
https://myfit.mermsemr.com
|
||||
<a href={process.env.REACT_APP_APPSITE}>
|
||||
{process.env.REACT_APP_APPSITE}
|
||||
</a>
|
||||
</span>
|
||||
, MERMS providing of services to our users ("Partners"), or from
|
||||
@@ -53,8 +53,8 @@ const Main = ({ brdcum }) => {
|
||||
govern. Provides its services (described below) to you through
|
||||
its website located at{" "}
|
||||
<span>
|
||||
<a href="https://myfit.mermsemr.com/">
|
||||
https://myfit.mermsemr.com
|
||||
<a href={process.env.REACT_APP_APPSITE}>
|
||||
{process.env.REACT_APP_APPSITE}
|
||||
</a>
|
||||
</span>{" "}
|
||||
(the "Site") and through its mobile applications and related
|
||||
@@ -1363,8 +1363,8 @@ const Main = ({ brdcum }) => {
|
||||
use, purpose, and sharing of personally identifiable information
|
||||
("PII") related to the use of Merms's myFit website{" "}
|
||||
<span>
|
||||
<a href="https://myfit.mermsemr.com/">
|
||||
https://myfit.mermsemr.com
|
||||
<a href={process.env.REACT_APP_APPSITE}>
|
||||
{process.env.REACT_APP_APPSITE}
|
||||
</a>
|
||||
</span>
|
||||
, MERMS providing of services to our users ("Partners"), or from
|
||||
|
||||
Vendored
+76
@@ -0,0 +1,76 @@
|
||||
import React from "react";
|
||||
import Axios from "axios";
|
||||
|
||||
class SiteService {
|
||||
constructor() {
|
||||
console.log("Er are here anyway");
|
||||
}
|
||||
blogData() {
|
||||
return this.getAuxEnd("blogdata", null);
|
||||
}
|
||||
|
||||
countryData() {
|
||||
return this.getAuxEnd("/country", null);
|
||||
}
|
||||
|
||||
faqData() {
|
||||
return this.getAuxEnd("/faq", null);
|
||||
}
|
||||
|
||||
priceData() {
|
||||
return this.getAuxEnd("/pricing", null);
|
||||
}
|
||||
|
||||
//---------------------------------------- -----
|
||||
//---------------------------------------- -----
|
||||
// Unified call below
|
||||
//---------------------------------------- -----
|
||||
//---------------------------------------- -----
|
||||
getAuxEnd(uri, reqData) {
|
||||
const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
|
||||
return Axios.get(endPoint)
|
||||
.then((response) => {
|
||||
// console.log(response);
|
||||
// res = response;
|
||||
// console.log("~~~~~~~ Toks2 GET ~~~~~~~~");
|
||||
return response;
|
||||
})
|
||||
.catch((error) => {
|
||||
if (error.response) {
|
||||
//response status is an error code
|
||||
console.log(error.response.status);
|
||||
} else if (error.request) {
|
||||
//response not received though the request was sent
|
||||
console.log(error.request);
|
||||
} else {
|
||||
//an error occurred when setting up the request
|
||||
console.log(error.message);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
postAuxEnd(uri, reqData) {
|
||||
const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
|
||||
Axios.post(endPoint)
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
// res = response;
|
||||
console.log("~~~~~~~ Toks2 POST ~~~~~~~~");
|
||||
return response;
|
||||
})
|
||||
.catch((error) => {
|
||||
if (error.response) {
|
||||
//response status is an error code
|
||||
console.log(error.response.status);
|
||||
} else if (error.request) {
|
||||
//response not received though the request was sent
|
||||
console.log(error.request);
|
||||
} else {
|
||||
//an error occurred when setting up the request
|
||||
console.log(error.message);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export default SiteService;
|
||||
Reference in New Issue
Block a user