refact: rename poorly named mobile header

src/components/MobileHeader/index.tsx

@@ -1,21 +1,21 @@
 import React, { FC } from "react"
 import * as SC from "./styles"
 
-interface IHomeMobileHeaderProps {
+interface IMobileHeaderProps {
   openMenu: () => void
 }
 
-export const HomeMobileHeader: FC<IHomeMobileHeaderProps> = ({
+export const MobileHeader: FC<IMobileHeaderProps> = ({
   openMenu,
   children,
 }) => {
   return (
-    <SC.HomeMobileHeaderWrapper>
+    <SC.MobileHeaderWrapper>
       <SC.LogoWrapper>
         <SC.StyledLogo />
       </SC.LogoWrapper>
       {children}
       <SC.Burger onClick={openMenu} />
-    </SC.HomeMobileHeaderWrapper>
+    </SC.MobileHeaderWrapper>
   )
 }

src/components/MobileHeader/styles.tsx

@@ -3,7 +3,7 @@ import styled from "styled-components"
 import { fontFamily } from "../../design/typography"
 import Logo from "../../images/tph-logo.svg"
 
-export const HomeMobileHeaderWrapper = styled.div`
+export const MobileHeaderWrapper = styled.div`
   z-index: 50;
   background: ${props => transparentize(0.2, props.theme.main.background)};
   position: fixed;