feat(header): correctly gray out disabled menu links

src/components/Header/index.tsx

@@ -9,7 +9,11 @@ interface IHeaderProps {
 
 function MenuItem({ children, to }: PropsWithChildren<{ to: string }>) {
   return (
-    <SC.MenuItem to={to} activeClassName="active">
+    <SC.MenuItem
+      to={to}
+      activeClassName="active"
+      className={to === "/" ? "disabled" : ""}
+    >
       <SC.MenuItemText>{children}</SC.MenuItemText>
       <SC.MenuItemLine />
     </SC.MenuItem>

src/components/Header/styles.tsx

@@ -158,14 +158,16 @@ export const MenuItem = styled(Link)`
     border-radius: 3px;
   }
 
-  &[href="/"] {
+  &.disabled {
     cursor: default;
     pointer-events: none;
     opacity: 0.7;
+    color: #fff !important;
   }
 
-  &[href="/"] ${MenuItemLine} {
+  &.disabled ${MenuItemLine} {
     bottom: 50%;
+    background: #fff !important;
   }
 
   &.active {