diff --git a/frontend/public/src/components/AnonymousMenu.js b/frontend/public/src/components/AnonymousMenu.js
index 7c52d4120b..585a675b36 100644
--- a/frontend/public/src/components/AnonymousMenu.js
+++ b/frontend/public/src/components/AnonymousMenu.js
@@ -13,6 +13,15 @@ type Props = {
const AnonymousMenu = ({ mobileView }: Props) => {
const identifierPostfix = mobileView ? "Mobile" : "Desktop"
const newDesign = checkFeatureFlag("mitxonline-new-header", "anonymousUser")
+ const makeNavLink = (text: string) => {
+ return mobileView ? (
+
+ {text}
+
+ ) : (
+ text
+ )
+ }
return (
{newDesign ? (
@@ -23,9 +32,7 @@ const AnonymousMenu = ({ mobileView }: Props) => {
className="top-nav-link"
aria-label="Catalog"
>
-
- Catalog
-
+ {makeNavLink("Catalog")}
) : null}
@@ -36,9 +43,7 @@ const AnonymousMenu = ({ mobileView }: Props) => {
className="simple"
aria-label="Sign In"
>
-
- Sign In
-
+ {makeNavLink("Sign In")}
-
@@ -48,9 +53,7 @@ const AnonymousMenu = ({ mobileView }: Props) => {
className="simple button"
aria-label="Create Account"
>
-
- Create Account
-
+ {makeNavLink("Create Account")}
diff --git a/frontend/public/src/components/UserMenu.js b/frontend/public/src/components/UserMenu.js
index f4b6bc39dd..dd50724d9a 100644
--- a/frontend/public/src/components/UserMenu.js
+++ b/frontend/public/src/components/UserMenu.js
@@ -46,6 +46,15 @@ const UserMenu = ({ currentUser, useScreenOverlay }: Props) => {
"mitxonline-new-header",
currentUser && currentUser.id ? currentUser.id : "anonymousUser"
)
+ const makeNavLink = (text: string) => {
+ return useScreenOverlay ? (
+
+ {text}
+
+ ) : (
+ text
+ )
+ }
menuChildProps = useScreenOverlay
? {
li: overlayListItemProps,
@@ -78,39 +87,29 @@ const UserMenu = ({ currentUser, useScreenOverlay }: Props) => {
>
-
- Profile
-
+ {makeNavLink("Profile")}
{showNewDesign && useScreenOverlay ? (
-
- Catalog
-
+ {makeNavLink("Catalog")}
) : null}
-
- Dashboard
-
+ {makeNavLink("Dashboard")}
-
- Account
-
+ {makeNavLink("Account")}
-
- Order History
-
+ {makeNavLink("Order History")}