From 091d9e53ceed9fdc9d969e1443b1106c2204c02a Mon Sep 17 00:00:00 2001 From: "albina.zemskova" Date: Fri, 14 May 2021 13:36:11 +0300 Subject: [PATCH 1/2] Create blog section ui/ux --- src/components/Footer/Footer.js | 9 ++++ src/components/Header/menuItems.js | 4 ++ src/components/Sidebar/Sidebar.js | 2 +- src/pages/index.js | 4 ++ src/sections/landing1/Blog.js | 53 +++++++++++++++++++++++ src/sections/landing1/Content1Version2.js | 6 +-- 6 files changed, 74 insertions(+), 4 deletions(-) create mode 100644 src/sections/landing1/Blog.js diff --git a/src/components/Footer/Footer.js b/src/components/Footer/Footer.js index 7cab316..3b75120 100644 --- a/src/components/Footer/Footer.js +++ b/src/components/Footer/Footer.js @@ -129,6 +129,15 @@ const Footer = ({ isDark = true }) => { + +
+ + + Blog + + +
+ {/*
diff --git a/src/components/Header/menuItems.js b/src/components/Header/menuItems.js index 1d37711..035a495 100644 --- a/src/components/Header/menuItems.js +++ b/src/components/Header/menuItems.js @@ -30,6 +30,10 @@ export const menuItems = [ name: "where-we-donate", label: "Where we Donate", }, + { + name: "blog", + label: "Blog", + }, // { // name: "how-to-buy", // label: "How to Buy", diff --git a/src/components/Sidebar/Sidebar.js b/src/components/Sidebar/Sidebar.js index a8620dd..64a095f 100644 --- a/src/components/Sidebar/Sidebar.js +++ b/src/components/Sidebar/Sidebar.js @@ -4,7 +4,7 @@ import Link from "next/link"; import { Title, Text, Box, Span } from "../Core"; export const CardSidebar = ({ children, ...rest }) => ( - + {children} ); diff --git a/src/pages/index.js b/src/pages/index.js index 83b0044..89d5552 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -4,6 +4,7 @@ import WhyApes from "../sections/landing1/Content1"; import Tokenomics from "../sections/landing2/Feature1"; import MeetTheDeveloper from "../sections/landing1/Content2"; import WhereWeDonate from "../sections/landing1/Content1Version2"; +import Blog from "../sections/landing1/Blog"; import PageWrapper from "../components/PageWrapper"; const LandingPage4 = () => { @@ -25,6 +26,9 @@ const LandingPage4 = () => {
+
+ +
{/*
*/} diff --git a/src/sections/landing1/Blog.js b/src/sections/landing1/Blog.js new file mode 100644 index 0000000..e5edc33 --- /dev/null +++ b/src/sections/landing1/Blog.js @@ -0,0 +1,53 @@ +import React from "react"; +import { Container, Row, Col } from "react-bootstrap"; + +import {Box, Section} from "../../components/Core"; + +import BlogList from "../blog/BlogListSidebar"; +import Sidebar from "../blog/Sidebar"; +import imgL1FeatureCurve from "../../assets/image/svg/swish-bottom-black.svg"; +import styled from "styled-components"; + +const ShapeBottmRight = styled(Box)` + position: absolute; + bottom: -3px; + left: -5px; + width: calc(100vw + 10px); + img { + min-width: 100%; + } +`; + +const Blog = () => ( + <> +
+ + + + + + + + + + + + + +
+ +) +export default Blog; diff --git a/src/sections/landing1/Content1Version2.js b/src/sections/landing1/Content1Version2.js index 4816fd1..df80430 100644 --- a/src/sections/landing1/Content1Version2.js +++ b/src/sections/landing1/Content1Version2.js @@ -41,9 +41,9 @@ const Content1 = () => ( <> {/* */}
- - - + {/**/} + {/* */} + {/**/} From f09541470f406829e0b2ed33a83db3562b908666 Mon Sep 17 00:00:00 2001 From: "albina.zemskova" Date: Thu, 20 May 2021 18:02:23 +0300 Subject: [PATCH 2/2] Add specific blog page --- src/components/PostCard/PostCard.js | 2 +- src/pages/blog/[postId].js | 55 +++++++++++++++++++++++ src/sections/blog/PostDetails.js | 2 +- src/sections/landing1/Content1Version2.js | 15 ------- 4 files changed, 57 insertions(+), 17 deletions(-) create mode 100644 src/pages/blog/[postId].js diff --git a/src/components/PostCard/PostCard.js b/src/components/PostCard/PostCard.js index ecc5707..995c460 100644 --- a/src/components/PostCard/PostCard.js +++ b/src/components/PostCard/PostCard.js @@ -115,7 +115,7 @@ const PostCard = ({ {readMore && ( - + Continue Reading diff --git a/src/pages/blog/[postId].js b/src/pages/blog/[postId].js new file mode 100644 index 0000000..45dac71 --- /dev/null +++ b/src/pages/blog/[postId].js @@ -0,0 +1,55 @@ +import React from "react"; +import Link from "next/link"; +import { Container, Row, Col } from "react-bootstrap"; + +import { Section, Title, Text, Box } from "../../components/Core"; + +import PostDetails from "../../sections/blog/PostDetails"; +import Comments from "../../sections/blog/Comments"; +import Sidebar from "../../sections/blog/Sidebar"; + +const BlogDetails = () => ( + <> +
+
+ + + + + How To Blow Through Capital{" "} + <br className="d-none d-lg-block" /> At An Incredible Rate + + + + + Jan 14, 2020 + + + + + Technology + + + + + David Jones + + + + + + + + + + + + + + + +
+ +); + +export default BlogDetails; diff --git a/src/sections/blog/PostDetails.js b/src/sections/blog/PostDetails.js index bf98233..23b171c 100644 --- a/src/sections/blog/PostDetails.js +++ b/src/sections/blog/PostDetails.js @@ -138,7 +138,7 @@ const PostDetails = () => (

- + Freelance Design Earning diff --git a/src/sections/landing1/Content1Version2.js b/src/sections/landing1/Content1Version2.js index df80430..f8c8d3d 100644 --- a/src/sections/landing1/Content1Version2.js +++ b/src/sections/landing1/Content1Version2.js @@ -3,21 +3,9 @@ import styled from "styled-components"; import { Container, Row, Col } from "react-bootstrap"; import { Title, Button, Section, Box, Text } from "../../components/Core"; -import { device, theme } from "../../utils"; import ape2Image from "../../assets/image/png/ape-2.png"; -import imgL1FeatureCurve from "../../assets/image/svg/swish-bottom-black.svg"; import cfga from "../../assets/image/svg/cfga.svg"; -const ShapeBottmRight = styled(Box)` - position: absolute; - bottom: -3px; - left: -5px; - width: calc(100vw + 10px); - img { - min-width: 100%; - } -`; - const Logo = styled.img` position: absolute; bottom: 20px; @@ -41,9 +29,6 @@ const Content1 = () => ( <> {/* */}
- {/**/} - {/* */} - {/**/}