Fixed settings page and modals
This commit is contained in:
parent
9bab7d17cd
commit
8bd7bb7535
@ -4,7 +4,7 @@ import { setProject } from "../../../redux/projectsTrackerSlice";
|
|||||||
|
|
||||||
import "./ModalCreate.scss";
|
import "./ModalCreate.scss";
|
||||||
|
|
||||||
export const ModalCreate = ({ active, setActive, title }) => {
|
export const ModalCreate = ({ active, setActive, title, desc }) => {
|
||||||
const [inputValue, setInputValue] = useState("");
|
const [inputValue, setInputValue] = useState("");
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
@ -33,6 +33,7 @@ export const ModalCreate = ({ active, setActive, title }) => {
|
|||||||
>
|
>
|
||||||
<div className="title-project">
|
<div className="title-project">
|
||||||
<h4>{title}</h4>
|
<h4>{title}</h4>
|
||||||
|
<p>{desc}</p>
|
||||||
<div className="input-container">
|
<div className="input-container">
|
||||||
<input
|
<input
|
||||||
className="name-project"
|
className="name-project"
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
background: #f1f1f1;
|
background: #f1f1f1;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
font-family: 'LabGrotesque', sans-serif;
|
font-family: "LabGrotesque", sans-serif;
|
||||||
|
|
||||||
.infoPersonal__title {
|
.infoPersonal__title {
|
||||||
color: #000000;
|
color: #000000;
|
||||||
@ -92,6 +92,19 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1200px) {
|
||||||
|
&__input {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__buttons {
|
||||||
|
&-cancel,
|
||||||
|
&-save {
|
||||||
|
width: 120px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 570px) {
|
@media (max-width: 570px) {
|
||||||
&__input {
|
&__input {
|
||||||
width: 95%;
|
width: 95%;
|
||||||
@ -191,15 +204,54 @@
|
|||||||
@media (max-width: 1200px) {
|
@media (max-width: 1200px) {
|
||||||
margin-bottom: 15px;
|
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 {
|
&__body {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&__report,
|
||||||
|
&__login {
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
|
|
||||||
&__report {
|
&__report {
|
||||||
margin-top: 50px;
|
margin-top: 55px;
|
||||||
|
margin-bottom: 55px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 570px) {
|
@media (max-width: 570px) {
|
||||||
|
&__body {
|
||||||
|
flex-direction: column;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
&__report,
|
&__report,
|
||||||
&__login {
|
&__login {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -207,6 +259,10 @@
|
|||||||
padding: 20px 30px;
|
padding: 20px 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&__report {
|
||||||
|
margin-top: 55px;
|
||||||
|
}
|
||||||
|
|
||||||
&__logo {
|
&__logo {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
@ -218,6 +274,7 @@
|
|||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.checkbox {
|
.checkbox {
|
||||||
&__second {
|
&__second {
|
||||||
margin: 0px 0 0 20px;
|
margin: 0px 0 0 20px;
|
||||||
|
@ -364,6 +364,12 @@ export const Tracker = () => {
|
|||||||
function createTiket() {
|
function createTiket() {
|
||||||
tabTaskMok.filter((item) => {
|
tabTaskMok.filter((item) => {
|
||||||
if (item.name == selectedTab.name) {
|
if (item.name == selectedTab.name) {
|
||||||
|
let idItem = 0;
|
||||||
|
|
||||||
|
item.tasks.forEach((item) => {
|
||||||
|
idItem = item.id;
|
||||||
|
});
|
||||||
|
|
||||||
let newTiket = {
|
let newTiket = {
|
||||||
task: valueTiket,
|
task: valueTiket,
|
||||||
description: "Сверстать часть таблицы. Сверстать часть таблицы",
|
description: "Сверстать часть таблицы. Сверстать часть таблицы",
|
||||||
@ -371,7 +377,7 @@ export const Tracker = () => {
|
|||||||
files: 0,
|
files: 0,
|
||||||
avatarCreated: avatarTest,
|
avatarCreated: avatarTest,
|
||||||
avatarDo: avatarTest,
|
avatarDo: avatarTest,
|
||||||
id: item.tasks.length + 1,
|
id: idItem + 1,
|
||||||
};
|
};
|
||||||
|
|
||||||
item.tasks.push(newTiket);
|
item.tasks.push(newTiket);
|
||||||
@ -398,9 +404,10 @@ export const Tracker = () => {
|
|||||||
<ProfileHeader />
|
<ProfileHeader />
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<div className="tracker__content">
|
<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>
|
<h2 className="tracker__title">Трекер</h2>
|
||||||
@ -477,7 +484,7 @@ export const Tracker = () => {
|
|||||||
onClick={(e) => e.stopPropagation()}
|
onClick={(e) => e.stopPropagation()}
|
||||||
>
|
>
|
||||||
<div className="title-project">
|
<div className="title-project">
|
||||||
<h4>Введите название карточки</h4>
|
<h4>Введите название новой колонки</h4>
|
||||||
<div className="input-container">
|
<div className="input-container">
|
||||||
<input
|
<input
|
||||||
className="name-project"
|
className="name-project"
|
||||||
|
Loading…
Reference in New Issue
Block a user