connecting API for fetching blogdata
This commit is contained in:
Michael
+124
-136
@@ -1,27 +1,60 @@
|
||||
import React from 'react'
|
||||
import { Link } from 'react-router-dom'
|
||||
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 React, { useEffect, useState } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
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, bgimg }) => {
|
||||
const [blogData, setBlogData] = useState([]);
|
||||
|
||||
const api = new SiteService();
|
||||
useEffect(() => {
|
||||
getBlogData();
|
||||
}, []);
|
||||
|
||||
const getBlogData = async () => {
|
||||
try {
|
||||
const res = await api.blogData();
|
||||
setBlogData(res.data);
|
||||
console.log("data", res.data);
|
||||
console.log("Blog details ", res);
|
||||
} catch (error) {
|
||||
console.log("Error from blog data ", error);
|
||||
}
|
||||
};
|
||||
|
||||
const Main = ({brdcum,bgimg}) => {
|
||||
return (
|
||||
<>
|
||||
|
||||
<div className="bred_crumb" style={{ backgroundImage : `url(${BGImg})`}}>
|
||||
<div className="container">
|
||||
<span className="banner_shape1"> <img src="assets/images/banner-shape1.png" alt="image" /> </span>
|
||||
<span className="banner_shape2"> <img src="assets/images/banner-shape2.png" alt="image" /> </span>
|
||||
<span className="banner_shape3"> <img src="assets/images/banner-shape3.png" alt="image" /> </span>
|
||||
<div className="bred_crumb" style={{ backgroundImage: `url(${BGImg})` }}>
|
||||
<div className="container">
|
||||
<span className="banner_shape1">
|
||||
{" "}
|
||||
<img src="assets/images/banner-shape1.png" alt="image" />{" "}
|
||||
</span>
|
||||
<span className="banner_shape2">
|
||||
{" "}
|
||||
<img src="assets/images/banner-shape2.png" alt="image" />{" "}
|
||||
</span>
|
||||
<span className="banner_shape3">
|
||||
{" "}
|
||||
<img src="assets/images/banner-shape3.png" alt="image" />{" "}
|
||||
</span>
|
||||
|
||||
<div className="bred_text">
|
||||
<h1>Latest Blog Post</h1>
|
||||
<ul>
|
||||
<li><Link to="/">Home</Link></li>
|
||||
<li><span>»</span></li>
|
||||
<li><Link to="/blog">Blog</Link></li>
|
||||
</ul>
|
||||
{/* <div className="search_bar">
|
||||
<div className="bred_text">
|
||||
<h1>Latest Blog Post</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link to="/">Home</Link>
|
||||
</li>
|
||||
<li>
|
||||
<span>»</span>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="/blog">Blog</Link>
|
||||
</li>
|
||||
</ul>
|
||||
{/* <div className="search_bar">
|
||||
<form action="">
|
||||
<div className="form-group">
|
||||
<input type="text" placeholder="Search here" className="form-control"/>
|
||||
@@ -29,126 +62,81 @@ const Main = ({brdcum,bgimg}) => {
|
||||
</div>
|
||||
</form>
|
||||
</div>*/}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<section className="row_am blog_list_main">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6" data-aos="fade-in" data-aos-duration="1500">
|
||||
<div className="blog_img">
|
||||
<img src="https://picsum.photos/seed/picsum/505/378" alt="image"/>
|
||||
<span>20 min ago</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="blog_text">
|
||||
<div className="section_title">
|
||||
<h2>Top rated app of the year!</h2>
|
||||
<p>myFit has powerful connectivity, fitness, health, and safety features
|
||||
Also makes provision Fitness tracking,Workout tracking,Heart rate monitoringscrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic Lorem Ipsum is simply dummy text of the printing and typesetting.</p>
|
||||
<Link to="/blog-single">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section className="row_am blog_list_main">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div
|
||||
className="col-lg-6"
|
||||
data-aos="fade-in"
|
||||
data-aos-duration="1500"
|
||||
>
|
||||
<div className="blog_img">
|
||||
<img
|
||||
src="https://picsum.photos/seed/picsum/505/378"
|
||||
alt="image"
|
||||
/>
|
||||
<span>20 min ago</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section className="row_am latest_story blog_list_story" id="blog">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="https://picsum.photos/seed/picsum/505/378" alt="image" />
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Cool features added!</h3>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting
|
||||
industry lorem Ipsum has.</p>
|
||||
<Link to="/blog-single">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="https://picsum.photos/seed/picsum/505/378" alt="image" />
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Top rated app! Yupp.</h3>
|
||||
<p>Simply dummy text of the printing and typesetting industry lorem Ipsum has Lorem Ipsum is.</p>
|
||||
<Link to="/blog-single">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="https://picsum.photos/seed/picsum/505/378" alt="image"/>
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Creative ideas on app.</h3>
|
||||
<p>Printing and typesetting industry lorem Ipsum has Lorem simply dummy text of the.</p>
|
||||
<Link to="/blog-single">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="https://picsum.photos/seed/picsum/505/378" alt="image"/>
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Excellence UI design</h3>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting
|
||||
industry lorem Ipsum has.</p>
|
||||
<Link to="/blog-single">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="https://picsum.photos/seed/picsum/505/378" alt="image"/>
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Quick and easy Search</h3>
|
||||
<p>Simply dummy text of the printing and typesetting industry lorem Ipsum has Lorem Ipsum is.</p>
|
||||
<Link to="/blog-single">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="https://picsum.photos/seed/picsum/505/378" alt="image"/>
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Chat function eded</h3>
|
||||
<p>Printing and typesetting industry lorem Ipsum has Lorem simply dummy text of the.</p>
|
||||
<Link to="/blog-single">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="pagination_block">
|
||||
<ul>
|
||||
<li><Link to="#" className="prev"> Visit our blog</Link></li>
|
||||
</ul>
|
||||
<div className="col-lg-6">
|
||||
<div className="blog_text">
|
||||
<div className="section_title">
|
||||
<h2>Top rated app of the year!</h2>
|
||||
<p>
|
||||
myFit has powerful connectivity, fitness, health, and safety
|
||||
features Also makes provision Fitness tracking,Workout
|
||||
tracking,Heart rate monitoringscrambled it to make a type
|
||||
specimen book. It has survived not only five centuries, but
|
||||
also the leap into electronic Lorem Ipsum is simply dummy
|
||||
text of the printing and typesetting.
|
||||
</p>
|
||||
<Link to="/blog-single">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section className="row_am latest_story blog_list_story" id="blog">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
{blogData.map((data) => (
|
||||
<div key={data.id} className="col-md-4">
|
||||
<div className="story_box" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src={data.meta_value} alt="image" />
|
||||
<span>{data.post_date}</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>{data.post_title}</h3>
|
||||
<p>{data.post_content}</p>
|
||||
{/* <p dangerouslysethtml={data.post_content}></p> */}
|
||||
<Link to={"/blog-single/" + String(data.id)}>
|
||||
READ MORE
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div className="pagination_block">
|
||||
<ul>
|
||||
<li>
|
||||
<Link to="#" className="prev">
|
||||
{" "}
|
||||
Visit our blog
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
)
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
export default Main
|
||||
export default Main;
|
||||
|
||||
@@ -1,275 +1,513 @@
|
||||
import React 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 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";
|
||||
import { useParams } from "react-router-dom";
|
||||
|
||||
const Main = ({ brdcum }) => {
|
||||
const [blogData, setBlogData] = useState([]);
|
||||
const { id } = useParams();
|
||||
|
||||
const api = new SiteService();
|
||||
useEffect(() => {
|
||||
getBlogData();
|
||||
}, []);
|
||||
|
||||
const getBlogData = async () => {
|
||||
try {
|
||||
const res = await api.blogData(id);
|
||||
setBlogData(res.data);
|
||||
console.log("data", res.data);
|
||||
console.log("Blog details ", res);
|
||||
} catch (error) {
|
||||
console.log("Error from blog data ", error);
|
||||
}
|
||||
};
|
||||
|
||||
const Main = ({brdcum}) => {
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
{brdcum.b1 &&
|
||||
<Bredcrumb
|
||||
no={1}
|
||||
title="Blog details"
|
||||
tag="Blog single"
|
||||
bgimg={BGImg}/>}
|
||||
{brdcum.b1 && (
|
||||
<Bredcrumb
|
||||
no={1}
|
||||
title="Blog details"
|
||||
tag="Blog single"
|
||||
bgimg={BGImg}
|
||||
/>
|
||||
)}
|
||||
|
||||
{brdcum.b2 &&
|
||||
<Bredcrumb
|
||||
no={2}
|
||||
title="Blog details"
|
||||
tag="Blog single"
|
||||
bgimg={BGImg1}/>}
|
||||
{brdcum.b2 && (
|
||||
<Bredcrumb
|
||||
no={2}
|
||||
title="Blog details"
|
||||
tag="Blog single"
|
||||
bgimg={BGImg1}
|
||||
/>
|
||||
)}
|
||||
|
||||
{brdcum.b5 &&
|
||||
<Bredcrumb
|
||||
no={5}
|
||||
title="Blog details"
|
||||
tag="Blog single"
|
||||
bgimg={BGImg}/>}
|
||||
{brdcum.b5 && (
|
||||
<Bredcrumb
|
||||
no={5}
|
||||
title="Blog details"
|
||||
tag="Blog single"
|
||||
bgimg={BGImg}
|
||||
/>
|
||||
)}
|
||||
|
||||
{brdcum.b3 &&
|
||||
<Bredcrumb
|
||||
no={3}
|
||||
title="Blog details"
|
||||
tag="Blog single" />}
|
||||
{brdcum.b3 && <Bredcrumb no={3} title="Blog details" tag="Blog single" />}
|
||||
|
||||
{brdcum.b4 &&
|
||||
<Bredcrumb
|
||||
no={4}
|
||||
title="Blog details"
|
||||
tag="Blog single"
|
||||
bgimg={BGImg2}/>}
|
||||
{brdcum.b4 && (
|
||||
<Bredcrumb
|
||||
no={4}
|
||||
title="Blog details"
|
||||
tag="Blog single"
|
||||
bgimg={BGImg2}
|
||||
/>
|
||||
)}
|
||||
|
||||
<section className="blog_detail_section">
|
||||
<div className="container">
|
||||
<div className="blog_inner_pannel">
|
||||
<div className="review">
|
||||
<span>Review</span>
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="section_title">
|
||||
<h2>Top rated app of the year!</h2>
|
||||
</div>
|
||||
<div className="main_img">
|
||||
<img src="assets/images/blog_detail_main.png" alt="image" />
|
||||
</div>
|
||||
<div className="info">
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting in dustry lorem Ipsum has been the industrys standard dummy text ev er since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic Lorem Ipsum is simply dummy text of the printing and typesettingindustry lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived.</p>
|
||||
<p>Printing and typesetting in dustry lorem Ipsum has been the industrys standard dummy text ev er since the 1500s, when an unnown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic Lorem Ipsum is simply dummy text of the printing and typesettingindustry lorem Ipsum has been the industrys centuries, but also the leap into electronic.</p>
|
||||
<h3>Why we are best</h3>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting in dustry lorem Ipsum has been the industrys standard dummy text ev er since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic.</p>
|
||||
<ul>
|
||||
<li><p> <span className="icon"><i className="icofont-check-circled"></i></span> Lorem Ipsum is simply dummy text of the printing and typesetting in </p></li>
|
||||
<li><p> <span className="icon"><i className="icofont-check-circled"></i></span> Dustry lorem Ipsum has been the industrys standard dummy text ev er since the when</p></li>
|
||||
<li><p> <span className="icon"><i className="icofont-check-circled"></i></span> Unknown printer took a galley of type and scrambled it to make.</p></li>
|
||||
<li><p> <span className="icon"><i className="icofont-check-circled"></i></span> Type specimen book. It has survived not only five centuries, but also the leap into electronic.</p></li>
|
||||
<li><p> <span className="icon"><i className="icofont-check-circled"></i></span> Lorem Ipsum is simply dummy text of the printing.</p></li>
|
||||
<li><p> <span className="icon"><i className="icofont-check-circled"></i></span> Dustry lorem Ipsum has been the industrys standard dummy text ev er since.</p></li>
|
||||
<li><p> <span className="icon"><i className="icofont-check-circled"></i></span> Unknown printer took a galley of type and scrambled it to make.</p></li>
|
||||
<li><p> <span className="icon"><i className="icofont-check-circled"></i></span> Type specimen book. It has survived not only.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="two_img">
|
||||
<div className="row">
|
||||
<div className="col-md-6">
|
||||
<img src="assets/images/blog_sub_01.png" alt="image" />
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<img src="assets/images/blog_sub_02.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="info">
|
||||
<h3>Why we are best</h3>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting in dustry lorem Ipsum has been the industrys standard dummy text ev er since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic Lorem Ipsum is simply dummy text of the printing and typesettingindustry lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived.</p>
|
||||
</div>
|
||||
<div className="quote_block">
|
||||
<span className="q_icon"><img src="assets/images/quote_icon.png" alt="image" /></span>
|
||||
<h2>Lorem Ipsum is simply dummy text of the printing and typesetting in dustry lorem Ipsum has been the industrys standard dummy.</h2>
|
||||
<p><span className="name">Mr. John Doe,</span> Apper Inc</p>
|
||||
</div>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting in dustry lorem Ipsum has been the industrys standard dummy text ev er since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic industry.</p>
|
||||
<div className="blog_authore">
|
||||
<div className="authore_info">
|
||||
<div className="avtar">
|
||||
<img src="assets/images/blog_d02.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h3>By: John Dow</h3>
|
||||
<span>July 25, 2022</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="social_media">
|
||||
<ul>
|
||||
<li><Link to="#"><i className="icofont-facebook"></i></Link></li>
|
||||
<li><Link to="#"><i className="icofont-twitter"></i></Link></li>
|
||||
<li><Link to="#"><i className="icofont-instagram"></i></Link></li>
|
||||
<li><Link to="#"><i className="icofont-pinterest"></i></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="blog_tags">
|
||||
<ul>
|
||||
<li className="tags"><p>Tags:</p></li>
|
||||
<li><span>app,</span></li>
|
||||
<li><span>rating,</span></li>
|
||||
<li><span>development</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<section className="blog_detail_section">
|
||||
<div className="container">
|
||||
<div className="blog_inner_pannel">
|
||||
<div className="review">
|
||||
<span>Review</span>
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
</section>
|
||||
<section className="row_am comment_section">
|
||||
<div className="container">
|
||||
<div className="section_title">
|
||||
<h2>3 Comments</h2>
|
||||
<div className="section_title">
|
||||
<h2>Top rated app of the year!</h2>
|
||||
</div>
|
||||
<div className="main_img">
|
||||
<img src="assets/images/blog_detail_main.png" alt="image" />
|
||||
</div>
|
||||
<div className="info">
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting
|
||||
in dustry lorem Ipsum has been the industrys standard dummy text
|
||||
ev er since the 1500s, when an unknown printer took a galley of
|
||||
type and scrambled it to make a type specimen book. It has
|
||||
survived not only five centuries, but also the leap into
|
||||
electronic Lorem Ipsum is simply dummy text of the printing and
|
||||
typesettingindustry lorem Ipsum has been the industrys standard
|
||||
dummy text ever since the 1500s, when an unknown printer took a
|
||||
galley of type and scrambled it to make a type specimen book. It
|
||||
has survived.
|
||||
</p>
|
||||
<p>
|
||||
Printing and typesetting in dustry lorem Ipsum has been the
|
||||
industrys standard dummy text ev er since the 1500s, when an
|
||||
unnown printer took a galley of type and scrambled it to make a
|
||||
type specimen book. It has survived not only five centuries, but
|
||||
also the leap into electronic Lorem Ipsum is simply dummy text
|
||||
of the printing and typesettingindustry lorem Ipsum has been the
|
||||
industrys centuries, but also the leap into electronic.
|
||||
</p>
|
||||
<h3>Why we are best</h3>
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting
|
||||
in dustry lorem Ipsum has been the industrys standard dummy text
|
||||
ev er since the 1500s, when an unknown printer took a galley of
|
||||
type and scrambled it to make a type specimen book. It has
|
||||
survived not only five centuries, but also the leap into
|
||||
electronic.
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
<p>
|
||||
{" "}
|
||||
<span className="icon">
|
||||
<i className="icofont-check-circled"></i>
|
||||
</span>{" "}
|
||||
Lorem Ipsum is simply dummy text of the printing and
|
||||
typesetting in{" "}
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
{" "}
|
||||
<span className="icon">
|
||||
<i className="icofont-check-circled"></i>
|
||||
</span>{" "}
|
||||
Dustry lorem Ipsum has been the industrys standard dummy
|
||||
text ev er since the when
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
{" "}
|
||||
<span className="icon">
|
||||
<i className="icofont-check-circled"></i>
|
||||
</span>{" "}
|
||||
Unknown printer took a galley of type and scrambled it to
|
||||
make.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
{" "}
|
||||
<span className="icon">
|
||||
<i className="icofont-check-circled"></i>
|
||||
</span>{" "}
|
||||
Type specimen book. It has survived not only five centuries,
|
||||
but also the leap into electronic.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
{" "}
|
||||
<span className="icon">
|
||||
<i className="icofont-check-circled"></i>
|
||||
</span>{" "}
|
||||
Lorem Ipsum is simply dummy text of the printing.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
{" "}
|
||||
<span className="icon">
|
||||
<i className="icofont-check-circled"></i>
|
||||
</span>{" "}
|
||||
Dustry lorem Ipsum has been the industrys standard dummy
|
||||
text ev er since.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
{" "}
|
||||
<span className="icon">
|
||||
<i className="icofont-check-circled"></i>
|
||||
</span>{" "}
|
||||
Unknown printer took a galley of type and scrambled it to
|
||||
make.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
{" "}
|
||||
<span className="icon">
|
||||
<i className="icofont-check-circled"></i>
|
||||
</span>{" "}
|
||||
Type specimen book. It has survived not only.
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="two_img">
|
||||
<div className="row">
|
||||
<div className="col-md-6">
|
||||
<img src="assets/images/blog_sub_01.png" alt="image" />
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<img src="assets/images/blog_sub_02.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="info">
|
||||
<h3>Why we are best</h3>
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting
|
||||
in dustry lorem Ipsum has been the industrys standard dummy text
|
||||
ev er since the 1500s, when an unknown printer took a galley of
|
||||
type and scrambled it to make a type specimen book. It has
|
||||
survived not only five centuries, but also the leap into
|
||||
electronic Lorem Ipsum is simply dummy text of the printing and
|
||||
typesettingindustry lorem Ipsum has been the industrys standard
|
||||
dummy text ever since the 1500s, when an unknown printer took a
|
||||
galley of type and scrambled it to make a type specimen book. It
|
||||
has survived.
|
||||
</p>
|
||||
</div>
|
||||
<div className="quote_block">
|
||||
<span className="q_icon">
|
||||
<img src="assets/images/quote_icon.png" alt="image" />
|
||||
</span>
|
||||
<h2>
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting
|
||||
in dustry lorem Ipsum has been the industrys standard dummy.
|
||||
</h2>
|
||||
<p>
|
||||
<span className="name">Mr. John Doe,</span> Apper Inc
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting
|
||||
in dustry lorem Ipsum has been the industrys standard dummy text
|
||||
ev er since the 1500s, when an unknown printer took a galley of
|
||||
type and scrambled it to make a type specimen book. It has
|
||||
survived not only five centuries, but also the leap into
|
||||
electronic industry.
|
||||
</p>
|
||||
<div className="blog_authore">
|
||||
<div className="authore_info">
|
||||
<div className="avtar">
|
||||
<img src="assets/images/blog_d02.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h3>By: John Dow</h3>
|
||||
<span>July 25, 2022</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="social_media">
|
||||
<ul>
|
||||
<li>
|
||||
<div className="authore_info">
|
||||
<div className="avtar">
|
||||
<img src="assets/images/blog_d01.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<span>30 min ago</span>
|
||||
<h4>Dolly Shell</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="comment">
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting in dustry lorem Ipsum has been the in
|
||||
dustrys standard dummy text ev er since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen. </p>
|
||||
</div>
|
||||
</li>
|
||||
<li className="replay_comment">
|
||||
<div className="authore_info">
|
||||
<div className="avtar">
|
||||
<img src="assets/images/blog_d02.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<span>15 min ago</span>
|
||||
<h4>Devil Joe</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="comment">
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting in dustry lorem Ipsum has been the industrys standard dummy text ev er since the when.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div className="authore_info">
|
||||
<div className="avtar">
|
||||
<img src="assets/images/blog_d03.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<span>2 days ago</span>
|
||||
<h4>Sherly Shie</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="comment">
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting in dustry lorem Ipsum has been the in
|
||||
dustrys standard dummy text ev er since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen. </p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="#">
|
||||
<i className="icofont-facebook"></i>
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="#">
|
||||
<i className="icofont-twitter"></i>
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="#">
|
||||
<i className="icofont-instagram"></i>
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="#">
|
||||
<i className="icofont-pinterest"></i>
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<div className="blog_tags">
|
||||
<ul>
|
||||
<li className="tags">
|
||||
<p>Tags:</p>
|
||||
</li>
|
||||
<li>
|
||||
<span>app,</span>
|
||||
</li>
|
||||
<li>
|
||||
<span>rating,</span>
|
||||
</li>
|
||||
<li>
|
||||
<span>development</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section className="row_am comment_section">
|
||||
<div className="container">
|
||||
<div className="section_title">
|
||||
<h2>3 Comments</h2>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<div className="authore_info">
|
||||
<div className="avtar">
|
||||
<img src="assets/images/blog_d01.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<span>30 min ago</span>
|
||||
<h4>Dolly Shell</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="comment">
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and
|
||||
typesetting in dustry lorem Ipsum has been the in dustrys
|
||||
standard dummy text ev er since the 1500s, when an unknown
|
||||
printer took a galley of type and scrambled it to make a type
|
||||
specimen.{" "}
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<li className="replay_comment">
|
||||
<div className="authore_info">
|
||||
<div className="avtar">
|
||||
<img src="assets/images/blog_d02.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<span>15 min ago</span>
|
||||
<h4>Devil Joe</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="comment">
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and
|
||||
typesetting in dustry lorem Ipsum has been the industrys
|
||||
standard dummy text ev er since the when.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div className="authore_info">
|
||||
<div className="avtar">
|
||||
<img src="assets/images/blog_d03.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<span>2 days ago</span>
|
||||
<h4>Sherly Shie</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="comment">
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and
|
||||
typesetting in dustry lorem Ipsum has been the in dustrys
|
||||
standard dummy text ev er since the 1500s, when an unknown
|
||||
printer took a galley of type and scrambled it to make a type
|
||||
specimen.{" "}
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="row_am comment_form_section">
|
||||
<div className="container">
|
||||
<div className="section_title">
|
||||
<h2>Leave a <span>comment</span></h2>
|
||||
<p>Your email address will not be published. Required fields are marked *</p>
|
||||
<section className="row_am comment_form_section">
|
||||
<div className="container">
|
||||
<div className="section_title">
|
||||
<h2>
|
||||
Leave a <span>comment</span>
|
||||
</h2>
|
||||
<p>
|
||||
Your email address will not be published. Required fields are
|
||||
marked *
|
||||
</p>
|
||||
</div>
|
||||
<form action="">
|
||||
<div className="row">
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
placeholder="Name *"
|
||||
/>
|
||||
</div>
|
||||
<form action="">
|
||||
<div className="row">
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<input type="text" className="form-control" placeholder="Name *" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<input type="email" className="form-control" placeholder="Email *" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<input type="text" className="form-control" placeholder="Phone" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<input type="text" className="form-control" placeholder="Website " />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<div className="form-group">
|
||||
<textarea className="form-control" placeholder="Comments"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12 text-center">
|
||||
<button className="btn puprple_btn" type="submit">POST COMMENTS</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="email"
|
||||
className="form-control"
|
||||
placeholder="Email *"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
placeholder="Phone"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
placeholder="Website "
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<div className="form-group">
|
||||
<textarea
|
||||
className="form-control"
|
||||
placeholder="Comments"
|
||||
></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12 text-center">
|
||||
<button className="btn puprple_btn" type="submit">
|
||||
POST COMMENTS
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="row_am latest_story" id="blog">
|
||||
<div className="container">
|
||||
<div className="section_title" data-aos="fade-in" data-aos-duration="1500" data-aos-delay="100">
|
||||
<h2>Read latest <span>story</span></h2>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe standard dummy.</p>
|
||||
<section className="row_am latest_story" id="blog">
|
||||
<div className="container">
|
||||
<div
|
||||
className="section_title"
|
||||
data-aos="fade-in"
|
||||
data-aos-duration="1500"
|
||||
data-aos-delay="100"
|
||||
>
|
||||
<h2>
|
||||
Read latest <span>story</span>
|
||||
</h2>
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and typese tting{" "}
|
||||
<br /> indus orem Ipsum has beenthe standard dummy.
|
||||
</p>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div
|
||||
className="story_box"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1500"
|
||||
>
|
||||
<div className="story_img">
|
||||
<img src="assets/images/story01.png" alt="image" />
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="assets/images/story01.png" alt="image" />
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Cool features added!</h3>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typesetting
|
||||
industry lorem Ipsum has.</p>
|
||||
<Link to="#">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="assets/images/story02.png" alt="image" />
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Top rated app! Yupp.</h3>
|
||||
<p>Simply dummy text of the printing and typesetting industry lorem Ipsum has Lorem Ipsum is.</p>
|
||||
<Link to="#">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="story_img">
|
||||
<img src="assets/images/story03.png" alt="image" />
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Creative ideas on app.</h3>
|
||||
<p>Printing and typesetting industry lorem Ipsum has Lorem simply dummy text of the.</p>
|
||||
<Link to="#">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Cool features added!</h3>
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and
|
||||
typesetting industry lorem Ipsum has.
|
||||
</p>
|
||||
<Link to="#">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<div className="col-md-4">
|
||||
<div
|
||||
className="story_box"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1500"
|
||||
>
|
||||
<div className="story_img">
|
||||
<img src="assets/images/story02.png" alt="image" />
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Top rated app! Yupp.</h3>
|
||||
<p>
|
||||
Simply dummy text of the printing and typesetting industry
|
||||
lorem Ipsum has Lorem Ipsum is.
|
||||
</p>
|
||||
<Link to="#">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div
|
||||
className="story_box"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration="1500"
|
||||
>
|
||||
<div className="story_img">
|
||||
<img src="assets/images/story03.png" alt="image" />
|
||||
<span>45 min ago</span>
|
||||
</div>
|
||||
<div className="story_text">
|
||||
<h3>Creative ideas on app.</h3>
|
||||
<p>
|
||||
Printing and typesetting industry lorem Ipsum has Lorem
|
||||
simply dummy text of the.
|
||||
</p>
|
||||
<Link to="#">READ MORE</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
)
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
export default Main
|
||||
export default Main;
|
||||
|
||||
+4
-1
@@ -84,7 +84,10 @@ const Routing = () => {
|
||||
<Route path="/sign-up" element={<SignUp />} />
|
||||
<Route path="/pricing" element={<Pricing brdcum={brdcum} />} />
|
||||
<Route path="/blog" element={<Blog brdcum={brdcum} />} />
|
||||
<Route path="/blog-single" element={<BlogSingle brdcum={brdcum} />} />
|
||||
<Route
|
||||
path="/blog-single/:id"
|
||||
element={<BlogSingle brdcum={brdcum} />}
|
||||
/>
|
||||
<Route path="/terms" element={<Terms brdcum={brdcum} />} />
|
||||
<Route path="/privacy" element={<Privacy brdcum={brdcum} />} />
|
||||
</Routes>
|
||||
|
||||
Vendored
+8
-8
@@ -5,25 +5,25 @@ class SiteService {
|
||||
constructor() {
|
||||
console.log("Er are here anyway");
|
||||
}
|
||||
blogData() {
|
||||
return this.getAuxEnd("blogdata", null);
|
||||
blogData(id = "") {
|
||||
return this.getAuxEnd(`/blogdata${id ? "/" + id : ""}`, null);
|
||||
}
|
||||
|
||||
countryData() {}
|
||||
|
||||
faqData() {}
|
||||
|
||||
|
||||
//---------------------------------------- -----
|
||||
//---------------------------------------- -----
|
||||
// Unified call below
|
||||
// Unified call below
|
||||
//---------------------------------------- -----
|
||||
//---------------------------------------- -----
|
||||
getAuxEnd(uri, reqData) {
|
||||
const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
|
||||
Axios.get(endPoint)
|
||||
return Axios.get(endPoint)
|
||||
.then((response) => {
|
||||
console.log(response);
|
||||
res = response;
|
||||
// console.log(response);
|
||||
// res = response;
|
||||
console.log("~~~~~~~ Toks2 GET ~~~~~~~~");
|
||||
return response;
|
||||
})
|
||||
@@ -41,7 +41,7 @@ class SiteService {
|
||||
});
|
||||
}
|
||||
|
||||
getAuxEnd(uri, reqData) {
|
||||
postAuxEnd(uri, reqData) {
|
||||
const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
|
||||
Axios.post(endPoint)
|
||||
.then((response) => {
|
||||
|
||||
Reference in New Issue
Block a user