diff --git a/src/assets/ENSLogoWithText.js b/src/assets/ENSLogoWithText.js
new file mode 100644
index 00000000..172a951c
--- /dev/null
+++ b/src/assets/ENSLogoWithText.js
@@ -0,0 +1,44 @@
+const getFillColor = (color) => {
+ if (color === 'blue') return '#5d83f6';
+
+ if (color === 'black') return '#011A25';
+
+ return color;
+};
+
+export function ENSLogo({ style }) {
+ const fill = getFillColor(style);
+
+ return (
+
+ );
+}
diff --git a/src/components/Logov2.js b/src/components/Logov2.js
index 14fdc3c3..b19b529f 100644
--- a/src/components/Logov2.js
+++ b/src/components/Logov2.js
@@ -1,7 +1,7 @@
import styled from '@emotion/styled';
import React from 'react';
-import { ENSLogo } from '../assets/ENSLogo';
+import { ENSLogo } from '../assets/ENSLogoWithText';
const LogoContainer = styled('div')`
width: 104px;
diff --git a/src/components/NavigationV3/Navigation.js b/src/components/NavigationV3/Navigation.js
index ce237c22..b2c9f1f8 100644
--- a/src/components/NavigationV3/Navigation.js
+++ b/src/components/NavigationV3/Navigation.js
@@ -1,60 +1,63 @@
-import React from "react"
-import styled, { css } from "styled-components"
-import { Link } from "gatsby"
-import Logo from "../Logov2"
-import { Typography, mq } from "@ensdomains/thorin_next"
+import { mq, Typography } from '@ensdomains/thorin_next';
+import { Link } from 'gatsby';
+import React from 'react';
+import styled, { css } from 'styled-components';
-import Hamburger from "./Hamburger"
+import Logo from '../Logov2';
+import Hamburger from './Hamburger';
const Nav = styled.nav(({ theme }) => [
- css`
- position: sticky;
- display: flex;
- justify-content: space-between;
- max-width: 940px;
- margin: 0 auto;
- padding: ${theme.space["6"]} ${theme.space["4"]};
- `,
- mq.md.min(css`
- padding: ${theme.space["10"]};
- `),
-])
+ css`
+ position: sticky;
+ display: flex;
+ justify-content: space-between;
+ max-width: 940px;
+ margin: 0 auto;
+ padding: ${theme.space['6']} ${theme.space['4']};
+ `,
+ mq.md.min(css`
+ padding: ${theme.space['10']};
+ `),
+]);
const NavRight = styled.div(
- ({ theme }) => css`
- display: flex;
- align-items: center;
- gap: ${theme.space[5]};
- `
-)
+ ({ theme }) => css`
+ display: flex;
+ align-items: center;
+ gap: ${theme.space[5]};
+ `
+);
-const StyledLink = styled(Link)(({ theme }) => css`
- color: ${theme.colors.greyPrimary};
- transition: color 0.2s;
- &:hover {
- color: ${theme.colors.accentPrimary};
- }
-`)
+const StyledLink = styled(Link)(
+ ({ theme }) => css`
+ color: ${theme.colors.greyPrimary};
+ transition: color 0.2s;
+ cursor: pointer;
+ &:hover {
+ color: ${theme.colors.accentPrimary};
+ }
+ `
+);
export default function Navigation() {
- return (
-
- )
+ return (
+
+ );
}
diff --git a/src/pages/roadmap.js b/src/pages/roadmap.js
index b0a60426..76cc54bb 100644
--- a/src/pages/roadmap.js
+++ b/src/pages/roadmap.js
@@ -24,8 +24,6 @@ const Content = styled.div(({ theme }) => [
`),
]);
-export { Head } from '../components/Head';
-
export default function Roadmap(properties) {
return (