refactor(megaMenu): mobile - use buttons for menu section titles

eea · Sep 21, 2022 · a7b632f · a7b632f
1 parent cb9315f
commit a7b632f
Showing 1 changed file with 14 additions and 2 deletions.
diff --git a/src/ui/Header/HeaderMenuPopUp.js b/src/ui/Header/HeaderMenuPopUp.js
@@ -275,10 +275,22 @@ const NestedAccordion = ({ menuItems, renderMenuItem, pathName }) => {
       </Accordion.Title>
     );
     let overview = cloneDeep(element);
-    overview.title = 'See all';
     x.content = (
       <Accordion.Content key={index}>
-        {renderMenuItem(overview, { className: 'item' })}
+        {/* Inverted right labeled button as a category title - Mobile */}
+        {renderMenuItem(
+          overview,
+          { className: 'ui button inverted icon right labeled' },
+          {
+            children: (
+              <>
+                {/* Add word overview to titles */}
+                <span> overview</span>
+                <Icon className={'arrow right icon'} alt={'Title icon'} />
+              </>
+            ),
+          },
+        )}
         <FirstLevelContent
           element={element}
           renderMenuItem={renderMenuItem}