Skip to content

Commit 2e80ec5

Browse files
Param-HarrisonParam-Harrison
committed
feat: buy now functionality using stripe
1 parent 491813a commit 2e80ec5

File tree

7 files changed

+99
-61
lines changed

7 files changed

+99
-61
lines changed

‎src/components/footer.js‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
import React from "react";
2-
import { Link } from "gatsby";
32
import { Box, Flex, Text } from "@chakra-ui/core";
43
import styled from "@emotion/styled";
54

6-
const StyledLink = styled(Link)`
5+
import { StyledLink } from "./shared";
6+
7+
const FooterLink = styled(StyledLink)`
78
text-decoration: none;
8-
margin-left: 10px;
9+
margin-left: 16px;
910
`;
1011

1112
const Footer = () => {
@@ -14,15 +15,15 @@ const Footer = () => {
1415
<Flex width="100%" maxW="720px" m="0 auto" alignItems="center">
1516
<Box>
1617
<Text as="span">© {new Date().getFullYear()} </Text>
17-
<Text as="span" color="yellow.400">
18+
<Text as="span" color="red.400">
1819
learnwithparam.com
1920
</Text>
2021
</Box>
2122
<Box as="nav" ml="auto">
22-
<StyledLink to="/support/terms-and-conditions">
23+
<FooterLink to="/support/terms-and-conditions">
2324
Terms and Conditions
24-
</StyledLink>
25-
<StyledLink to="/support/privacy-policy">Privacy policy</StyledLink>
25+
</FooterLink>
26+
<FooterLink to="/support/privacy-policy">Privacy policy</FooterLink>
2627
</Box>
2728
</Flex>
2829
</Box>

‎src/components/shared.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1+
import React from "react";
12
import { Link } from "gatsby";
23
import styled from "@emotion/styled";
4+
import { Flex, Box } from "@chakra-ui/core";
35

46
export const StyledLink = styled(Link)`
57
color: ${props => `${props.theme.colors.yellow[400]}`};
@@ -8,3 +10,29 @@ export const StyledLink = styled(Link)`
810
color: ${props => `${props.theme.colors.yellow[600]}`};
911
}
1012
`;
13+
14+
export const StyledAnchor = styled.a`
15+
color: ${props => `${props.theme.colors.yellow[400]}`};
16+
text-decoration: underline;
17+
&:hover {
18+
color: ${props => `${props.theme.colors.yellow[600]}`};
19+
}
20+
`;
21+
22+
export const HeroContainer = ({ children, ...props }) => {
23+
return (
24+
<Flex
25+
as="section"
26+
maxW="720px"
27+
minH="calc(100vh - 190px)"
28+
mx="auto"
29+
my="3"
30+
p="3"
31+
alignItems="center"
32+
>
33+
<Box {...props} maxW="600px" my="60px" mx="auto">
34+
{children}
35+
</Box>
36+
</Flex>
37+
);
38+
};

‎src/pages/about.js‎

Lines changed: 31 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
import React from "react";
22
import { useStaticQuery, graphql } from "gatsby";
3+
import { Heading, Text } from "@chakra-ui/core";
34

45
import Layout from "../components/layout";
56
import SEO from "../components/seo";
7+
import { StyledAnchor, HeroContainer } from "../components/shared";
68

