diff --git a/src/components/UI/Header.tsx b/src/components/UI/Header.tsx
index 2ff2b515b2..02cac559d6 100644
--- a/src/components/UI/Header.tsx
+++ b/src/components/UI/Header.tsx
@@ -19,13 +19,14 @@ export const Header: FC = () => {
justifyContent='space-between'
position='relative'
>
-
@@ -34,7 +35,22 @@ export const Header: FC = () => {
-
+
+
+ skip to content
+
+
+
{/* HEADER BUTTONS */}
@@ -58,6 +74,7 @@ export const Header: FC = () => {
bg: 'primary',
svg: { color: 'bg' }
}}
+ aria-label={`Toggle ${isDark ? 'light' : 'dark'} mode`}
>
{isDark ? : }
diff --git a/src/components/UI/docs/DocsNav.tsx b/src/components/UI/docs/DocsNav.tsx
index 91f8d37ce3..34874108c4 100644
--- a/src/components/UI/docs/DocsNav.tsx
+++ b/src/components/UI/docs/DocsNav.tsx
@@ -17,20 +17,24 @@ interface Props {
}
export const DocsNav: FC = ({ navLinks }) => {
- const [isMobileAccordionOpen, setMobileAccordionState] = useState(false)
+ const [isMobileAccordionOpen, setMobileAccordionState] = useState(false);
const toggleMobileAccordion = () => {
- setMobileAccordionState(prev => !prev)
- }
+ setMobileAccordionState(prev => !prev);
+ };
return (
-
+
-
+
= ({ navLinks }) => {
color: 'bg'
}}
>
-
- Documentation
-
+ Documentation
diff --git a/src/components/UI/docs/DocumentNav.tsx b/src/components/UI/docs/DocumentNav.tsx
index 564e2ad8df..cc999dd8be 100644
--- a/src/components/UI/docs/DocumentNav.tsx
+++ b/src/components/UI/docs/DocumentNav.tsx
@@ -20,10 +20,8 @@ export const DocumentNav: FC = ({ content }) => {
const activeHash = useActiveHash(parsedHeadings.map(heading => heading!.headingId));
return (
-
-
- on this page
-
+
+ on this page
{parsedHeadings.map((heading, idx) => {
return (
diff --git a/src/components/UI/docs/LinksList.tsx b/src/components/UI/docs/LinksList.tsx
index a86af010b4..72b9d15ea6 100644
--- a/src/components/UI/docs/LinksList.tsx
+++ b/src/components/UI/docs/LinksList.tsx
@@ -46,7 +46,7 @@ export const LinksList: FC = ({ links, toggleMobileAccordion })
- {items && }
+ {items && }
) : (
diff --git a/src/components/UI/docs/MDComponents.tsx b/src/components/UI/docs/MDComponents.tsx
index 4a9625f968..852ee781a3 100644
--- a/src/components/UI/docs/MDComponents.tsx
+++ b/src/components/UI/docs/MDComponents.tsx
@@ -15,7 +15,7 @@ import { Code, Note } from '.';
import { textStyles } from '../../../theme/foundations';
import { parseHeadingId } from '../../../utils/parseHeadingId';
-const { header1, header2, header3, header4 } = textStyles;
+const { h1, h2, h3, h4 } = textStyles;
const MDComponents = {
// paragraphs
@@ -45,7 +45,7 @@ const MDComponents = {
const { children: parsedChildren, headingId } = parseHeadingId(children);
return (
-
+
{parsedChildren}
);
@@ -59,7 +59,7 @@ const MDComponents = {
textAlign='start'
mt={{ base: '12 !important', md: '16 !important' }}
mb='4 !important'
- {...header2}
+ {...h2}
id={headingId}
>
{parsedChildren}
@@ -69,7 +69,7 @@ const MDComponents = {
h3: ({ children }: any) => {
const { children: parsedChildren, headingId } = parseHeadingId(children);
return (
-
+
{parsedChildren}
);
@@ -78,7 +78,7 @@ const MDComponents = {
const { children: parsedChildren, headingId } = parseHeadingId(children);
return (
-
+
{parsedChildren}
);
diff --git a/src/components/UI/icons/DiscordIcon.tsx b/src/components/UI/icons/DiscordIcon.tsx
index ca1f8f400b..4b0d88f6d6 100644
--- a/src/components/UI/icons/DiscordIcon.tsx
+++ b/src/components/UI/icons/DiscordIcon.tsx
@@ -4,6 +4,11 @@ export const DiscordIcon = createIcon({
displayName: 'DiscordIcon',
viewBox: '0 0 32 24',
path: (
-
+
)
});
diff --git a/src/components/UI/icons/GitHubIcon.tsx b/src/components/UI/icons/GitHubIcon.tsx
index a74f788c78..f93c60a1a1 100644
--- a/src/components/UI/icons/GitHubIcon.tsx
+++ b/src/components/UI/icons/GitHubIcon.tsx
@@ -4,6 +4,11 @@ export const GitHubIcon = createIcon({
displayName: 'GitHubIcon',
viewBox: '0 0 26 24',
path: (
-
+
)
});
diff --git a/src/components/UI/icons/HamburgerIcon.tsx b/src/components/UI/icons/HamburgerIcon.tsx
index 879fb072d0..404f1f0c5c 100644
--- a/src/components/UI/icons/HamburgerIcon.tsx
+++ b/src/components/UI/icons/HamburgerIcon.tsx
@@ -4,6 +4,11 @@ export const HamburgerIcon = createIcon({
displayName: 'HamburgerIcon',
viewBox: '0 0 22 14',
path: (
-
+
)
});
diff --git a/src/components/UI/icons/LensIcon.tsx b/src/components/UI/icons/LensIcon.tsx
index 9ab332e067..f6ef12008c 100644
--- a/src/components/UI/icons/LensIcon.tsx
+++ b/src/components/UI/icons/LensIcon.tsx
@@ -4,6 +4,11 @@ export const LensIcon = createIcon({
displayName: 'LensIcon',
viewBox: '0 0 17 18',
path: (
-
+
)
});
diff --git a/src/components/UI/icons/LinuxPenguin.tsx b/src/components/UI/icons/LinuxPenguin.tsx
index 2a6d36d1f6..26c85989fc 100644
--- a/src/components/UI/icons/LinuxPenguin.tsx
+++ b/src/components/UI/icons/LinuxPenguin.tsx
@@ -7,7 +7,12 @@ const Icon = createIcon({
displayName: 'LinuxPenguin',
viewBox: `0 0 ${w} ${h}`,
path: (
-
+
)
});
diff --git a/src/components/UI/icons/MacosLogo.tsx b/src/components/UI/icons/MacosLogo.tsx
index 89a4a6f79e..57d59091da 100644
--- a/src/components/UI/icons/MacosLogo.tsx
+++ b/src/components/UI/icons/MacosLogo.tsx
@@ -7,7 +7,12 @@ const Icon = createIcon({
displayName: 'MacosLogo',
viewBox: `0 0 ${w} ${h}`,
path: (
-
+
)
});
diff --git a/src/components/UI/icons/MoonIcon.tsx b/src/components/UI/icons/MoonIcon.tsx
index 765625acb8..bdc27c9247 100644
--- a/src/components/UI/icons/MoonIcon.tsx
+++ b/src/components/UI/icons/MoonIcon.tsx
@@ -4,6 +4,11 @@ export const MoonIcon = createIcon({
displayName: 'MoonIcon',
viewBox: '0 0 22 22',
path: (
-
+
)
});
diff --git a/src/components/UI/icons/SourceBranch.tsx b/src/components/UI/icons/SourceBranch.tsx
index 8c352e1cd3..ea73ad0b7a 100644
--- a/src/components/UI/icons/SourceBranch.tsx
+++ b/src/components/UI/icons/SourceBranch.tsx
@@ -7,7 +7,12 @@ const Icon = createIcon({
displayName: 'SourceBranch',
viewBox: `0 0 ${w} ${h}`,
path: (
-
+
)
});
diff --git a/src/components/UI/icons/SunIcon.tsx b/src/components/UI/icons/SunIcon.tsx
index 2555a5c128..bda950137d 100644
--- a/src/components/UI/icons/SunIcon.tsx
+++ b/src/components/UI/icons/SunIcon.tsx
@@ -4,6 +4,11 @@ export const SunIcon = createIcon({
displayName: 'SunIcon',
viewBox: '0 0 44 44',
path: (
-
+
)
});
diff --git a/src/components/UI/icons/TwitterIcon.tsx b/src/components/UI/icons/TwitterIcon.tsx
index be4aff8ef6..dfd5126416 100644
--- a/src/components/UI/icons/TwitterIcon.tsx
+++ b/src/components/UI/icons/TwitterIcon.tsx
@@ -4,6 +4,11 @@ export const TwitterIcon = createIcon({
displayName: 'TwitterIcon',
viewBox: '0 0 28 22',
path: (
-
+
)
});
diff --git a/src/components/UI/icons/WindowsLogo.tsx b/src/components/UI/icons/WindowsLogo.tsx
index aa94ebeb0b..844528f775 100644
--- a/src/components/UI/icons/WindowsLogo.tsx
+++ b/src/components/UI/icons/WindowsLogo.tsx
@@ -7,7 +7,12 @@ const Icon = createIcon({
displayName: 'WindowsLogo',
viewBox: `0 0 ${w} ${h}`,
path: (
-
+
)
});
diff --git a/src/components/UI/search/Search.tsx b/src/components/UI/search/Search.tsx
index 41a6b364cf..c6a7b3d9f3 100644
--- a/src/components/UI/search/Search.tsx
+++ b/src/components/UI/search/Search.tsx
@@ -21,10 +21,10 @@ export const Search: FC = () => {
>
diff --git a/src/components/layouts/MobileMenu.tsx b/src/components/layouts/MobileMenu.tsx
index 8dbc08e324..8805c3350c 100644
--- a/src/components/layouts/MobileMenu.tsx
+++ b/src/components/layouts/MobileMenu.tsx
@@ -20,6 +20,7 @@ export const MobileMenu: React.FC = () => {
color='primary'
_hover={{ bg: 'primary', color: 'bg' }}
onClick={onOpen}
+ aria-label='Open mobile menu'
>
diff --git a/src/pages/[...slug].tsx b/src/pages/[...slug].tsx
index 86380e3a38..e6026ae500 100644
--- a/src/pages/[...slug].tsx
+++ b/src/pages/[...slug].tsx
@@ -104,10 +104,10 @@ const DocPage: NextPage = ({ frontmatter, content, navLinks, lastModified
-
+
-
+
{frontmatter.title}
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
index 63b82cdf35..a28c91b28b 100644
--- a/src/pages/_document.tsx
+++ b/src/pages/_document.tsx
@@ -2,7 +2,7 @@ import { Html, Head, Main, NextScript } from 'next/document';
export default function Document() {
return (
-
+
{/* fonts are being loaded here to enable optimization (https://nextjs.org/docs/basic-features/font-optimization) */}
{/* JetBrains Mono */}
diff --git a/src/pages/downloads.tsx b/src/pages/downloads.tsx
index 720f3020ed..b77f2e6749 100644
--- a/src/pages/downloads.tsx
+++ b/src/pages/downloads.tsx
@@ -298,7 +298,7 @@ const DownloadsPage: NextPage = ({ data }) => {
<>
-
+
{
<>
-
+
@@ -44,7 +44,7 @@ const HomePage: NextPage = ({}) => {
>
Geth (go-ethereum) is a{' '}
-
+
Go
{' '}
implementation of{' '}
diff --git a/src/theme/foundations/textStyles.ts b/src/theme/foundations/textStyles.ts
index 64d1949408..e2e3b4e7f6 100644
--- a/src/theme/foundations/textStyles.ts
+++ b/src/theme/foundations/textStyles.ts
@@ -2,56 +2,41 @@ export const textStyles = {
h1: {
fontFamily: 'heading',
fontWeight: 700,
- fontSize: '2.75rem',
+ fontSize: { base: '2.175rem', md: '2.875rem' },
lineHeight: '3.375rem',
letterSpacing: { base: '0.03rem', md: '0.04rem' },
color: 'body'
},
h2: {
- fontFamily: 'heading',
- fontWeight: 400,
- fontSize: { base: '1.5rem', md: '1.75rem' },
- lineHeight: 'normal',
- letterSpacing: { base: '0.03rem', md: '0.04rem' },
- color: 'body'
- },
- header1: {
fontFamily: 'heading',
fontWeight: 700,
- fontSize: { base: '1.875rem', md: '2.125rem' },
- letterSpacing: { base: '0.03rem', md: '0.04rem' },
- lineHeight: 'normal',
- color: 'body'
- },
- header2: {
- fontFamily: 'heading',
fontSize: { base: '1.5rem', md: '1.75rem' },
- letterSpacing: { base: '0.03rem', md: '0.04rem' },
lineHeight: 'normal',
+ letterSpacing: { base: '0.03rem', md: '0.04rem' },
color: 'body'
},
- header3: {
+ h3: {
fontFamily: 'heading',
fontSize: { base: '1.25rem', md: '1.375rem' },
letterSpacing: { base: '0.03rem', md: '0.04rem' },
lineHeight: 'normal',
color: 'body'
},
- header4: {
+ h4: {
fontFamily: 'heading',
fontSize: '1.125rem',
letterSpacing: { base: '0.03rem', md: '0.04rem' },
lineHeight: 'normal',
color: 'body'
},
- header5: {
+ h5: {
fontFamily: 'heading',
fontSize: '1rem',
letterSpacing: '0.02rem',
lineHeight: 'normal',
color: 'body'
},
- header6: {
+ h6: {
fontFamily: 'heading',
fontSize: '0.875rem',
letterSpacing: '0.02rem',