Fixed header auth

src/components/AuthHeader/AuthHeader.js

@@ -1,5 +1,7 @@
 import React from "react";
 
+import userIcon from "../../images/userIcon.png";
+
 import "./authHeader.scss";
 
 export const AuthHeader = ({}) => {
@@ -8,7 +10,27 @@ export const AuthHeader = ({}) => {
       <div className="auth-header__logo">
         <h3>itguild.</h3>
       </div>
-      <div className="auth-header__navigation"></div>
+      <div className="auth-header__navigation">
+        <div className="container">
+          <div className="auth-nav">
+            <ul>
+              <li>
+                <a href="#">Главная</a>
+              </li>
+              <li>
+                <a href="#">Кабинет разработчика</a>
+              </li>
+              <li>
+                <a href="#">Школа</a>
+              </li>
+            </ul>
+
+            <a href="#">
+              <img src={userIcon}></img>
+            </a>
+          </div>
+        </div>
+      </div>
     </div>
   );
 };

src/components/AuthHeader/authHeader.scss

@@ -0,0 +1,53 @@
+.auth-header {
+  background-color: #f1f1f1;
+
+  &__logo {
+    padding: 0 0 0 160px;
+    height: 55px;
+    display: flex;
+    align-items: center;
+
+    h3 {
+      font-size: 20px;
+      line-height: 32px;
+      color: #000000;
+    }
+  }
+
+  &__navigation {
+    display: flex;
+    align-items: center;
+    height: 66px;
+    width: 100%;
+    background: #ffffff;
+
+    .auth-nav {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+
+      ul {
+        display: flex;
+        margin: 0;
+        padding: 0;
+        list-style: none;
+
+        li {
+          margin-right: 25px;
+
+          font-size: 18px;
+          line-height: 32px;
+
+          a,
+          a:hover {
+            color: #897676;
+          }
+
+          a:focus {
+            color: #000000;
+          }
+        }
+      }
+    }
+  }
+}

src/pages/AuthForDevelopers/AuthForDevelopers.js

@@ -16,6 +16,7 @@ import { Footer } from "../../components/Footer/Footer";
 import SideBar from "../../components/SideBar/SideBar";
 
 import "./authForDevelopers.scss";
+import AuthHeader from "../../components/AuthHeader/AuthHeader";
 
 const AuthForDevelopers = () => {
   const isAuth = useSelector(selectAuth);
@@ -30,6 +31,7 @@ const AuthForDevelopers = () => {
 
   return (
     <section className="auth-developers">
+      <AuthHeader />
       <div className="auth-developers__background">
         <img className="auth-developers__vector" src={vector} alt="" />
         <img

src/pages/AuthForPartners/AuthForPartners.js

@@ -14,6 +14,7 @@ import { AuthBox } from "../../components/AuthBox/AuthBox";
 
 import "./authForPartners.scss";
 import SideBar from "../../components/SideBar/SideBar";
+import AuthHeader from "../../components/AuthHeader/AuthHeader";
 
 const AuthForPartners = () => {
   const isAuth = useSelector(selectAuth);
@@ -29,6 +30,7 @@ const AuthForPartners = () => {
 
   return (
     <section className="auth-partners">
+      <AuthHeader />
       <div className="auth-partners__background">
         <img className="auth-partners__vector" src={vector} alt="" />
         <img className="auth-partners__vector-black" src={vectorBlack} alt="" />