From fb9601fb9c1d743d03b61054ef2f20f0eac61bb0 Mon Sep 17 00:00:00 2001
From: ekachxaidze98 <ekachxaidze2@gmail.com>
Date: Fri, 31 Jan 2025 12:35:10 +0400
Subject: [PATCH 1/2] CORE-5093: update design

---
 src/modules/header/header.jsx |  5 ++---
 src/modules/header/styles.css | 14 ++++----------
 2 files changed, 6 insertions(+), 13 deletions(-)

diff --git a/src/modules/header/header.jsx b/src/modules/header/header.jsx
index 84aba1c9..608e8306 100644
--- a/src/modules/header/header.jsx
+++ b/src/modules/header/header.jsx
@@ -245,7 +245,7 @@ const Header = ({ children, className, id, ...passProps }) => {
           onExpand={() => toggleMenu('about')}
           className={styles.aboutMenu}
         >
-          <Group id="about" label="About" tag="li" labelTag="a">
+          <Group id="about" label="About" tag="li">
             <Item href="/about">About us</Item>
             <Item href="/about#mission">Our mission</Item>
             <Item href="/about#team">Team</Item>
@@ -257,7 +257,6 @@ const Header = ({ children, className, id, ...passProps }) => {
             id="community"
             label="Community governance"
             tag="li"
-            labelTag="a"
           >
             <Item href="/governance" className={styles.communitiesMenuItem}>
               Governance
@@ -266,7 +265,7 @@ const Header = ({ children, className, id, ...passProps }) => {
             <Item href="/governance/supporters">Board of supporters</Item>
             <Item href="/governance/research">Research network</Item>
           </Group>
-          <Group id="innovations" label="Innovations" tag="li" labelTag="a">
+          <Group id="innovations" label="Innovations" tag="li">
             <Item href="/about/research-outputs">Our research</Item>
             <Item href="/innovations/labs">CORE Labs</Item>
           </Group>
diff --git a/src/modules/header/styles.css b/src/modules/header/styles.css
index bf0dced4..b99557a8 100644
--- a/src/modules/header/styles.css
+++ b/src/modules/header/styles.css
@@ -223,6 +223,7 @@
   font-weight: 400;
   color: hsl(var(--component-color) / var(--component-disabled));
   letter-spacing: .01em;
+  text-align: start;
 }
 
 .group-list {
@@ -430,19 +431,19 @@
       flex-direction: row;
       width: max-content;
       max-height: 20rem;
-      gap: 16px;
+      gap: 24px;
+      padding: 10px;
     }
   }
 }
 
 .member-menu-item  {
-  position: relative;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   width: max-content;
-  min-width: 172px;
+  min-width: 215px;
   height: 68px;
   padding: .5rem;
   margin-top: 1rem;
@@ -452,13 +453,6 @@
 }
 
 
-.member-menu-text {
-  position: absolute;
-  top: 50%;
-  width: 100%;
-  transform: translate(-50%, -50%);
-}
-
 /* search item styles */
 .search-bar-item {
   --app-bar-padding-y: 0;

From 0aec38dab6ea46e1cce43e41e891c63b2388a297 Mon Sep 17 00:00:00 2001
From: ekachxaidze98 <ekachxaidze2@gmail.com>
Date: Fri, 31 Jan 2025 12:38:27 +0400
Subject: [PATCH 2/2] CORE-5093: fix lint issues

---
 src/modules/header/header.jsx | 6 +-----
 src/modules/header/styles.css | 2 +-
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/modules/header/header.jsx b/src/modules/header/header.jsx
index 608e8306..92877a26 100644
--- a/src/modules/header/header.jsx
+++ b/src/modules/header/header.jsx
@@ -253,11 +253,7 @@ const Header = ({ children, className, id, ...passProps }) => {
             <Item href="/faq">FAQs</Item>
             <Item href="/contact">Contact us</Item>
           </Group>
-          <Group
-            id="community"
-            label="Community governance"
-            tag="li"
-          >
+          <Group id="community" label="Community governance" tag="li">
             <Item href="/governance" className={styles.communitiesMenuItem}>
               Governance
             </Item>
diff --git a/src/modules/header/styles.css b/src/modules/header/styles.css
index b99557a8..b8b8cc6e 100644
--- a/src/modules/header/styles.css
+++ b/src/modules/header/styles.css
@@ -222,8 +222,8 @@
   font-size: .875rem;
   font-weight: 400;
   color: hsl(var(--component-color) / var(--component-disabled));
-  letter-spacing: .01em;
   text-align: start;
+  letter-spacing: .01em;
 }
 
 .group-list {