diff --git a/web-ui/src/components/menu/Menu.css b/web-ui/src/components/menu/Menu.css
index ae3114177c..f1d48e1aae 100644
--- a/web-ui/src/components/menu/Menu.css
+++ b/web-ui/src/components/menu/Menu.css
@@ -87,6 +87,7 @@
     font-size: 14px;
   }
 
+  .Menu-listItem,
   .Menu-subListItem,
   .MuiListItem-root {
     color: var(--checkins-palette-primary-menuItem);
diff --git a/web-ui/src/components/menu/Menu.jsx b/web-ui/src/components/menu/Menu.jsx
index 90b2d5638a..cd696e2143 100644
--- a/web-ui/src/components/menu/Menu.jsx
+++ b/web-ui/src/components/menu/Menu.jsx
@@ -30,6 +30,7 @@ import {
   IconButton,
   List,
   ListItem,
+  ListItemButton,
   ListItemText,
   Modal,
   Toolbar
@@ -44,6 +45,7 @@ const classes = {
   menuButton: `${PREFIX}-menuButton`,
   drawerPaper: `${PREFIX}-drawerPaper`,
   content: `${PREFIX}-content`,
+  listItem: `${PREFIX}-listItem`,
   listStyle: `${PREFIX}-listStyle`,
   nested: `${PREFIX}-nested`,
   subListItem: `${PREFIX}-subListItem`
@@ -238,7 +240,7 @@ function Menu({ children }) {
 
   const createLinkJsx = (path, name, isSubLink) => {
     return (
-      <ListItem
+      <ListItemButton
         key={path}
         component={Link}
         to={path}
@@ -256,7 +258,7 @@ function Menu({ children }) {
           classes={isSubLink ? { primary: classes.subListItem } : null}
           primary={name}
         />
-      </ListItem>
+      </ListItemButton>
     );
   };
 
@@ -284,48 +286,57 @@ function Menu({ children }) {
 
       <List component="nav" className={classes.listStyle}>
         <div>
-          {createLinkJsx('/', 'HOME', false)}
+          <span className="Menu-listItem">
+            {createLinkJsx('/', 'HOME', false)}
+          </span>
           {isAdmin && (
             <>
-              <ListItem onClick={toggleAdmin} className={classes.listItem}>
+              <ListItemButton
+                onClick={toggleAdmin}
+                className={classes.listItem}
+              >
                 <ListItemText primary="ADMIN" />
-              </ListItem>
+              </ListItemButton>
               <Collapse in={adminOpen} timeout="auto" unmountOnExit>
                 {createListJsx(adminLinks, true)}
                 {isAdmin && (
-                  <ListItem
+                  <ListItemButton
+                    sx={{ pl: 4, py: 1.5 }}
                     className={classes.listItem}
                     onClick={openHoursUpload}
-                    style={{ marginLeft: '1rem' }}
                   >
                     Upload Hours
-                  </ListItem>
+                  </ListItemButton>
                 )}
               </Collapse>
             </>
           )}
-          {createLinkJsx('/checkins', 'CHECK-INS', false)}
-          <ListItem onClick={toggleDirectory} className={classes.listItem}>
+          <span className="Menu-listItem">
+            {createLinkJsx('/checkins', 'CHECK-INS', false)}
+          </span>
+          <ListItemButton
+            onClick={toggleDirectory}
+            className={classes.listItem}
+          >
             <ListItemText primary="DIRECTORY" />
-          </ListItem>
+          </ListItemButton>
           <Collapse in={directoryOpen} timeout="auto" unmountOnExit>
             {createListJsx(directoryLinks, true)}
           </Collapse>
-          <ListItem onClick={toggleFeedback} className={classes.listItem}>
+          <ListItemButton onClick={toggleFeedback} className={classes.listItem}>
             <ListItemText primary="FEEDBACK" />
-          </ListItem>
+          </ListItemButton>
           <Collapse in={feedbackOpen} timeout="auto" unmountOnExit>
             {createListJsx(feedbackLinks, true)}
           </Collapse>
           {hasReportPermission && (
             <React.Fragment>
-              <ListItem
-                button
+              <ListItemButton
                 onClick={toggleReports}
                 className={classes.listItem}
               >
                 <ListItemText primary="REPORTS" />
-              </ListItem>
+              </ListItemButton>
               <Collapse in={reportsOpen} timeout="auto" unmountOnExit>
                 {createListJsx(getReportLinks(), true)}
               </Collapse>
diff --git a/web-ui/src/components/menu/__snapshots__/Menu.test.jsx.snap b/web-ui/src/components/menu/__snapshots__/Menu.test.jsx.snap
index 8dd8aa5ae9..0bb7be9981 100644
--- a/web-ui/src/components/menu/__snapshots__/Menu.test.jsx.snap
+++ b/web-ui/src/components/menu/__snapshots__/Menu.test.jsx.snap
@@ -85,36 +85,54 @@ exports[`<Menu /> > renders correctly 1`] = `
               class="MuiList-root MuiList-padding Menu-listStyle css-h4y409-MuiList-root"
             >
               <div>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/"
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      HOME
-                    </span>
-                  </div>
-                </a>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/checkins"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        HOME
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/checkins"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      CHECK-INS
-                    </span>
-                  </div>
-                </a>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        CHECK-INS
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -125,7 +143,10 @@ exports[`<Menu /> > renders correctly 1`] = `
                       DIRECTORY
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
                 <div
                   class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
                   style="min-height: 0px;"
@@ -137,8 +158,9 @@ exports[`<Menu /> > renders correctly 1`] = `
                       class="MuiCollapse-wrapperInner MuiCollapse-vertical css-9l5vo-MuiCollapse-wrapperInner"
                     >
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Mui-selected Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters Mui-selected MuiListItemButton-root MuiListItemButton-gutters Mui-selected Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/guilds"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -149,10 +171,14 @@ exports[`<Menu /> > renders correctly 1`] = `
                             Guilds & Communities
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/people"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -163,10 +189,14 @@ exports[`<Menu /> > renders correctly 1`] = `
                             People
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/teams"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -177,12 +207,17 @@ exports[`<Menu /> > renders correctly 1`] = `
                             Teams
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                     </div>
                   </div>
                 </div>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -193,7 +228,10 @@ exports[`<Menu /> > renders correctly 1`] = `
                       FEEDBACK
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
               </div>
             </nav>
           </div>
@@ -224,36 +262,54 @@ exports[`<Menu /> > renders correctly 1`] = `
               class="MuiList-root MuiList-padding Menu-listStyle css-h4y409-MuiList-root"
             >
               <div>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/"
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      HOME
-                    </span>
-                  </div>
-                </a>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/checkins"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        HOME
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/checkins"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      CHECK-INS
-                    </span>
-                  </div>
-                </a>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        CHECK-INS
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -264,7 +320,10 @@ exports[`<Menu /> > renders correctly 1`] = `
                       DIRECTORY
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
                 <div
                   class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
                   style="min-height: 0px;"
@@ -276,8 +335,9 @@ exports[`<Menu /> > renders correctly 1`] = `
                       class="MuiCollapse-wrapperInner MuiCollapse-vertical css-9l5vo-MuiCollapse-wrapperInner"
                     >
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Mui-selected Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters Mui-selected MuiListItemButton-root MuiListItemButton-gutters Mui-selected Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/guilds"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -288,10 +348,14 @@ exports[`<Menu /> > renders correctly 1`] = `
                             Guilds & Communities
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/people"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -302,10 +366,14 @@ exports[`<Menu /> > renders correctly 1`] = `
                             People
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/teams"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -316,12 +384,17 @@ exports[`<Menu /> > renders correctly 1`] = `
                             Teams
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                     </div>
                   </div>
                 </div>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -332,7 +405,10 @@ exports[`<Menu /> > renders correctly 1`] = `
                       FEEDBACK
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
               </div>
             </nav>
           </div>
@@ -433,22 +509,32 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
               class="MuiList-root MuiList-padding Menu-listStyle css-h4y409-MuiList-root"
             >
               <div>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/"
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      HOME
-                    </span>
-                  </div>
-                </a>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        HOME
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -459,23 +545,36 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                       ADMIN
                     </span>
                   </div>
-                </li>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/checkins"
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/checkins"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      CHECK-INS
-                    </span>
-                  </div>
-                </a>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        CHECK-INS
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -486,7 +585,10 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                       DIRECTORY
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
                 <div
                   class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
                   style="min-height: 0px;"
@@ -498,8 +600,9 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                       class="MuiCollapse-wrapperInner MuiCollapse-vertical css-9l5vo-MuiCollapse-wrapperInner"
                     >
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Mui-selected Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters Mui-selected MuiListItemButton-root MuiListItemButton-gutters Mui-selected Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/guilds"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -510,10 +613,14 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                             Guilds & Communities
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/people"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -524,10 +631,14 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                             People
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/teams"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -538,12 +649,17 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                             Teams
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                     </div>
                   </div>
                 </div>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -554,9 +670,12 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                       FEEDBACK
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
                 <div
-                  class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                   role="button"
                   tabindex="0"
                 >
@@ -603,22 +722,32 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
               class="MuiList-root MuiList-padding Menu-listStyle css-h4y409-MuiList-root"
             >
               <div>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/"
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      HOME
-                    </span>
-                  </div>
-                </a>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        HOME
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -629,23 +758,36 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                       ADMIN
                     </span>
                   </div>
-                </li>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/checkins"
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/checkins"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      CHECK-INS
-                    </span>
-                  </div>
-                </a>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        CHECK-INS
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -656,7 +798,10 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                       DIRECTORY
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
                 <div
                   class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
                   style="min-height: 0px;"
@@ -668,8 +813,9 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                       class="MuiCollapse-wrapperInner MuiCollapse-vertical css-9l5vo-MuiCollapse-wrapperInner"
                     >
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Mui-selected Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters Mui-selected MuiListItemButton-root MuiListItemButton-gutters Mui-selected Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/guilds"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -680,10 +826,14 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                             Guilds & Communities
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/people"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -694,10 +844,14 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                             People
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/teams"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -708,12 +862,17 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                             Teams
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                     </div>
                   </div>
                 </div>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -724,9 +883,12 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
                       FEEDBACK
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
                 <div
-                  class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                   role="button"
                   tabindex="0"
                 >
@@ -843,36 +1005,54 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
               class="MuiList-root MuiList-padding Menu-listStyle css-h4y409-MuiList-root"
             >
               <div>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/"
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      HOME
-                    </span>
-                  </div>
-                </a>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/checkins"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        HOME
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/checkins"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      CHECK-INS
-                    </span>
-                  </div>
-                </a>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        CHECK-INS
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -883,7 +1063,10 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                       DIRECTORY
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
                 <div
                   class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
                   style="min-height: 0px;"
@@ -895,8 +1078,9 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                       class="MuiCollapse-wrapperInner MuiCollapse-vertical css-9l5vo-MuiCollapse-wrapperInner"
                     >
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Mui-selected Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters Mui-selected MuiListItemButton-root MuiListItemButton-gutters Mui-selected Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/guilds"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -907,10 +1091,14 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                             Guilds & Communities
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/people"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -921,10 +1109,14 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                             People
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/teams"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -935,12 +1127,17 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                             Teams
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                     </div>
                   </div>
                 </div>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -951,7 +1148,10 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                       FEEDBACK
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
               </div>
             </nav>
           </div>
@@ -982,36 +1182,54 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
               class="MuiList-root MuiList-padding Menu-listStyle css-h4y409-MuiList-root"
             >
               <div>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/"
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      HOME
-                    </span>
-                  </div>
-                </a>
-                <a
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
-                  href="/checkins"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        HOME
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <span
+                  class="Menu-listItem"
                 >
-                  <div
-                    class="MuiListItemText-root css-tlelie-MuiListItemText-root"
+                  <a
+                    class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                    href="/checkins"
+                    tabindex="0"
                   >
-                    <span
-                      class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                    <div
+                      class="MuiListItemText-root css-tlelie-MuiListItemText-root"
                     >
-                      CHECK-INS
-                    </span>
-                  </div>
-                </a>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                      <span
+                        class="MuiTypography-root MuiTypography-body1 MuiListItemText-primary css-10hburv-MuiTypography-root"
+                      >
+                        CHECK-INS
+                      </span>
+                    </div>
+                    <span
+                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                    />
+                  </a>
+                </span>
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -1022,7 +1240,10 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                       DIRECTORY
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
                 <div
                   class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
                   style="min-height: 0px;"
@@ -1034,8 +1255,9 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                       class="MuiCollapse-wrapperInner MuiCollapse-vertical css-9l5vo-MuiCollapse-wrapperInner"
                     >
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Mui-selected Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters Mui-selected MuiListItemButton-root MuiListItemButton-gutters Mui-selected Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/guilds"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -1046,10 +1268,14 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                             Guilds & Communities
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/people"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -1060,10 +1286,14 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                             People
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                       <a
-                        class="MuiListItem-root MuiListItem-gutters MuiListItem-padding Menu-nested css-1p823my-MuiListItem-root"
+                        class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-nested css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
                         href="/teams"
+                        tabindex="0"
                       >
                         <div
                           class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -1074,12 +1304,17 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                             Teams
                           </span>
                         </div>
+                        <span
+                          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                        />
                       </a>
                     </div>
                   </div>
                 </div>
-                <li
-                  class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
+                <div
+                  class="MuiButtonBase-root MuiListItemButton-root MuiListItemButton-gutters MuiListItemButton-root MuiListItemButton-gutters Menu-listItem css-16ac5r2-MuiButtonBase-root-MuiListItemButton-root"
+                  role="button"
+                  tabindex="0"
                 >
                   <div
                     class="MuiListItemText-root css-tlelie-MuiListItemText-root"
@@ -1090,7 +1325,10 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
                       FEEDBACK
                     </span>
                   </div>
-                </li>
+                  <span
+                    class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+                  />
+                </div>
               </div>
             </nav>
           </div>