Fixed settings page and modals

src/components/UI/ModalCreate/ModalCreate.js

@@ -4,7 +4,7 @@ import { setProject } from "../../../redux/projectsTrackerSlice";
 
 import "./ModalCreate.scss";
 
-export const ModalCreate = ({ active, setActive, title }) => {
+export const ModalCreate = ({ active, setActive, title, desc }) => {
   const [inputValue, setInputValue] = useState("");
   const dispatch = useDispatch();
 
@@ -33,6 +33,7 @@ export const ModalCreate = ({ active, setActive, title }) => {
       >
         <div className="title-project">
           <h4>{title}</h4>
+          <p>{desc}</p>
           <div className="input-container">
             <input
               className="name-project"

src/pages/PartnerSettings/partnerSettings.scss

@@ -2,7 +2,7 @@
   background: #f1f1f1;
   height: 100%;
   min-height: 100vh;
-  font-family: 'LabGrotesque', sans-serif;
+  font-family: "LabGrotesque", sans-serif;
 
   .infoPersonal__title {
     color: #000000;
@@ -92,6 +92,19 @@
     }
   }
 
+  @media (max-width: 1200px) {
+    &__input {
+      width: 100%;
+    }
+
+    &__buttons {
+      &-cancel,
+      &-save {
+        width: 120px;
+      }
+    }
+  }
+
   @media (max-width: 570px) {
     &__input {
       width: 95%;
@@ -191,15 +204,54 @@
   @media (max-width: 1200px) {
     margin-bottom: 15px;
 
+    &__logo {
+      flex-direction: column;
+      align-items: flex-start;
+    }
+
+    &__body {
+      margin-bottom: 100px;
+    }
+
+    &__report,
+    &__login {
+      width: 45%;
+      height: auto;
+    }
+
+    &__label {
+      &-second,
+      &-first {
+        flex-direction: row;
+      }
+    }
+  }
+
+  @media (max-width: 950px) {
     &__body {
       flex-direction: column;
+      margin-bottom: 20px;
+      align-items: center;
     }
+
+    &__report,
+    &__login {
+      width: 60%;
+    }
+
     &__report {
-      margin-top: 50px;
+      margin-top: 55px;
+      margin-bottom: 55px;
     }
   }
 
   @media (max-width: 570px) {
+    &__body {
+      flex-direction: column;
+      margin-bottom: 20px;
+      align-items: center;
+    }
+
     &__report,
     &__login {
       width: 100%;
@@ -207,6 +259,10 @@
       padding: 20px 30px;
     }
 
+    &__report {
+      margin-top: 55px;
+    }
+
     &__logo {
       flex-direction: column;
       align-items: flex-start;
@@ -218,6 +274,7 @@
         flex-direction: row;
       }
     }
+
     .checkbox {
       &__second {
         margin: 0px 0 0 20px;

src/pages/Tracker/Tracker.js

@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 
 import { ProfileHeader } from "../../components/ProfileHeader/ProfileHeader";
-import {ProfileBreadcrumbs} from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
+import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
 import { Footer } from "../../components/Footer/Footer";
 
 import { useDispatch, useSelector } from "react-redux";
@@ -364,6 +364,12 @@ export const Tracker = () => {
   function createTiket() {
     tabTaskMok.filter((item) => {
       if (item.name == selectedTab.name) {
+        let idItem = 0;
+
+        item.tasks.forEach((item) => {
+          idItem = item.id;
+        });
+
         let newTiket = {
           task: valueTiket,
           description: "Сверстать часть таблицы. Сверстать часть таблицы",
@@ -371,7 +377,7 @@ export const Tracker = () => {
           files: 0,
           avatarCreated: avatarTest,
           avatarDo: avatarTest,
-          id: item.tasks.length + 1,
+          id: idItem + 1,
         };
 
         item.tasks.push(newTiket);
@@ -398,9 +404,10 @@ export const Tracker = () => {
       <ProfileHeader />
       <div className="container">
         <div className="tracker__content">
-          <ProfileBreadcrumbs links={[
+          <ProfileBreadcrumbs
-            {name: 'Главная', link: '/profile'},
+            links={[
-            {name: 'Трекер', link: '/profile/tracker'}
+              { name: "Главная", link: "/profile" },
+              { name: "Трекер", link: "/profile/tracker" },
             ]}
           />
           <h2 className="tracker__title">Трекер</h2>
@@ -477,7 +484,7 @@ export const Tracker = () => {
                       onClick={(e) => e.stopPropagation()}
                     >
                       <div className="title-project">
-                        <h4>Введите название карточки</h4>
+                        <h4>Введите название новой колонки</h4>
                         <div className="input-container">
                           <input
                             className="name-project"