Fixed settings page and modals

This commit is contained in:
MaxOvs19 2023-04-03 14:37:27 +03:00
parent 9bab7d17cd
commit 8bd7bb7535
3 changed files with 75 additions and 10 deletions

View File

@ -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"

View File

@ -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;

View File

@ -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={[
{name: 'Главная', link: '/profile'},
{name: 'Трекер', link: '/profile/tracker'}
<ProfileBreadcrumbs
links={[
{ 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"