remove auth for dev

src/App.js

@@ -8,8 +8,7 @@ import {
 
 import { getNotification } from "@redux/outstaffingSlice";
 
-import AuthForPartners from "./pages/AuthForPartners/AuthForPartners";
+import Auth from "./pages/Auth/Auth";
-import AuthForDevelopers from "./pages/AuthForDevelopers/AuthForDevelopers";
 import { TrackerIntro } from "./pages/TrackerIntro/TrackerIntro"
 import { CompanyInfo } from "@pages/CompanyInfo/CompanyInfo";
 import { TrackerAuth } from "@pages/TrackerAuth/TrackerAuth";
@@ -54,16 +53,13 @@ import "./assets/global.scss";
 import "./assets/fonts/stylesheet.css";
 import "bootstrap/dist/css/bootstrap.min.css";
 
-
-
 const App = () => {
   const notification = useSelector(getNotification)
   return (
     <>
       <Router>
         <Routes>
-          <Route exact path="/authdev" element={<AuthForDevelopers />} />
+          <Route exact path="/auth" element={<Auth />} />
-          <Route exact path="/auth" element={<AuthForPartners />} />
           <Route exact path="/tracker-intro" element={<TrackerIntro />} />
           <Route exact path="/tracker-auth" element={<TrackerAuth />} />
           <Route exact path="/tracker-registration" element={<TrackerRegistration />} />

src/components/AuthBox/AuthBox.jsx

@@ -63,7 +63,7 @@ export const AuthBox = ({ title }) => {
           localStorage.setItem("role_status", res.status);
           localStorage.setItem(
             "access_token_expired_at",
-            res.access_token_expired_at,
+            res.access_token_expired_at
           );
           dispatch(auth(true));
           dispatch(setUserInfo(res));
@@ -79,9 +79,11 @@ export const AuthBox = ({ title }) => {
       <h2 className="auth-box__header">
         Вход <img src={authHead} alt="authImg" />
       </h2>
-      <div className="auth-box__title">
+      {title && (
-        <span>{title}</span>
+        <div className="auth-box__title">
-      </div>
+          <span>{title}</span>
+        </div>
+      )}
       <form ref={ref} className="auth-box__form">
         <label htmlFor="login">Ваш email *</label>
         <input id="login" type="text" name="username" placeholder="Логин" />

src/components/AuthBox/authBox.scss

@@ -15,7 +15,8 @@
     letter-spacing: normal;
     line-height: 77.81px;
     text-align: left;
-    margin-top: 164px;
+    margin-top: 150px;
+    margin-bottom: 30px;
 
     span {
       color: #52b709;
@@ -88,12 +89,12 @@
       letter-spacing: normal;
       line-height: 19.2px;
       text-align: left;
-      margin-bottom: 25px;
+      margin-bottom: 10px;
       color: #000000;
     }
 
     .inputWrapper {
-      width: 366px;
+      width: 100%;
       position: relative;
 
       .eye {
@@ -203,9 +204,13 @@
     color: #000000;
     font-size: 17px;
     font-weight: 400;
-    margin-top: 45px;
+    margin-top: 35px;
     line-height: 32px;
 
+    @media (max-width: 700px) {
+      text-align: center;
+    }
+
     span {
       cursor: pointer;
       color: #52b709;

src/components/Common/Footer/footer.scss

@@ -79,7 +79,7 @@ footer {
   &__mail {
     display: flex;
     align-items: center;
-    column-gap: 13px;
+    column-gap: 5px;
 
     a {
       font-weight: 400;

src/components/LogoutButton/LogoutButton.jsx

@@ -1,9 +1,6 @@
 import React, { useState } from "react";
-import { useSelector } from "react-redux";
 import { useNavigate } from "react-router-dom";
 
-import { getRole } from "@redux/roleSlice";
-
 import { useLogout } from "@hooks/useLogout";
 
 import { Loader } from "@components/Common/Loader/Loader";
@@ -12,8 +9,6 @@ import "./logoutButton.scss";
 
 export const LogoutButton = () => {
   const [isLoggingOut, setIsLoggingOut] = useState(false);
-
-  const userRole = useSelector(getRole);
   const navigate = useNavigate();
   const { logout } = useLogout();
 
@@ -24,7 +19,7 @@ export const LogoutButton = () => {
         setIsLoggingOut(true);
         logout();
         setIsLoggingOut(false);
-        navigate(userRole === "ROLE_DEV" ? "/authdev" : "/auth");
+        navigate("/auth");
       }}
     >
       {isLoggingOut ? <Loader /> : "Выйти"}

src/components/ProfileHeader/ProfileHeader.jsx

@@ -3,7 +3,6 @@ import { useDispatch, useSelector } from "react-redux";
 import { NavLink, useNavigate } from "react-router-dom";
 
 import { auth, getProfileInfo, setProfileInfo } from "@redux/outstaffingSlice";
-import { getRole } from "@redux/roleSlice";
 
 import { apiRequest } from "@api/request";
 
@@ -15,7 +14,6 @@ export const ProfileHeader = () => {
   const navigate = useNavigate();
   const dispatch = useDispatch();
   const profileInfo = useSelector(getProfileInfo);
-  const userRole = useSelector(getRole);
   const [user] = useState(
     localStorage.getItem("role_status") === "18" ? "partner" : "developer",
   );
@@ -43,7 +41,7 @@ export const ProfileHeader = () => {
     localStorage.clear();
     dispatch(auth(false));
     setIsLoggingOut(false);
-    navigate(userRole === "ROLE_DEV" ? "/authdev" : "/auth");
+    navigate("/auth");
   };
 
   return (

src/hooks/useLogout.js

@@ -1,18 +1,16 @@
-import { useDispatch, useSelector } from "react-redux";
+import { useDispatch } from "react-redux";
 import { useNavigate } from "react-router-dom";
 
 import { auth } from "../redux/outstaffingSlice";
-import { getRole } from "../redux/roleSlice";
 
 export const useLogout = () => {
   const dispatch = useDispatch();
-  const userRole = useSelector(getRole);
   const navigate = useNavigate();
 
   const logout = () => {
     localStorage.clear();
     dispatch(auth(false));
-    navigate(userRole === "ROLE_DEV" ? "/authdev" : "/auth");
+    navigate("/auth");
   };
 
   return { logout };

src/pages/Auth/Auth.jsx

@@ -1,18 +1,15 @@
 import React, { useEffect } from "react";
 import { useSelector } from "react-redux";
-import { Link, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 
 import { selectAuth } from "@redux/outstaffingSlice";
 
-import { scrollToForm } from "@utils/helper";
-
 import { AuthBox } from "@components/AuthBox/AuthBox";
 import AuthHeader from "@components/Common/AuthHeader/AuthHeader";
 import { Footer } from "@components/Common/Footer/Footer";
 import SideBar from "@components/SideBar/SideBar";
 import SliderWorkers from "@components/SliderWorkers/SliderWorkers";
 
-import arrowBtn from "assets/icons/arrows/arrowRight.svg";
 import arrow from "assets/icons/arrows/arrow__login_page.png";
 import text from "assets/images/Body_Text.png";
 import vector from "assets/images/Vector_Smart_Object.png";
@@ -20,9 +17,9 @@ import vectorBlack from "assets/images/Vector_Smart_Object_black.png";
 import authImg from "assets/images/auth_img.png";
 import cross from "assets/images/cross.png";
 
-import "./authForPartners.scss";
+import "./auth.scss";
 
-const AuthForPartners = () => {
+const Auth = () => {
   const isAuth = useSelector(selectAuth);
   let navigate = useNavigate();
 
@@ -46,28 +43,10 @@ const AuthForPartners = () => {
         <img className="auth-partners__vector" src={vector} alt="" />
         <img className="auth-partners__vector-black" src={vectorBlack} alt="" />
         <div className="container">
-          <div className="change-mode">
-            <div className="change-mode__arrow" onClick={() => scrollToForm()}>
-              <img src={arrowBtn}></img>
-            </div>
-            <div className="buttons">
-              <Link to={"/authdev"}>
-                <button className="change-mode__developersForPart">
-                  Для разработчиков
-                </button>
-              </Link>
-              <Link to={"/auth"}>
-                <button className="change-mode__partnersForPart">
-                  Для партнёров
-                </button>
-              </Link>
-            </div>
-          </div>
-
           <div className="row">
             <div className="col-12 col-xl-6">
               <div className="auth-partners__box">
-                <AuthBox title="для партнёров" />
+                <AuthBox />
               </div>
             </div>
             <div className="col-xl-2">
@@ -90,7 +69,6 @@ const AuthForPartners = () => {
                       <img className="cross" src={cross} alt="" />
                     </div>
                     <div>
-                      {/* <img className='auth-specialists} src={specialists} alt="" /> */}
                       <p className="auth-partners__specialists">
                         300 Специалистов
                       </p>
@@ -121,4 +99,4 @@ const AuthForPartners = () => {
   );
 };
 
-export default AuthForPartners;
+export default Auth;

src/pages/Auth/auth.scss

@@ -181,7 +181,7 @@
   &__img-text {
     position: absolute;
     right: -68px;
-    bottom: -84px;
+    bottom: 0px;
   }
 
   @media (max-width: 575.98px) {

src/pages/AuthForDevelopers/AuthForDevelopers.jsx

@@ -1,124 +0,0 @@
-import React, { useEffect } from "react";
-import { useSelector } from "react-redux";
-import { Link, useNavigate } from "react-router-dom";
-
-import { selectAuth } from "@redux/outstaffingSlice";
-
-import { scrollToForm } from "@utils/helper";
-
-import { AuthBox } from "@components/AuthBox/AuthBox";
-import AuthHeader from "@components/Common/AuthHeader/AuthHeader";
-import { Footer } from "@components/Common/Footer/Footer";
-import SideBar from "@components/SideBar/SideBar";
-import SliderWorkers from "@components/SliderWorkers/SliderWorkers";
-
-import arrowBtn from "assets/icons/arrows/arrowRight.svg";
-import arrow from "assets/icons/arrows/arrow__login_page.png";
-import text from "assets/images/Body_Text.png";
-import vector from "assets/images/Vector_Smart_Object.png";
-import vectorBlack from "assets/images/Vector_Smart_Object_black.png";
-import cross from "assets/images/cross.png";
-import medium from "assets/images/medium_male_big.png";
-
-import "./authForDevelopers.scss";
-
-const AuthForDevelopers = () => {
-  const isAuth = useSelector(selectAuth);
-  let navigate = useNavigate();
-  const getToken = localStorage.getItem("auth_token");
-
-  useEffect(() => {
-    if (isAuth || getToken) {
-      navigate("/profile");
-    }
-  }, [getToken]);
-
-  return (
-    <section className="auth-developers">
-      <AuthHeader />
-      <SliderWorkers
-        title={"Свободные разработчики"}
-        titleInfo={"для Вашей команды"}
-        subTitle={true}
-      />
-      <div className="auth-developers__background">
-        <img className="auth-developers__vector" src={vector} alt="" />
-        <img
-          className="auth-developers__vector-black"
-          src={vectorBlack}
-          alt="#"
-        />
-        <div className="container">
-          {/* <div className="change-mode">
-            <div className="change-mode__arrow" onClick={() => scrollToForm()}>
-              <img src={arrowBtn}></img>
-            </div>
-            <div className="buttons">
-              <Link to={"/authdev"}>
-                <button className="change-mode__developersForDev">
-                  Для разработчиков
-                </button>
-              </Link>
-              <Link to={"/auth"}>
-                <button className="change-mode__partnersForDev">
-                  Для партнёров
-                </button>
-              </Link>
-            </div>
-          </div> */}
-          <div className="row">
-            <div className="col-12 col-xl-6">
-              <div className="auth-developers__box">
-                <AuthBox title="для разработчиков" />
-              </div>
-            </div>
-            <div className="col-xl-2">
-              <img className="auth-developers__arrow" src={arrow} alt="" />
-            </div>
-            <div className="col-12 col-xl-4">
-              <div className="auth-developers__info">
-                <div className="auth-developers__info-box">
-                  <img src={medium} alt="" />
-                  <h3>
-                    Frontend разработчик,
-                    <br /> Middle
-                  </h3>
-                </div>
-
-                <div className="auth-developers__info-container">
-                  <div className="auth-developers__info-img">
-                    <div>
-                      <img className="cross" src={cross} alt="" />
-                    </div>
-                    <div>
-                      {/* <img className='auth-specialists} src={specialists} alt="" /> */}
-                      <p className="auth-developers__specialists">
-                        300 Специалистов
-                      </p>
-                    </div>
-                  </div>
-
-                  <ul className="auth-developers__info-list">
-                    <li className="auth-developers__info-item">
-                      Ruby on Rails
-                    </li>
-                    <li className="auth-developers__info-item">PHP</li>
-                    <li className="auth-developers__info-item">Python</li>
-                    <li className="auth-developers__info-item">Vue.js</li>
-                    <li className="auth-developers__info-item">React. JS</li>
-                  </ul>
-                </div>
-
-                <img className="auth-developers__img-text" src={text} alt="" />
-              </div>
-            </div>
-          </div>
-          <Footer />
-        </div>
-      </div>
-      <SideBar />
-    </section>
-  );
-};
-
-export default AuthForDevelopers;

src/pages/AuthForDevelopers/authForDevelopers.scss

@@ -1,240 +0,0 @@
-.auth-developers {
-  font-family: "LabGrotesque", sans-serif;
-  overflow: hidden;
-  position: relative;
-
-  &__background {
-    background-color: #f1f1f1;
-    position: relative;
-  }
-
-  &__vector,
-  &__vector-black {
-    position: absolute;
-  }
-
-  &__vector {
-    top: -37px;
-    left: -285px;
-  }
-
-  &__vector-black {
-    top: 460px;
-    right: -224px;
-
-    @media (max-width: 1200px) {
-      top: 370px;
-    }
-
-    @media (max-width: 1024px) {
-      top: 180px;
-    }
-  }
-
-  &__arrow {
-    margin-top: 360px;
-    z-index: 99;
-
-    @media (max-width: 1200px) {
-      display: none;
-    }
-  }
-
-  @media (max-width: 575.98px) {
-    &__vector,
-    &__vector-black,
-    &__arrow {
-      display: none;
-    }
-  }
-  &__info {
-    background-color: #e1fccf;
-    margin-top: 70px;
-    max-width: 310px;
-    padding-top: 30px;
-    position: relative;
-    padding-bottom: 310px;
-
-    @media (max-width: 1200px) {
-      display: none;
-    }
-  }
-
-  &__info-box {
-    display: flex;
-    align-items: center;
-  }
-
-  @media (max-width: 575.98px) {
-    &__info {
-      max-width: 380px;
-    }
-
-    &__info-box {
-      flex-direction: column;
-      justify-content: center;
-    }
-  }
-
-  @media (max-width: 375.98px) {
-    &__info {
-      max-width: 340px;
-    }
-  }
-
-  &__info-box > img {
-    width: 165px;
-    height: 165px;
-    margin-left: -84px;
-    margin-right: 30px;
-  }
-
-  @media (max-width: 575.98px) {
-    &__info-box > img {
-      margin-left: 0px;
-      margin-right: 0px;
-    }
-  }
-
-  &__info-box > h3 {
-    font-family: "GT Eesti Pro Display";
-    font-size: 2em;
-    font-weight: 100;
-    font-style: normal;
-    letter-spacing: normal;
-    line-height: 36px;
-    text-align: left;
-  }
-
-  @media (max-width: 575.98px) {
-    &__info-box > h3 {
-      margin-top: 20px;
-    }
-  }
-
-  &__info-container {
-    display: flex;
-    position: relative;
-  }
-
-  &__info-img {
-    display: flex;
-    flex-direction: column;
-    text-align: center;
-    margin-top: 28px;
-    margin-left: -40px;
-  }
-
-  &__info-img > div > img {
-    margin-bottom: 100px;
-  }
-
-  &__specialists {
-    font-family: "GT Eesti Pro Display";
-    font-size: 1.8em;
-    font-weight: 100;
-    font-style: normal;
-    letter-spacing: normal;
-    line-height: 26.12px;
-    text-align: left;
-    transform: rotate(-90deg);
-    text-transform: uppercase;
-  }
-
-  &__info-list {
-    list-style: none;
-    margin-top: 110px;
-    position: absolute;
-    right: -70px;
-  }
-
-  @media (max-width: 575.98px) {
-    &__info-list {
-      left: 34px;
-    }
-  }
-
-  &__info-item {
-    color: #1f1f1f;
-    font-family: "GT Eesti Pro Display";
-    font-size: 4em;
-    font-weight: 700;
-    font-style: normal;
-    letter-spacing: normal;
-    line-height: 56.95px;
-    text-align: left;
-    text-decoration: underline;
-    text-transform: uppercase;
-  }
-
-  @media (max-width: 575.98px) {
-    &__info-item {
-      font-size: 2.6em;
-    }
-  }
-
-  &__img-text {
-    position: absolute;
-    right: -68px;
-    bottom: -84px;
-  }
-
-  @media (max-width: 575.98px) {
-    &__img-text {
-      right: 0px;
-      bottom: -40px;
-    }
-  }
-  ////////////////////////////////////
-
-  &__auth-link {
-    display: block;
-  }
-
-  &__auth-link a {
-    display: block;
-    width: 100%;
-    height: 100%;
-    color: #fff;
-  }
-
-  @media (max-width: 766px) {
-    &__form-buttons {
-      flex-direction: column;
-    }
-
-    &__form-btn {
-      margin: 0;
-      margin-bottom: 1.5rem;
-    }
-  }
-}
-
-.change-mode {
-  &__partnersForDev {
-    background: #52b7098c;
-    color: #2d6505;
-    margin-left: -35px;
-  }
-
-  &__partnersForDev,
-  &__developersForDev {
-    width: 220px;
-    height: 50px;
-    border-radius: 44px;
-    font-size: 16px;
-    border: none;
-  }
-
-  &__developersForDev {
-    position: relative;
-    background: #406128;
-    color: white;
-  }
-
-  @media (max-width: 768px) {
-    &__partnersForDev {
-      margin: 15px 0 0 0;
-    }
-  }
-}