feat(2324): add image in header mobile

src/features/ProfileHeader/index.tsx

@@ -46,7 +46,7 @@ export const ProfileHeader = ({
     sportType,
   } = usePageParams()
 
-  const url = '/images/5704.png'
+  const url = '/images/5704'
   const color = useProfileColor(profileId)
   const imageHeader = profileId === 5704
   && sportType === SportTypes.FOOTBALL

src/features/ProfileHeader/styled.tsx

@@ -13,8 +13,13 @@ export const defaultHeaderStyles = (
   color: string = DEFAULT_HEADER_COLOR, headerImage: string | undefined | null,
 ) => {
   if (headerImage && client.name !== 'facr') {
-    return css`background: url(${headerImage});
-      background-size: 100% 100%;`
+    return css`background: url(${headerImage}.png);
+      background-size: 100% 100%;
+      @media (max-width: 450px){
+        background: url(${headerImage}_mobile.png);
+        background-size: 100% 100%;
+      }
+      `
   }
   if (color.includes('linear-gradient')) {
     return css`
@@ -52,7 +57,6 @@ export const HeaderStyled = styled.header<HeaderProps>`
 
   ${isMobileDevice
     ? css`
-      height: auto;
       padding: 8px;
     `
     : ''}