diff --git a/src/components/UI/icons/DiscordIcon.tsx b/src/components/UI/icons/DiscordIcon.tsx
new file mode 100644
index 0000000000..cea1987697
--- /dev/null
+++ b/src/components/UI/icons/DiscordIcon.tsx
@@ -0,0 +1,11 @@
+import { createIcon } from '@chakra-ui/icons';
+
+export const DiscordIcon = createIcon({
+ displayName: 'DiscordIcon',
+ viewBox:"0 0 32 24",
+ path: (
+
+ )
+});
\ No newline at end of file
diff --git a/src/components/UI/icons/GitHubIcon.tsx b/src/components/UI/icons/GitHubIcon.tsx
new file mode 100644
index 0000000000..42d2da8667
--- /dev/null
+++ b/src/components/UI/icons/GitHubIcon.tsx
@@ -0,0 +1,11 @@
+import { createIcon } from '@chakra-ui/icons';
+
+export const GitHubIcon = createIcon({
+ displayName: 'GitHubIcon',
+ viewBox:"0 0 26 24",
+ path: (
+
+ )
+});
\ No newline at end of file
diff --git a/src/components/UI/icons/TwitterIcon.tsx b/src/components/UI/icons/TwitterIcon.tsx
new file mode 100644
index 0000000000..c544ba6041
--- /dev/null
+++ b/src/components/UI/icons/TwitterIcon.tsx
@@ -0,0 +1,11 @@
+import { createIcon } from '@chakra-ui/icons';
+
+export const TwitterIcon = createIcon({
+ displayName: 'TwitterIcon',
+ viewBox:"0 0 28 22",
+ path: (
+
+ )
+});
\ No newline at end of file
diff --git a/src/components/UI/icons/index.ts b/src/components/UI/icons/index.ts
index 8f0d249008..9759dcea9b 100644
--- a/src/components/UI/icons/index.ts
+++ b/src/components/UI/icons/index.ts
@@ -1,3 +1,6 @@
+export * from './DiscordIcon'
+export * from './GitHubIcon'
export * from './HamburguerIcon';
export * from './LensIcon';
export * from './MoonIcon';
+export * from './TwitterIcon'
diff --git a/src/components/layouts/Footer.tsx b/src/components/layouts/Footer.tsx
new file mode 100644
index 0000000000..557dd31ea5
--- /dev/null
+++ b/src/components/layouts/Footer.tsx
@@ -0,0 +1,179 @@
+import { Flex, Link, Stack, Text } from '@chakra-ui/react';
+import { FC } from 'react';
+import NextLink from 'next/link';
+
+import {
+ DOCS_PAGE,
+ DOWNLOADS_PAGE,
+ GETH_DISCORD_URL,
+ GETH_REPO_URL,
+ GETH_TWITTER_URL
+} from '../../constants'
+
+import {
+ DiscordIcon,
+ GitHubIcon,
+ TwitterIcon
+} from '../UI/icons';
+
+export const Footer: FC = () => {
+ return (
+
+
+
+
+
+ DOWNLOADS
+
+
+
+
+
+
+ DOCUMENTATION
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ © 2013–2022. The go-ethereum Authors.
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/components/layouts/Layout.tsx b/src/components/layouts/Layout.tsx
index ac9844526e..b37103c187 100644
--- a/src/components/layouts/Layout.tsx
+++ b/src/components/layouts/Layout.tsx
@@ -1,7 +1,10 @@
+// Libraries
import { Container } from '@chakra-ui/react';
import { FC } from 'react';
+// Components
import { Header } from '../UI';
+import { Footer } from './Footer'
interface Props {
children?: React.ReactNode;
@@ -13,6 +16,8 @@ export const Layout: FC = ({ children }) => {
{children}
+
+
);
};
diff --git a/src/constants.ts b/src/constants.ts
index 4151f8cf4f..274b4fae6e 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -9,6 +9,8 @@ export const ETHEREUM_ORG_URL = 'https://ethereum.org';
export const ETHEREUM_ORG_RUN_A_NODE_URL = 'https://ethereum.org/en/run-a-node/';
export const ETHEREUM_FOUNDATION_URL = 'https://ethereum.foundation';
export const GETH_REPO_URL = 'https://github.com/ethereum/go-ethereum';
+export const GETH_TWITTER_URL = 'https://twitter.com/go_ethereum';
+export const GETH_DISCORD_URL = 'https://discord.com/invite/nthXNEv';
export const GO_URL = 'https://go.dev/';
// Downloads
diff --git a/src/theme/foundations/textStyles.ts b/src/theme/foundations/textStyles.ts
index 80cb84cebb..df3252d467 100644
--- a/src/theme/foundations/textStyles.ts
+++ b/src/theme/foundations/textStyles.ts
@@ -58,6 +58,12 @@ export const textStyles = {
fontSize: '13px',
fontFamily: '"Inter", sans-serif'
},
+ 'footer-text': {
+ fontFamily: '"Inter", sans-serif',
+ lineHeight: '22px',
+ fontWeight: 400,
+ fontSize: '12px'
+ },
'downloads-button-label': {
fontFamily: '"JetBrains Mono", monospace',
color: 'yellow.50',