Fixed Auth

src/pages/AuthForDevelopers/AuthForDevelopers.js

@@ -4,7 +4,7 @@ import { AuthBox } from "../../components/AuthBox/AuthBox";
 
 import { useSelector } from "react-redux";
 import arrow from "../../images/arrow__login_page.png";
-import authImg from "../../images/auth_img.png";
+import medium from "../../images/medium_male_big.png";
 import cross from "../../images/cross.png";
 import text from "../../images/Body_Text.png";
 import arrowBtn from "../../images/arrowRight.png";
@@ -78,10 +78,10 @@ const AuthForDevelopers = () => {
             <div className="col-12 col-xl-4">
               <div className="auth-developers__info">
                 <div className="auth-developers__info-box">
-                  <img src={authImg} alt="" />
+                  <img src={medium} alt="" />
                   <h3>
-                    Управление
+                    Frontend разработчик,
-                    <br /> командой
+                    <br /> Middle
                   </h3>
                 </div>
 
@@ -100,13 +100,12 @@ const AuthForDevelopers = () => {
 
                   <ul className="auth-developers__info-list">
                     <li className="auth-developers__info-item">
-                      Рабочее
+                      Ruby on Rails
-                      <br />
-                      пространство
-                    </li>
-                    <li className="auth-info__list-item">
-                      Управление задачами
                     </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>
 

src/pages/AuthForDevelopers/authForDevelopers.scss

@@ -35,7 +35,6 @@
       display: none;
     }
   }
-
   &__info {
     background-color: #e1fccf;
     margin-top: 70px;
@@ -45,10 +44,20 @@
     padding-bottom: 310px;
   }
 
+  &__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) {
@@ -57,21 +66,9 @@
     }
   }
 
-  &__info-box {
-    display: flex;
-    align-items: center;
-  }
-
-  @media (max-width: 575.98px) {
-    &__info-box {
-      flex-direction: column;
-      justify-content: center;
-    }
-  }
-
   &__info-box > img {
-    width: 150px;
+    width: 165px;
-    height: 150px;
+    height: 165px;
     margin-left: -84px;
     margin-right: 30px;
   }
@@ -132,7 +129,7 @@
     list-style: none;
     margin-top: 110px;
     position: absolute;
-    left: 34px;
+    right: -70px;
   }
 
   @media (max-width: 575.98px) {
@@ -144,7 +141,7 @@
   &__info-item {
     color: #1f1f1f;
     font-family: "GT Eesti Pro Display";
-    font-size: 2.6em;
+    font-size: 4em;
     font-weight: 700;
     font-style: normal;
     letter-spacing: normal;
@@ -152,13 +149,11 @@
     text-align: left;
     text-decoration: underline;
     text-transform: uppercase;
-    margin-bottom: 34px;
   }
 
   @media (max-width: 575.98px) {
     &__info-item {
       font-size: 2.6em;
-      margin-bottom: 14px;
     }
   }
 
@@ -174,6 +169,7 @@
       bottom: -40px;
     }
   }
+  ////////////////////////////////////
 
   &__auth-link {
     display: block;

src/pages/AuthForPartners/AuthForPartners.js

@@ -1,6 +1,6 @@
 import React, { useEffect } from "react";
 import arrow from "../../images/arrow__login_page.png";
-import medium from "../../images/medium_male_big.png";
+import authImg from "../../images/auth_img.png";
 import cross from "../../images/cross.png";
 import text from "../../images/Body_Text.png";
 import arrowBtn from "../../images/arrowRight.png";
@@ -71,13 +71,14 @@ const AuthForPartners = () => {
             <div className="col-xl-2">
               <img className="auth-partners__arrow" src={arrow} alt="" />
             </div>
+
             <div className="col-12 col-xl-4">
               <div className="auth-partners__info">
                 <div className="auth-partners__info-box">
-                  <img src={medium} alt="" />
+                  <img src={authImg} alt="" />
                   <h3>
-                    Frontend разработчик,
+                    Управление
-                    <br /> Middle
+                    <br /> командой
                   </h3>
                 </div>
 
@@ -95,11 +96,14 @@ const AuthForPartners = () => {
                   </div>
 
                   <ul className="auth-partners__info-list">
-                    <li className="auth-partners__info-item">Ruby on Rails</li>
+                    <li className="auth-partners__info-item">
-                    <li className="auth-partners__info-item">PHP</li>
+                      Рабочее
-                    <li className="auth-partners__info-item">Python</li>
+                      <br />
-                    <li className="auth-partners__info-item">Vue.js</li>
+                      пространство
-                    <li className="auth-partners__info-item">React. JS</li>
+                    </li>
+                    <li className="auth-info__list-item">
+                      Управление задачами
+                    </li>
                   </ul>
                 </div>
 

src/pages/AuthForPartners/authForPartners.scss

@@ -45,20 +45,10 @@
     padding-bottom: 310px;
   }
 
-  &__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) {
@@ -67,9 +57,21 @@
     }
   }
 
+  &__info-box {
+    display: flex;
+    align-items: center;
+  }
+
+  @media (max-width: 575.98px) {
+    &__info-box {
+      flex-direction: column;
+      justify-content: center;
+    }
+  }
+
   &__info-box > img {
-    width: 165px;
+    width: 150px;
-    height: 165px;
+    height: 150px;
     margin-left: -84px;
     margin-right: 30px;
   }
@@ -130,7 +132,7 @@
     list-style: none;
     margin-top: 110px;
     position: absolute;
-    right: -70px;
+    left: 34px;
   }
 
   @media (max-width: 575.98px) {
@@ -142,7 +144,7 @@
   &__info-item {
     color: #1f1f1f;
     font-family: "GT Eesti Pro Display";
-    font-size: 4em;
+    font-size: 2.6em;
     font-weight: 700;
     font-style: normal;
     letter-spacing: normal;
@@ -150,11 +152,13 @@
     text-align: left;
     text-decoration: underline;
     text-transform: uppercase;
+    margin-bottom: 34px;
   }
 
   @media (max-width: 575.98px) {
     &__info-item {
       font-size: 2.6em;
+      margin-bottom: 14px;
     }
   }