From 333c400ff561229d2d18b9e2389824a5c02e83c2 Mon Sep 17 00:00:00 2001
From: Sergiy <sergiy0378@gmail.com>
Date: Mon, 19 Aug 2024 21:33:34 +0300
Subject: [PATCH 1/6] OV-11: * colors

---
 frontend/src/framework/theme/styles/colors.styles.ts | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/frontend/src/framework/theme/styles/colors.styles.ts b/frontend/src/framework/theme/styles/colors.styles.ts
index 75c91a9c5..c207ae8ac 100644
--- a/frontend/src/framework/theme/styles/colors.styles.ts
+++ b/frontend/src/framework/theme/styles/colors.styles.ts
@@ -3,6 +3,12 @@ const colors = {
         900: '#1a365d',
         200: '#b3e0ff',
     },
+    background: {
+        900: '#0a0049',
+        600: '#35399a',
+        300: '#3c9cf5',
+        50: '#e2e1ec',
+    },
     text: {
         default: '#36454f',
         accent: '#ff5733',

From 4bcf5ab3ca0395ad3e34edc2082ad557d8046813 Mon Sep 17 00:00:00 2001
From: Sergiy <sergiy0378@gmail.com>
Date: Mon, 19 Aug 2024 21:34:23 +0300
Subject: [PATCH 2/6] OV-11: + header component

---
 .../common/components/header/header.tsx       | 33 +++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 frontend/src/bundles/common/components/header/header.tsx

diff --git a/frontend/src/bundles/common/components/header/header.tsx b/frontend/src/bundles/common/components/header/header.tsx
new file mode 100644
index 000000000..96dd5229a
--- /dev/null
+++ b/frontend/src/bundles/common/components/header/header.tsx
@@ -0,0 +1,33 @@
+import { Flex, Text } from '@chakra-ui/react';
+
+const Header = (): JSX.Element => {
+    return (
+        <Flex
+            as="header"
+            height="75px"
+            position="sticky"
+            top="0"
+            left="0"
+            width="100%"
+            backgroundColor="background.900"
+            color="white"
+            boxShadow="md"
+            zIndex="1000"
+            padding="4"
+            marginBottom="20px"
+        >
+            <Flex
+                width="full"
+                alignItems="center"
+                maxWidth="1440px"
+                margin="0 auto"
+            >
+                <Text fontSize="xl" fontWeight="bold">
+                    Logo
+                </Text>
+            </Flex>
+        </Flex>
+    );
+};
+
+export { Header };

From af83d0eff837bbc937bc536177580a7757169414 Mon Sep 17 00:00:00 2001
From: Sergiy <sergiy0378@gmail.com>
Date: Mon, 19 Aug 2024 21:36:01 +0300
Subject: [PATCH 3/6] OV-11: + header into app

---
 frontend/src/app/app.tsx                             | 7 ++++++-
 frontend/src/bundles/common/components/components.ts | 1 +
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/app.tsx b/frontend/src/app/app.tsx
index e1f671b35..f7420ca51 100644
--- a/frontend/src/app/app.tsx
+++ b/frontend/src/app/app.tsx
@@ -1,5 +1,9 @@
 import reactLogo from '~/assets/img/react.svg';
-import { Link, RouterOutlet } from '~/bundles/common/components/components.js';
+import {
+    Header,
+    Link,
+    RouterOutlet,
+} from '~/bundles/common/components/components.js';
 import { AppRoute } from '~/bundles/common/enums/enums.js';
 import {
     useAppDispatch,
@@ -27,6 +31,7 @@ const App: React.FC = () => {
 
     return (
         <>
+            <Header />
             <img src={reactLogo} width="30" alt="logo" />
 
             <ul>
diff --git a/frontend/src/bundles/common/components/components.ts b/frontend/src/bundles/common/components/components.ts
index ce95bfe64..9f899df94 100644
--- a/frontend/src/bundles/common/components/components.ts
+++ b/frontend/src/bundles/common/components/components.ts
@@ -1,4 +1,5 @@
 export { Button } from './button/button.js';
+export { Header } from './header/header.js';
 export { Input } from './input/input.js';
 export { Link } from './link/link.js';
 export { RouterProvider } from './router-provider/router-provider.js';

From 89bd1459e02966236595baa3da5e7a6b03eee7d8 Mon Sep 17 00:00:00 2001
From: Sergiy <sergiy0378@gmail.com>
Date: Tue, 20 Aug 2024 10:41:25 +0300
Subject: [PATCH 4/6] OV-11: * header component

---
 frontend/src/bundles/common/components/header/header.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/bundles/common/components/header/header.tsx b/frontend/src/bundles/common/components/header/header.tsx
index 96dd5229a..2a0322074 100644
--- a/frontend/src/bundles/common/components/header/header.tsx
+++ b/frontend/src/bundles/common/components/header/header.tsx
@@ -20,9 +20,9 @@ const Header = (): JSX.Element => {
                 width="full"
                 alignItems="center"
                 maxWidth="1440px"
-                margin="0 auto"
+                justifyContent="space-between"
             >
-                <Text fontSize="xl" fontWeight="bold">
+                <Text fontSize="xl" fontWeight="lighter">
                     Logo
                 </Text>
             </Flex>

From 617444e3b92363e455781395e85c6288fa88a45b Mon Sep 17 00:00:00 2001
From: Sergiy <sergiy0378@gmail.com>
Date: Tue, 20 Aug 2024 14:46:08 +0300
Subject: [PATCH 5/6] OV-11: + conditional rendering

---
 frontend/src/app/app.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/app.tsx b/frontend/src/app/app.tsx
index f7420ca51..309b4baca 100644
--- a/frontend/src/app/app.tsx
+++ b/frontend/src/app/app.tsx
@@ -31,7 +31,11 @@ const App: React.FC = () => {
 
     return (
         <>
-            <Header />
+            {pathname === AppRoute.SIGN_UP ||
+            pathname === AppRoute.SIGN_IN ? null : (
+                <Header />
+            )}
+
             <img src={reactLogo} width="30" alt="logo" />
 
             <ul>

From cc693ceb776f357053892755fe6400924071a441 Mon Sep 17 00:00:00 2001
From: Sergiy <sergiy0378@gmail.com>
Date: Tue, 20 Aug 2024 15:39:49 +0300
Subject: [PATCH 6/6] OV-11: - header from app

---
 frontend/src/app/app.tsx | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/frontend/src/app/app.tsx b/frontend/src/app/app.tsx
index 309b4baca..e1f671b35 100644
--- a/frontend/src/app/app.tsx
+++ b/frontend/src/app/app.tsx
@@ -1,9 +1,5 @@
 import reactLogo from '~/assets/img/react.svg';
-import {
-    Header,
-    Link,
-    RouterOutlet,
-} from '~/bundles/common/components/components.js';
+import { Link, RouterOutlet } from '~/bundles/common/components/components.js';
 import { AppRoute } from '~/bundles/common/enums/enums.js';
 import {
     useAppDispatch,
@@ -31,11 +27,6 @@ const App: React.FC = () => {
 
     return (
         <>
-            {pathname === AppRoute.SIGN_UP ||
-            pathname === AppRoute.SIGN_IN ? null : (
-                <Header />
-            )}
-
             <img src={reactLogo} width="30" alt="logo" />
 
             <ul>