fix Unlimited tag on mobile

apps/web/Components/Layout/Header.jsx

@@ -22,7 +22,6 @@ const HeaderContent = styled(Flex)`
 `;
 
 const Wrapper = styled.header`
-  height: var(--height-header);
   position: sticky;
   top: 0;
   z-index: 999999;

apps/web/Components/Layout/Logo.jsx

@@ -34,8 +34,9 @@ const LogoText = styled.h3`
 const TagWrapper = styled.div`
   font-family: 'Montserrat';
   font-weight: 500;
-  * {
-    font-size: 0.7rem;
+
+  ${min('tablet')} {
+    margin: 0 5px;
   }
 `;
 
@@ -43,12 +44,11 @@ const { COLOR_PRIMARY } = getColors();
 
 const UnlimitedTag = observer(() => {
   const { $process } = useStore();
+
   if ($process.has('Unlimited')) {
     return (
       <TagWrapper>
-        <Tag color={COLOR_PRIMARY} style={{ margin: '0 5px' }}>
-          без ограничений
-        </Tag>
+        <Tag color={COLOR_PRIMARY}>без ограничений</Tag>
       </TagWrapper>
     );
   }
@@ -64,7 +64,7 @@ function Logo() {
           <Image priority className={styles.logo} alt="logo" src={logo} layout="responsive" />
         </Link>
       </ImageWrapper>
-      <Flex justifyContent="space-between" alignItems="center">
+      <Flex flexDirection={['column', 'row']} alignItems={[undefined, 'center']}>
         <LogoText>Лизинговый Калькулятор</LogoText>
         <UnlimitedTag />
       </Flex>

apps/web/Components/Layout/Navigation.tsx

@@ -2,7 +2,6 @@ import Background from './Background';
 import type { MenuProps } from 'antd';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
-import styled from 'styled-components';
 import { Menu } from 'ui/elements';
 import { AppstoreOutlined, SettingOutlined } from 'ui/elements/icons';
 
@@ -38,16 +37,12 @@ const items: MenuProps['items'] = [
   },
 ];
 
-const Wrapper = styled(Background)`
-  height: var(--height-navigation);
-`;
-
 export function AppNavigation() {
   const { pathname } = useRouter();
 
   return (
-    <Wrapper>
+    <Background>
       <Menu selectedKeys={[pathname]} mode="horizontal" items={items} />
-    </Wrapper>
+    </Background>
   );
 }

apps/web/styles/global-style.js

@@ -1,5 +1,4 @@
 import getColors from './colors';
-import { min } from '@/styles/mq';
 import { createGlobalStyle } from 'styled-components';
 
 const { COLOR_PRIMARY, COLOR_SECONDARY, COLOR_TERTIARTY } = getColors();
@@ -10,11 +9,6 @@ export const GlobalStyle = createGlobalStyle`
     --color-primary: ${COLOR_PRIMARY};
     --color-secondary: ${COLOR_SECONDARY};
     --color-tertiarty: ${COLOR_TERTIARTY};
-    --height-navigation: 46px;
-    --height-header: 60px;
-    ${min('laptop')} {
-    --height-header: 74px;
-    }
     } 
 
  /* Scroll bar stylings */