Skip to content

N
NextJs-Blog
Commit e9b47e20 by Madhankumar
Options

single blog app

parent 9de61e99
Showing with 446 additions and 83 deletions
app/@header/page.js
'use client'; "use client";
import Header from "@components/base/header"; import Header from "@components/base/header";
import { useAppContext } from "@context/index"; import { useAppContext } from "@context/index";
export default function PageHeader() { export default function PageHeader() {
const { theme, toggleTheme } = useAppContext();
const { theme, setTheme } = useAppContext(); return (
<Header name="NewsBlog" currentTheme={theme} onThemeChange={toggleTheme} />
return( );
<Header name="NewsBlog" currentTheme={theme} onThemeChange={setTheme} /> }
)
}
\ No newline at end of file
app/globals.css
...@@ -55,9 +55,10 @@ body, ...@@ -55,9 +55,10 @@ body,
html { html {
padding: 0; padding: 0;
margin: 0; margin: 0;
scroll-behavior: smooth;
box-sizing: border-box; box-sizing: border-box;
background: var(--bg-color); background: var(--bg-color);
min-height: 100dvh; height: 100dvh;
max-width: 1920px; max-width: 1920px;
margin: 0 auto; margin: 0 auto;
color: #718096; color: #718096;
......
app/layout.js
import ThemeProvider from "@context/index"; import { ThemeProvider } from "@context/index";
import "./globals.css"; import "./globals.css";
export default function RootLayout({ children, header }) { export default function RootLayout({ children, header }) {
return ( return (
<ThemeProvider> <ThemeProvider>
<html lang="en"> <html en="lang">
{console.log("header", header)}
<body> <body>
{header} {header}
{children} {children}
</body> </body>
</html> </html>
</ThemeProvider> </ThemeProvider>
); );
......
app/loading.js
import React from "react"; import styles from "./loading.module.css";
const loading = () => { const loading = () => {
return <div>Loading ...</div>; return <h2 className={styles.loading}>Loading ...</h2>;
}; };
export default loading; export default loading;
app/loading.module.css 0 → 100644
.loading {
display: grid;
place-content: center;
}
app/not-found.js
import React from "react"; import styles from "./not-found.module.css";
const PageNotFound = () => { const PageNotFound = () => {
return ( return <h1 className={styles.notfound}>404 Not Found</h1>;
<div>
<h1>404 Not Found</h1>
</div>
);
}; };
export default PageNotFound; export default PageNotFound;
app/not-found.module.css 0 → 100644
.notfound {
display: grid;
place-content: center;
}
app/page.js
...@@ -2,8 +2,6 @@ import BlogLists from "@components/top-level/blog-lists"; ...@@ -2,8 +2,6 @@ import BlogLists from "@components/top-level/blog-lists";
import { getAllPosts } from "@lib/posts"; import { getAllPosts } from "@lib/posts";
const Home = () => { const Home = () => {
let blogs; let blogs;
const fetchAllBlogs = () => { const fetchAllBlogs = () => {
blogs = getAllPosts("posts"); blogs = getAllPosts("posts");
...@@ -13,6 +11,7 @@ const Home = () => { ...@@ -13,6 +11,7 @@ const Home = () => {
return ( return (
<div> <div>
<BlogLists <BlogLists
id={blogs?.id}
title={blogs?.title} title={blogs?.title}
description={blogs?.description} description={blogs?.description}
blogs={blogs} blogs={blogs}
......
app/singleblog/[id]/page.js 0 → 100644
import SingleBlog from "@components/top-level/single-blog";
import { getPostById } from "@lib/posts";
const SingleBlogApp = ({ params }) => {
let blog;
const fetchBlogsBySlug = () => {
try {
console.log("sdkjfh", params.id);
const blogPost = getPostById("posts", params.id);
blog = blogPost[0];
console.log("fjh", blog);
} catch (err) {
console.log("error", err.message);
}
};
fetchBlogsBySlug();
return (
<SingleBlog
title={blog.title}
publishedDate={blog.publishedDate}
author={blog.author}
category={blog.category}
blogImage={blog.blogImage}
readingTime={blog.readingTime}
categories={blog.categories}
markdown={blog.markdown}
/>
);
};
export default SingleBlogApp;
components/base/button/styles.module.css
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
font-weight: 500; font-weight: 500;
border-radius: 5px; border-radius: 5px;
cursor: pointer; cursor: pointer;
opacity: 1;
} }
.primary { .primary {
background-color: var(--primary-bgcolor); background-color: var(--primary-bgcolor);
...@@ -16,5 +17,5 @@ ...@@ -16,5 +17,5 @@
color: var(--secondary-color); color: var(--secondary-color);
} }
.disabled { .disabled {
opacity: 0.7; opacity: 0.9;
} }
components/base/card/card.stories.js
...@@ -6,6 +6,7 @@ export default { ...@@ -6,6 +6,7 @@ export default {
}; };
export const card = { export const card = {
args: { args: {
id: 1,
title: "How to get a perfect start for beginning runners", title: "How to get a perfect start for beginning runners",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
......
components/base/card/index.js
...@@ -5,6 +5,7 @@ import Icons from "@components/base/icons"; ...@@ -5,6 +5,7 @@ import Icons from "@components/base/icons";
import styles from "./styles.module.css"; import styles from "./styles.module.css";
const Card = ({ const Card = ({
id,
title, title,
description, description,
image, image,
...@@ -14,7 +15,7 @@ const Card = ({ ...@@ -14,7 +15,7 @@ const Card = ({
}) => { }) => {
return ( return (
<div className={styles.card}> <div className={styles.card}>
<Link href="#"> <Link href={`singleblog/${id}`}>
<Image <Image
className={styles.img} className={styles.img}
src={image.url} src={image.url}
......
components/base/header/index.js
...@@ -6,6 +6,7 @@ import PropTypes from "prop-types"; ...@@ -6,6 +6,7 @@ import PropTypes from "prop-types";
function Header({ name, currentTheme, onThemeChange }) { function Header({ name, currentTheme, onThemeChange }) {
const handleTheme = () => { const handleTheme = () => {
// currentTheme = currentTheme === "light" ? "dark" : "light";
onThemeChange(currentTheme); onThemeChange(currentTheme);
}; };
// const handleSearch = (value) => { // const handleSearch = (value) => {
......
components/base/header/styles.module.css
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
position: sticky; position: sticky;
top: 57px; top: 57px;
height: 179px; height: 179px;
z-index: 1000;
} }
.header .container { .header .container {
background-color: var(--card-bg); background-color: var(--card-bg);
......
components/top-level/blog-lists/blog-lists.stories.js
...@@ -10,6 +10,7 @@ export const blogLists = { ...@@ -10,6 +10,7 @@ export const blogLists = {
"Lorem ipsum dolor sit amet elit. Id quaerat amet ipsum sunt et quos dolorum", "Lorem ipsum dolor sit amet elit. Id quaerat amet ipsum sunt et quos dolorum",
blogs: [ blogs: [
{ {
id: 1,
title: "How to get perfect start for beginning runners", title: "How to get perfect start for beginning runners",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
...@@ -31,6 +32,7 @@ export const blogLists = { ...@@ -31,6 +32,7 @@ export const blogLists = {
readingTime: "1min", readingTime: "1min",
}, },
{ {
id: 2,
title: "Great tools to improve your personal blogging experience", title: "Great tools to improve your personal blogging experience",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
...@@ -53,6 +55,7 @@ export const blogLists = { ...@@ -53,6 +55,7 @@ export const blogLists = {
readingTime: "1min", readingTime: "1min",
}, },
{ {
id: 3,
title: "Blog Guide: How to Start a Personal blog on WordPress", title: "Blog Guide: How to Start a Personal blog on WordPress",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
...@@ -74,6 +77,7 @@ export const blogLists = { ...@@ -74,6 +77,7 @@ export const blogLists = {
readingTime: "1min", readingTime: "1min",
}, },
{ {
id: 4,
title: "The technical setup when starting a personal blog", title: "The technical setup when starting a personal blog",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
...@@ -94,6 +98,7 @@ export const blogLists = { ...@@ -94,6 +98,7 @@ export const blogLists = {
readingTime: "1min", readingTime: "1min",
}, },
{ {
id: 5,
title: "3 New outfit Formulas To Add to your Capsule Wardrobe", title: "3 New outfit Formulas To Add to your Capsule Wardrobe",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
...@@ -115,6 +120,7 @@ export const blogLists = { ...@@ -115,6 +120,7 @@ export const blogLists = {
readingTime: "1min", readingTime: "1min",
}, },
{ {
id: 6,
title: "3 New outfit Formulas To Add to your Capsule Wardrobe", title: "3 New outfit Formulas To Add to your Capsule Wardrobe",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
...@@ -135,6 +141,7 @@ export const blogLists = { ...@@ -135,6 +141,7 @@ export const blogLists = {
readingTime: "1min", readingTime: "1min",
}, },
{ {
id: 7,
title: "3 New outfit Formulas To Add to your Capsule Wardrobe", title: "3 New outfit Formulas To Add to your Capsule Wardrobe",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
...@@ -155,6 +162,7 @@ export const blogLists = { ...@@ -155,6 +162,7 @@ export const blogLists = {
readingTime: "1min", readingTime: "1min",
}, },
{ {
id: 8,
title: "3 New outfit Formulas To Add to your Capsule Wardrobe", title: "3 New outfit Formulas To Add to your Capsule Wardrobe",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
...@@ -175,6 +183,7 @@ export const blogLists = { ...@@ -175,6 +183,7 @@ export const blogLists = {
readingTime: "1min", readingTime: "1min",
}, },
{ {
id: 9,
title: "3 New outfit Formulas To Add to your Capsule Wardrobe", title: "3 New outfit Formulas To Add to your Capsule Wardrobe",
description: description:
"Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.", "Lorem ipsum dolor sit amet consectetur ipsum adipisicing elit. Quis vitae sit.",
......
components/top-level/blog-lists/styles.module.css
.blog-container { .blog-container {
max-width: 1200px; max-width: 1200px;
margin: 0 auto; margin: 0 auto;
margin-bottom: 2rem;
scroll-behavior: smooth;
} }
.blog-container .title { .blog-container .title {
font-size: 38px; font-size: 38px;
......
components/top-level/single-blog/index.js
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import Image from "next/image"; import Image from "next/image";
import ReactMarkdown from "react-markdown"; import ReactMarkdown from "react-markdown";
import remarkGfm from "remark-gfm"; import rehypeRaw from "rehype-raw";
import styles from "./styles.module.css"; import styles from "./styles.module.css";
function SingleBlog({ function SingleBlog({
title, title,
publishedDate, publishedDate,
author, author,
blogImage,
category, category,
readingTime, readingTime,
categories, categories,
...@@ -48,14 +49,14 @@ function SingleBlog({ ...@@ -48,14 +49,14 @@ function SingleBlog({
<div className={styles.blogimage}> <div className={styles.blogimage}>
<Image <Image
className={styles.img} className={styles.img}
src={author.image.url} src={blogImage.url}
alt={author.name} alt={author.name}
width={author.image.width} width={blogImage.width}
height={author.image.height} height={blogImage.height}
/> />
</div> </div>
<div className={styles["blog-content"]}> <div className={styles["blog-content"]}>
<ReactMarkdown remarkPlugins={[remarkGfm]}>{markdown}</ReactMarkdown> <ReactMarkdown rehypePlugins={[rehypeRaw]}>{markdown}</ReactMarkdown>
<div className={styles.tag}> <div className={styles.tag}>
<span>Tags:</span> <span>Tags:</span>
{categories.map((e, i) => ( {categories.map((e, i) => (
...@@ -73,12 +74,12 @@ SingleBlog.propTypes = { ...@@ -73,12 +74,12 @@ SingleBlog.propTypes = {
publishedDate: PropTypes.string, publishedDate: PropTypes.string,
author: { author: {
name: PropTypes.string, name: PropTypes.string,
image: PropTypes.shape({
url: PropTypes.string,
width: PropTypes.number,
height: PropTypes.number,
}),
}, },
blogImage: PropTypes.shape({
url: PropTypes.string,
width: PropTypes.number,
height: PropTypes.number,
}),
category: PropTypes.string, category: PropTypes.string,
readingTime: PropTypes.string, readingTime: PropTypes.string,
categories: PropTypes.array, categories: PropTypes.array,
......
components/top-level/single-blog/single-blog.stories.js
...@@ -9,11 +9,11 @@ export const singleBlog = { ...@@ -9,11 +9,11 @@ export const singleBlog = {
publishedDate: "July 11,2020", publishedDate: "July 11,2020",
author: { author: {
name: "Charlotte mia", name: "Charlotte mia",
image: { },
url: require("@img/blogsingle.jpg").default.src, blogImage: {
width: 1920, url: require("@img/blogsingle.jpg").default.src,
height: 500, width: 1920,
}, height: 500,
}, },
category: "Fashion", category: "Fashion",
......
components/top-level/single-blog/styles.module.css
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
background: var(--card-bg); background: var(--card-bg);
} }
.blog-content p, .blog-content p,
ol li { .blog-content ol li {
font-size: clamp(0.8rem, 2rem, 1.1rem); font-size: clamp(0.8rem, 2rem, 1.1rem);
} }
.blogimage { .blogimage {
...@@ -21,7 +21,7 @@ ol li { ...@@ -21,7 +21,7 @@ ol li {
object-fit: cover; object-fit: cover;
display: block; display: block;
} }
blockquote p { .blog-content blockquote p {
font-size: 20px; font-size: 20px;
} }
.blog-list ul { .blog-list ul {
...@@ -62,12 +62,12 @@ blockquote p { ...@@ -62,12 +62,12 @@ blockquote p {
background: #5a67d8; background: #5a67d8;
color: white; color: white;
} }
blockquote { .blog-content blockquote {
padding: 0.66001rem 1rem 1rem; padding: 0.66001rem 1rem 1rem;
border-left: 3px solid #5a67d8; border-left: 3px solid #5a67d8;
margin: 0; margin: 0;
} }
blockquote p::before { .blog-content blockquote p::before {
content: "\2014\00A0"; content: "\2014\00A0";
} }
.head-container { .head-container {
......
context/index.js
"use client"; "use client";
import { createContext, useContext, useState, useEffect } from "react"; import { createContext, useContext, useState, useEffect } from "react";
export const ThemeContext = createContext(); export const ThemeContext = createContext();
export const useAppContext = () => useContext(ThemeContext); export const useAppContext = () => useContext(ThemeContext);
export default function ThemeProvider({ children, ...props }) { export const ThemeProvider = ({ children }) => {
// State for theme
const [theme, setTheme] = useState("light"); const [theme, setTheme] = useState("light");
useEffect(() => { useEffect(() => {
handleThemeChange(); const storedTheme = localStorage.getItem("theme") || "light";
}, [theme]); setTheme(storedTheme);
document.documentElement.setAttribute("class", storedTheme);
// Function to handle theme changes }, []);
const handleThemeChange = () => {
const storedTheme = localStorage.getItem("theme");
if (!storedTheme) {
// Set default theme to light if not stored
setDefaultTheme();
} else {
// Set theme from storage
setThemeFromStorage(storedTheme);
}
};
// Function to set default theme to light
const setDefaultTheme = () => {
const defaultTheme = "light";
localStorage.setItem("theme", defaultTheme);
setThemeAndApplyClass(defaultTheme);
};
// Function to set theme from storage
const setThemeFromStorage = (storedTheme) => {
setThemeAndApplyClass(storedTheme);
};
// Function to set theme and apply class to document element const toggleTheme = () => {
const setThemeAndApplyClass = (newTheme) => { const newTheme = theme === "light" ? "dark" : "light";
localStorage.setItem("theme", newTheme); localStorage.setItem("theme", newTheme);
setTheme(newTheme); setTheme(newTheme);
document.documentElement.setAttribute("class", newTheme); document.documentElement.setAttribute("class", newTheme);
...@@ -47,8 +23,7 @@ export default function ThemeProvider({ children, ...props }) { ...@@ -47,8 +23,7 @@ export default function ThemeProvider({ children, ...props }) {
const contextValue = { const contextValue = {
theme, theme,
setTheme, toggleTheme,
...props,
}; };
return ( return (
...@@ -56,4 +31,4 @@ export default function ThemeProvider({ children, ...props }) { ...@@ -56,4 +31,4 @@ export default function ThemeProvider({ children, ...props }) {
{children} {children}
</ThemeContext.Provider> </ThemeContext.Provider>
); );
} };
lib/posts.js
...@@ -4,10 +4,28 @@ import matter from "gray-matter"; ...@@ -4,10 +4,28 @@ import matter from "gray-matter";
import { remark } from "remark"; import { remark } from "remark";
import html from "remark-html"; import html from "remark-html";
export const dbDirectory = (filePaths) => { export function getPostById(fileDirectory, slug) {
return path.join(process.cwd(), filePaths); const directory = path.join(process.cwd(), fileDirectory);
}; const fileNames = fs.readdirSync(directory);
const data = fileNames
.map((fileName) => {
const fullPath = path.join(fileDirectory, fileName);
const fileContents = fs.readFileSync(fullPath, "utf8");
const { data, content } = matter(fileContents);
const processedContent = remark()
.use(html)
.processSync(content)
.toString();
return {
markdown: processedContent,
...data,
};
})
.filter((e) => e.id == slug);
return data;
}
export function getAllPosts(fileDirectory) { export function getAllPosts(fileDirectory) {
const directory = path.join(process.cwd(), fileDirectory); const directory = path.join(process.cwd(), fileDirectory);
const fileNames = fs.readdirSync(directory); const fileNames = fs.readdirSync(directory);
......
package-lock.json
...@@ -22,6 +22,7 @@ ...@@ -22,6 +22,7 @@
"react-dom": "^18", "react-dom": "^18",
"react-icons": "^4.12.0", "react-icons": "^4.12.0",
"react-markdown": "^9.0.1", "react-markdown": "^9.0.1",
"rehype-raw": "^7.0.0",
"remark": "^15.0.1", "remark": "^15.0.1",
"remark-gfm": "^4.0.0", "remark-gfm": "^4.0.0",
"remark-html": "^16.0.1" "remark-html": "^16.0.1"
...@@ -15884,6 +15885,20 @@ ...@@ -15884,6 +15885,20 @@
"jsesc": "bin/jsesc" "jsesc": "bin/jsesc"
} }
}, },
"node_modules/rehype-raw": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/rehype-raw/-/rehype-raw-7.0.0.tgz",
"integrity": "sha512-/aE8hCfKlQeA8LmyeyQvQF3eBiLRGNlfBJEvWH7ivp9sBqs7TNqBL5X3v157rM4IFETqDnIOO+z5M/biZbo9Ww==",
"dependencies": {
"@types/hast": "^3.0.0",
"hast-util-raw": "^9.0.0",
"vfile": "^6.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/unified"
}
},
"node_modules/relateurl": { "node_modules/relateurl": {
"version": "0.2.7", "version": "0.2.7",
"resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz", "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
......
package.json
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
"react-dom": "^18", "react-dom": "^18",
"react-icons": "^4.12.0", "react-icons": "^4.12.0",
"react-markdown": "^9.0.1", "react-markdown": "^9.0.1",
"rehype-raw": "^7.0.0",
"remark": "^15.0.1", "remark": "^15.0.1",
"remark-gfm": "^4.0.0", "remark-gfm": "^4.0.0",
"remark-html": "^16.0.1" "remark-html": "^16.0.1"
......
posts/blog1.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
posts/blog2.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
posts/blog3.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
posts/blog4.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
posts/blog5.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
posts/blog6.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
posts/blog7.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
posts/blog8.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
posts/blog9.md
...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16" ...@@ -12,4 +12,38 @@ publishedDate: "2020-07-16"
readingTime: "1 min read" readingTime: "1 min read"
category: "Fashion" category: "Fashion"
categories: ["Fashion", "Beauty"] categories: ["Fashion", "Beauty"]
blogImage: { url: "/images/blogsingle.jpg", width: 1920, height: 500 }
--- ---
## How to create an Art that shows the beauty in everyone ideas of flaws.
Fusce faucibus ante vitae justo efficitur elementum.Donec et ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce
faucibus ante vitae justo efficitur sed et elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus arcu vitae justo efficitur elementum.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus
ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.
> ## For dull and lifeless skin, mix apple juice with honey. Apply a thin layer to your face, and leave it for 5 minutes.
>
> Kelvin edison
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo.ac purus semper.
Fusce faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu elementum..
## Fusce faucibus ante vitae justo efficitur
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu Donec ipsum faucibus ipsum arcu elementum ,luctus justo. ac purus semper.
1. Quisque sagittis lacus eu lorem sodalesd enean adipiscing.
2. Donec ipsum faucibus arcu elementum, luctus justo.
3. Nam libero tempore, cum soluta nobis est eligendi optio.
4. Sed ut perspiciatis unde omnis natus
## Quisque sagittis lacus eu lorem sodales
Lorem faucibus fusce ante vitae justo efficitur elementum.Donec ipsum faucibus arcu ipsum elementum ,luctus justo. ac purus semper.Fusce faucibus ante
vitae justo efficitur elementum.Donec et ipsum faucibus.Donec et ipsum faucibus arcu.
Fusce faucibus arcu faucibus ante vitae justo efficitur elementum.Donec ipsum faucibus.Donec ipsum faucibus arcu.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment