Revert "update and implement SkipLink"

This reverts commit e0e51c8.

Author: wackerow

src/components/SkipLink.tsx

@@ -1,21 +1,19 @@
-import { useTranslation } from "next-i18next"
+import React from "react"
 import { Box } from "@chakra-ui/react"
 
-import { MAIN_CONTENT_ID } from "@/lib/constants"
+import { BaseLink } from "../components/Link"
 
-import { Button } from "./Buttons"
+import Translation from "./Translation"
 
-export const SkipLink = () => {
-  const { t } = useTranslation("common")
+export interface IProps {
+  hrefId: string
+}
 
-  const handleNavigate = () => {
-    document?.getElementById(MAIN_CONTENT_ID)?.focus()
-  }
+export const SkipLink: React.FC<IProps> = ({ hrefId }) => {
   return (
     <Box bg="primary.base">
-      <Button
-        h="8"
-        onClick={handleNavigate}
+      <BaseLink
+        href={hrefId}
         lineHeight="taller"
         position="absolute"
         top="-12"
@@ -25,8 +23,8 @@ export const SkipLink = () => {
         _hover={{ textDecoration: "none" }}
         _focus={{ position: "static" }}
       >
-        {t("skip-to-main-content")}
-      </Button>
+        <Translation id="skip-to-main-content" />
+      </BaseLink>
     </Box>
   )
 }

src/layouts/RootLayout.tsx

@@ -9,7 +9,6 @@ import { Root } from "@/lib/interfaces"
 import FeedbackWidget from "@/components/FeedbackWidget"
 import Footer from "@/components/Footer"
 import Nav from "@/components/Nav"
-import { SkipLink } from "@/components/SkipLink"
 import TranslationBanner from "@/components/TranslationBanner"
 import TranslationBannerLegal from "@/components/TranslationBannerLegal"
 
@@ -46,8 +45,6 @@ export const RootLayout = ({
 
   return (
     <Container mx="auto" maxW={oldTheme.variables.maxPageWidth}>
-      <SkipLink />
-
       <Nav path={asPath} />
 
       <TranslationBanner

tsconfig.json

@@ -89,6 +89,7 @@
     "./src/components/SideNavMobile.tsx",
     "./src/components/SimpleTable.tsx",
     "./src/components/Simulator",
+    "./src/components/SkipLink.tsx",
     "./src/components/Slider/Slider.stories.tsx",
     "./src/components/Slider/index.tsx",
     "./src/components/StablecoinAccordion/AccordionCustomItem.tsx",