From 216dbdf371b0d6b8ab999e67d0c83c802101a192 Mon Sep 17 00:00:00 2001 From: "CHIEFSOFT\\ameye" Date: Tue, 12 Sep 2023 08:32:55 -0400 Subject: [PATCH] blog components --- src/Routes.js | 10 ++- src/components/Blog/Blog.js | 67 +++++++++++++++++++ src/components/Blog/BlogDetail.js | 45 +++++++++++++ src/components/Blog/BlogSideBar.js | 102 +++++++++++++++++++++++++++++ src/components/Blog/Blogs.js | 96 +++++++++++++++++++++++++++ src/components/Blog/HeaderNews.js | 54 +++++++++++++++ src/components/Blog/HeroNews.js | 31 +++++++++ src/components/Blog/index.js | 42 ++++++++++++ 8 files changed, 444 insertions(+), 3 deletions(-) create mode 100644 src/components/Blog/Blog.js create mode 100644 src/components/Blog/BlogDetail.js create mode 100644 src/components/Blog/BlogSideBar.js create mode 100644 src/components/Blog/Blogs.js create mode 100644 src/components/Blog/HeaderNews.js create mode 100644 src/components/Blog/HeroNews.js create mode 100644 src/components/Blog/index.js diff --git a/src/Routes.js b/src/Routes.js index 054839f..326460b 100644 --- a/src/Routes.js +++ b/src/Routes.js @@ -14,6 +14,9 @@ import HomeOne from './components/HomeOne'; // import HomeThree from './components/HomeThree'; // import Hometwo from './components/HomeTwo'; import News from './components/News'; +import Blog from "./components/Blog"; +import BlogDetail from "./components/Blog/BlogDetail"; + import SingleNews from './components/News/SingleNews'; import Service from './components/Service'; import UseCases from './components/UseCases'; @@ -45,10 +48,11 @@ function Routes() { - - + {/**/} + + - + {/**/} diff --git a/src/components/Blog/Blog.js b/src/components/Blog/Blog.js new file mode 100644 index 0000000..91cce67 --- /dev/null +++ b/src/components/Blog/Blog.js @@ -0,0 +1,67 @@ +import React from 'react'; +import singlePost from '../../assets/images/single-post/1.jpg'; +import author from '../../assets/images/single-post/author.png'; +import cmnt1 from '../../assets/images/single-post/c1.png'; +import cmnt2 from '../../assets/images/single-post/c2.png'; +import cmnt3 from '../../assets/images/single-post/c3.png'; + +function Blog() { + return ( + <> +
+
+ +
+

Logotype Masterclass with Jessica Hische

+

+ Lost the plot morish bleeder absolutely bladdered my lady chinwag that bleeding + Eaton blag, cheeky bugger burke matie boy brown bread say pukka off his nut + sloshed mufty, squiffy show off show off pick your nose and blow off brolly bite + your arm off bloke bubble and squeak hotpot happy days. Old spiffing cras bugger + blimey chancer me old mucker vagabond you mug, amongst absolutely bladdered + spend a penny ruddy wellies he lost his bottle hanky panky up the kyver bender, + give us a bell my good sir car boot pear shaped young delinquent victoria sponge + tomfoolery. Lavatory knackered pukka chip shop a blinding shot cor blimey guvnor + bodge blower, barmy faff about cheeky nice one at public school. Have it down + the pub posh matie boy wind up hunky-dory, he lost his bottle the full monty + bugger all mate cheeky bugger cras chancer, absolutely bladdered amongst + tomfoolery pukka. Knackered +

+

+ James Bond old happy days the wireless cracking goal bloke me old mucker, arse + over tit blower mush the bee's knees chip shop the BBC, say lemon squeezy + blatant what a load of rubbish bog-standard nancy boy. Mush spiffing good time + brown bread cheeky bite your arm off chip shop bugger all mate, my lady down the + pub is faff about pukka. +

+
+

+ I don't want no agro brilliant are you taking the piss skive off super boot + chancer don't get shirty. +

+ Indigo Violet +
+

+ That faff about the full monty blower bubble and squeak cheeky old matie boy + burke, the bee's knees what a load of rubbish golly gosh mufty is Elizabeth + squiffy, lurgy chimney pot Jeffrey Richard naff Queen's English cheesed off. Old + bonnet cheesed off lurgy me old mucker a blinding shot bits and bobs lavatory + barney, say no biggie jolly good mush chancer pukka what a load of rubbish, + Harry don't get shirty with me arse over tit he lost his bottle spiffing good + time bubble and squeak say. I bog Harry a load of old tosh quaint brown bread + get stuffed mate bobby, lemon squeezy boot bum bag chimney pot codswallop + amongst, lavatory twit bits and bobs pardon you daft ummm I'm telling. Blatant + matie boy say bugger all mate butty gormless, you mug pukka happy days bobby. + Down the pub what a load of rubbish geeza faff about chancer bits and bobs daft + lavatory boot victoria sponge spend a penny grub ummm I'm telling, absolutely + bladdered A bit of how's your father arse over tit do one chimney pot tomfoolery + porkies owt to do with me spiffing good time zonked. +

