From 717e4c99e241c310cf7e0491e5884c81233da88e Mon Sep 17 00:00:00 2001
From: Fran McDade <franmcdade@Frans-MacBook-Pro.local>
Date: Fri, 20 Sep 2024 12:02:43 +1000
Subject: [PATCH] feat: brc analytics home page hero link text (#85)

---
 .../components/Questions/questions.styles.ts     |  2 --
 .../components/SectionHelp/sectionHelp.styles.ts |  2 --
 .../Home/components/Section/section.styles.ts    | 12 ------------
 app/components/Home/content/sectionSubHero.mdx   |  2 +-
 pages/index.tsx                                  | 16 ++++++++++++++++
 5 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/app/components/Home/components/Section/components/SectionHelp/components/Questions/questions.styles.ts b/app/components/Home/components/Section/components/SectionHelp/components/Questions/questions.styles.ts
index 2896901..b3e0276 100644
--- a/app/components/Home/components/Section/components/SectionHelp/components/Questions/questions.styles.ts
+++ b/app/components/Home/components/Section/components/SectionHelp/components/Questions/questions.styles.ts
@@ -8,7 +8,6 @@ import { elevation01 } from "@databiosphere/findable-ui/lib/theme/common/shadows
 import styled from "@emotion/styled";
 import { Accordion as MAccordion } from "@mui/material";
 import { sectionGrid } from "../../../../../../../Layout/components/AppLayout/components/Section/section.styles";
-import { muiLink } from "../../../../section.styles";
 
 export const Grid = styled.div`
   ${sectionGrid};
@@ -22,7 +21,6 @@ export const Grid = styled.div`
 `;
 
 export const StyledAccordion = styled(MAccordion)`
-  ${muiLink};
   box-shadow: ${elevation01} !important;
   display: grid;
   grid-column: 1 / -1;
diff --git a/app/components/Home/components/Section/components/SectionHelp/sectionHelp.styles.ts b/app/components/Home/components/Section/components/SectionHelp/sectionHelp.styles.ts
index 5351303..f4a3d9f 100644
--- a/app/components/Home/components/Section/components/SectionHelp/sectionHelp.styles.ts
+++ b/app/components/Home/components/Section/components/SectionHelp/sectionHelp.styles.ts
@@ -9,7 +9,6 @@ import {
   sectionLayout,
 } from "../../../../../Layout/components/AppLayout/components/Section/section.styles";
 import {
-  muiLink,
   SectionHeadline,
   SectionSubtitle,
   SectionTitle,
@@ -43,6 +42,5 @@ export const StyledSectionTitle = styled(SectionTitle)`
 `;
 
 export const StyledSectionSubTitle = styled(SectionSubtitle)`
-  ${muiLink};
   line-height: 28px;
 `;
diff --git a/app/components/Home/components/Section/section.styles.ts b/app/components/Home/components/Section/section.styles.ts
index 76ddcac..f0f2610 100644
--- a/app/components/Home/components/Section/section.styles.ts
+++ b/app/components/Home/components/Section/section.styles.ts
@@ -1,19 +1,7 @@
 import { inkLight } from "@databiosphere/findable-ui/lib/styles/common/mixins/colors";
 import { textBodyLarge400 } from "@databiosphere/findable-ui/lib/styles/common/mixins/fonts";
-import { css } from "@emotion/react";
 import styled from "@emotion/styled";
 
-export const muiLink = css`
-  .MuiLink-root {
-    color: #28285b;
-    text-decoration: underline;
-
-    &:hover {
-      text-decoration: none;
-    }
-  }
-`;
-
 export const SectionHeadline = styled.div`
   display: grid;
   gap: 16px;
diff --git a/app/components/Home/content/sectionSubHero.mdx b/app/components/Home/content/sectionSubHero.mdx
index c6b6129..df48a22 100644
--- a/app/components/Home/content/sectionSubHero.mdx
+++ b/app/components/Home/content/sectionSubHero.mdx
@@ -1,5 +1,5 @@
 BRC-Analytics is your new destination for analysis of biological
 data related to pathogens. Building on the legacy of VEuPathDb
 the platform will provide access and analysis capabilities for
-[785](/data/organisms) eukaryotic pathogens, hosts, and vectors. The functionality will
+[785 eukaryotic pathogens](/data/organisms), hosts, and vectors. The functionality will
 be developed and made available incrementally over the [following months](/roadmap).
diff --git a/pages/index.tsx b/pages/index.tsx
index 19d2c4d..cd6177e 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -12,6 +12,22 @@ export const getStaticProps: GetStaticProps = async () => {
     props: {
       pageTitle: "BRC Analytics",
       themeOptions: {
+        components: {
+          MuiLink: {
+            styleOverrides: {
+              root: {
+                color: "#28285b",
+                textDecoration: "underline",
+                textDecorationSkipInk: "none",
+                textUnderlinePosition: "from-font",
+                // eslint-disable-next-line sort-keys -- disabling key order for readability
+                "&:hover": {
+                  textDecoration: "none",
+                },
+              },
+            },
+          },
+        },
         palette: {
           background: { default: smokeLightest },
         },