Merge pull request #209 from cisagov/rsc-fix-sidenav-hashlink

Fix RSC Side Nav hash-links
cisagov · Apr 30, 2024 · 9398d85 · 9398d85
2 parents 32caf68 + 19e62d7
commit 9398d85
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 19 deletions.
diff --git a/frontend/src/components/ReadySetCyber/FloatingNav.tsx b/frontend/src/components/ReadySetCyber/FloatingNav.tsx
@@ -70,18 +70,16 @@ export const FloatingNav: React.FC<Props> = ({ categories }) => {
       >
         {categories.map((category, index) => (
           <div key={index}>
-            <MenuItem onClick={handleClose}>
-              <HashLink
-                style={{
-                  textDecoration: 'none',
-                  color: 'black',
-                  outline: 'none'
-                }}
-                to={`#${category.name}`}
-              >
-                {category.name}
-              </HashLink>
-            </MenuItem>
+            <HashLink
+              style={{
+                textDecoration: 'none',
+                color: 'black',
+                outline: 'none'
+              }}
+              to={`#${category.name}`}
+            >
+              <MenuItem onClick={handleClose}>{category.name}</MenuItem>
+            </HashLink>
             <Divider />
           </div>
         ))}

diff --git a/frontend/src/components/ReadySetCyber/RSCNavItem.tsx b/frontend/src/components/ReadySetCyber/RSCNavItem.tsx
@@ -9,13 +9,17 @@ export const RSCNavItem: React.FC<Props> = (props) => {
   const { name } = props;
 
   return (
-    <ListItemButton divider style={{ outline: 'none' }}>
-      <HashLink
-        style={{ textDecoration: 'none', color: 'black', outline: 'none' }}
-        to={`#${name}`}
-      >
+    <HashLink
+      style={{
+        textDecoration: 'none',
+        color: 'black',
+        outline: 'none'
+      }}
+      to={`#${name}`}
+    >
+      <ListItemButton divider style={{ outline: 'none' }}>
         {name}
-      </HashLink>
-    </ListItemButton>
+      </ListItemButton>
+    </HashLink>
   );
 };