+ +
+ + + ); +} + +export default Blog; diff --git a/src/components/Blog/BlogDetail.js b/src/components/Blog/BlogDetail.js new file mode 100644 index 0000000..19240a3 --- /dev/null +++ b/src/components/Blog/BlogDetail.js @@ -0,0 +1,45 @@ +import React from 'react'; +import useToggle from '../../Hooks/useToggle'; +import BackToTop from '../BackToTop'; +import FooterHomeOne from '../HomeOne/FooterHomeOne'; +import Drawer from '../Mobile/Drawer'; +import Blog from './Blog'; +import BlogSideBar from './BlogSideBar'; +import HeaderNews from './HeaderNews'; +import HeroNews from './HeroNews'; +import StickyHeaderNav from '../StickyHeader/StickyHeaderNav'; + +function BlogDetail() { + const [drawer, drawerAction] = useToggle(false); + return ( + <> + + {/* */} + + +
+
+
+
+ +
+
+ +
+
+
+
+ + + + ); +} + +export default BlogDetail; diff --git a/src/components/Blog/BlogSideBar.js b/src/components/Blog/BlogSideBar.js new file mode 100644 index 0000000..f50420a --- /dev/null +++ b/src/components/Blog/BlogSideBar.js @@ -0,0 +1,102 @@ +import React from 'react'; +import BlogImg1 from '../../assets/images/blog/p1.jpg'; +import BlogImg2 from '../../assets/images/blog/p2.jpg'; +import BlogImg3 from '../../assets/images/blog/p3.jpg'; +import BlogImg4 from '../../assets/images/blog/p4.jpg'; + +function BlogSideBar() { + return ( +
+ + + + {/**/} +
+ ); +} + +export default BlogSideBar; diff --git a/src/components/Blog/Blogs.js b/src/components/Blog/Blogs.js new file mode 100644 index 0000000..21e23d6 --- /dev/null +++ b/src/components/Blog/Blogs.js @@ -0,0 +1,96 @@ +import React, { useEffect, useState } from 'react'; +import blogOne from '../../assets/images/blog/1.jpg'; +import BlogData from '../../Services/BlogData'; + +function Blogs({pathname}) { + const [blogs, setBlogs] = useState([]) + + useEffect(()=>{ + BlogData().then(res => { + setBlogs(res.data) + }).catch(err => { + console.log('Error loading blogdata', err) + }) + },[]) + + return ( + <> +
+ { pathname == '/' ? // ON HOME PAGE LIMIT TO SIX(6) BLOGS + blogs?.blogdata?.map((i, index)=> { + var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }; + var postDt = new Date(i.post_date).toLocaleDateString("en-US", options); + var blgImg = i.meta_value != null ? `${blogs?.blogconfig?.media_url}/${i.meta_value}` : blogOne; + if(index < 6){ + return ( +
+
+
+ {i.post_title} +
+
+
+
    +
  • {postDt}
    • +
+
+

+ + {i.post_title} + +

+ + Learn More + +
+
+
+ ) + } + }) + : // ON OTHER PAGES SHOW ALL BLOG + blogs?.blogdata?.map((i, index)=> { + var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }; + var postDt = new Date(i.post_date).toLocaleDateString("en-US", options); + var blgImg = i.meta_value != null ? `${blogs?.blogconfig?.media_url}/${i.meta_value}` : blogOne; + return ( +
+
+
+ {i.post_title} +
+
+
+
    +
  • {postDt}
    • +
+
+

+ + {i.post_title} + +

+ + Learn More + +
+
+
+ ) + }) + } +
+ + + ); +} + +export default Blogs; diff --git a/src/components/Blog/HeaderNews.js b/src/components/Blog/HeaderNews.js new file mode 100644 index 0000000..3f55074 --- /dev/null +++ b/src/components/Blog/HeaderNews.js @@ -0,0 +1,54 @@ +import React, { useEffect } from 'react'; +import logo from '../../assets/images/wrenchboard-logo-text.png'; +import StickyMenu from '../../lib/StickyMenu'; +import Navigation from '../Navigation'; +import getConfig from './../../Config/config' + +function HeaderNews({ action }) { + var site = getConfig()[0]; + useEffect(() => { + StickyMenu(); + }); + return ( + <> +
+
+
+
+
+
+ + + +
+
+
+
+ +
+
+
+
+ + Login + + + Get Started + +
action(e)} + className="toggle-btn ml-30 canvas_open d-lg-none d-block" + > + +
+
+
+
+
+
+
+ + ); +} + +export default HeaderNews; diff --git a/src/components/Blog/HeroNews.js b/src/components/Blog/HeroNews.js new file mode 100644 index 0000000..01a849f --- /dev/null +++ b/src/components/Blog/HeroNews.js @@ -0,0 +1,31 @@ +import React from 'react'; +import { Link } from 'react-router-dom'; + +function HeroNews({ title, breadcrumb }) { + return ( + <> +
+
+
+
+
+

{title}

+ +
+
+
+
+
+ + ); +} + +export default HeroNews; diff --git a/src/components/Blog/index.js b/src/components/Blog/index.js new file mode 100644 index 0000000..2e12f9c --- /dev/null +++ b/src/components/Blog/index.js @@ -0,0 +1,42 @@ +import React from 'react'; +import useToggle from '../../Hooks/useToggle'; +import BackToTop from '../BackToTop'; +import FooterHomeOne from '../HomeOne/FooterHomeOne'; +import Drawer from '../Mobile/Drawer'; +import Blogs from './Blogs'; +import BlogSideBar from './BlogSideBar'; +import HeaderNews from './HeaderNews'; +import HeroNews from './HeroNews'; +import StickyHeaderNav from '../StickyHeader/StickyHeaderNav'; + +function Blog() { + const [drawer, drawerAction] = useToggle(false); + return ( + <> + + {/* */} + + +
+
+
+
+ +
+ +
+
+
+ + + + ); +} + +export default Blog;