79
const AboutPage = () => {
810
const data = useStaticQuery(graphql`
@@ -21,20 +23,35 @@ const AboutPage = () => {
2123
return (
2224
<Layout>
2325
<SEO title="About" />
24-
<h1>About</h1>
25-
<p>
26-
We are Eco Shop selling the merchandise for{" "}
27-
<a rel="noopener noreferrer" href={siteUrl} target="_blank">
28-
Learn with Param
29-
</a>
30-
</p>
31-
<p>
32-
You can reach me out in{" "}
33-
<a rel="noopener noreferrer" href={twitterUrl} target="_blank">
34-
twitter
35-
</a>
36-
</p>
37-
<p>Site created by {author}</p>
26+
<HeroContainer>
27+
<Heading as="h2" fontSize="2xl" textTransform="uppercase" mb="3">
28+
About
29+
</Heading>
30+
<Text>
31+
We are Eco Shop selling the merchandise for{" "}
32+
<StyledAnchor
33+
rel="noopener noreferrer"
34+
href={siteUrl}
35+
target="_blank"
36+
>
37+
Learn with Param
38+
</StyledAnchor>
39+
</Text>
40+
<Text>
41+
You can reach me out in{" "}
42+
<StyledAnchor
43+
rel="noopener noreferrer"
44+
href={twitterUrl}
45+
target="_blank"
46+
>
47+
twitter
48+
</StyledAnchor>
49+
</Text>
50+
<Text>
51+
Site created by
52+
{author}
53+
</Text>
54+
</HeroContainer>
3855
</Layout>
3956
);
4057
};

‎src/pages/cancel.js‎

Lines changed: 8 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,19 @@
11
import React from "react";
2-
import { Flex, Box, Heading } from "@chakra-ui/core";
2+
import { Heading } from "@chakra-ui/core";
33

44
import Layout from "../components/layout";
55
import SEO from "../components/seo";
6-
import { StyledLink } from "../components/shared";
6+
import { StyledLink, HeroContainer } from "../components/shared";
77

88
const CancelPage = () => (
99
<Layout>
1010
<SEO title="Order Cancelled" />
11-
<Flex
12-
as="section"
13-
maxW="720px"
14-
minH="calc(100vh - 190px)"
15-
mx="auto"
16-
my="3"
17-
p="3"
18-
alignItems="center"
19-
>
20-
<Box textAlign="center" maxW="600px" my="60px" mx="auto">
21-
<Heading as="h2" fontSize="2xl" textTransform="uppercase" mb="3">
22-
You can check out our other products
23-
</Heading>
24-
<StyledLink to="/">Explore products</StyledLink>
25-
</Box>
26-
</Flex>
11+
<HeroContainer textAlign="center">
12+
<Heading as="h2" fontSize="2xl" textTransform="uppercase" mb="3">
13+
You can check out our other products
14+
</Heading>
15+
<StyledLink to="/">Explore products</StyledLink>
16+
</HeroContainer>
2717
</Layout>
2818
);
2919

‎src/pages/success.js‎

Lines changed: 8 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,19 @@
11
import React from "react";
2-
import { Flex, Box, Heading } from "@chakra-ui/core";
2+
import { Heading } from "@chakra-ui/core";
33

44
import Layout from "../components/layout";
55
import SEO from "../components/seo";
6-
import { StyledLink } from "../components/shared";
6+
import { StyledLink, HeroContainer } from "../components/shared";
77

88
const SuccessPage = () => (
99
<Layout>
1010
<SEO title="Order Successful" />
11-
<Flex
12-
as="section"
13-
maxW="720px"
14-
minH="calc(100vh - 190px)"
15-
mx="auto"
16-
my="3"
17-
p="3"
18-
alignItems="center"
19-
>
20-
<Box textAlign="center" maxW="600px" my="60px" mx="auto">
21-
<Heading as="h2" fontSize="2xl" textTransform="uppercase" mb="3">
22-
Order has been placed Successfully
23-
</Heading>
24-
<StyledLink to="/">Explore products</StyledLink>
25-
</Box>
26-
</Flex>
11+
<HeroContainer textAlign="center">
12+
<Heading as="h2" fontSize="2xl" textTransform="uppercase" mb="3">
13+
Order has been placed Successfully
14+
</Heading>
15+
<StyledLink to="/">Explore products</StyledLink>
16+
</HeroContainer>
2717
</Layout>
2818
);
2919

‎src/pages/support/privacy-policy.js‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,19 @@
11
import React from "react";
2+
import { Heading, Text } from "@chakra-ui/core";
23

34
import Layout from "../../components/layout";
45
import SEO from "../../components/seo";
6+
import { HeroContainer } from "../../components/shared";
57

68
const PrivacyPage = () => (
79
<Layout>
810
<SEO title="Privacy Policy" />
9-
<h1>Privacy policy</h1>
10-
<p>Privacy is a Myth!</p>
11+
<HeroContainer>
12+
<Heading as="h2" fontSize="2xl" textTransform="uppercase" mb="3">
13+
Privacy policy
14+
</Heading>
15+
<Text>Privacy is a Myth!</Text>
16+
</HeroContainer>
1117
</Layout>
1218
);
1319

‎src/pages/support/terms-and-conditions.js‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,19 @@
11
import React from "react";
2+
import { Heading, Text } from "@chakra-ui/core";
23

34
import Layout from "../../components/layout";
45
import SEO from "../../components/seo";
6+
import { HeroContainer } from "../../components/shared";
57

68
const TermsPage = () => (
79
<Layout>
810
<SEO title="Terms & Conditions" />
9-
<h1>Terms & Conditions</h1>
10-
<p>IT jobs are subjected to market risk!</p>
11+
<HeroContainer>
12+
<Heading as="h2" fontSize="2xl" textTransform="uppercase" mb="3">
13+
Terms & Conditions
14+
</Heading>
15+
<Text>IT jobs are subjected to market risk!</Text>
16+
</HeroContainer>
1117
</Layout>
1218
);
1319

0 commit comments

Comments
 (0)