refactoring allStyles styleStyle -> style-style
This commit is contained in:
@ -6,10 +6,10 @@ import "./acceptModal.scss";
|
||||
|
||||
export const AcceptModal = ({ title, closeModal, agreeHandler }) => {
|
||||
return (
|
||||
<div className="backDrop">
|
||||
<div className="acceptModal">
|
||||
<h3 className="acceptModal__title">{title}</h3>
|
||||
<div className="acceptModal__buttons">
|
||||
<div className="back-drop">
|
||||
<div className="accept-modal">
|
||||
<h3 className="accept-modal__title">{title}</h3>
|
||||
<div className="accept-modal__buttons">
|
||||
<button
|
||||
className="agree"
|
||||
onClick={() => {
|
||||
@ -24,7 +24,7 @@ export const AcceptModal = ({ title, closeModal, agreeHandler }) => {
|
||||
</button>
|
||||
</div>
|
||||
<img
|
||||
className="acceptModal__close"
|
||||
className="accept-modal__close"
|
||||
src={close}
|
||||
alt="close"
|
||||
onClick={closeModal}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.backDrop {
|
||||
.back-drop {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
@ -10,7 +10,7 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.acceptModal {
|
||||
.accept-modal {
|
||||
border-radius: 20px;
|
||||
background: linear-gradient(180deg, #fff 0%, #ebebeb 100%);
|
||||
padding: 50px 34px 25px;
|
||||
|
||||
@ -71,7 +71,7 @@ export const ModalRegistration = ({ active, setActive }) => {
|
||||
|
||||
<div className="input-body">
|
||||
<div className="input-body__box">
|
||||
<div className="inputContainer">
|
||||
<div className="input-container">
|
||||
<h5>Ваше имя</h5>
|
||||
<input
|
||||
className={validationErrors.username ? "error" : ""}
|
||||
@ -82,7 +82,7 @@ export const ModalRegistration = ({ active, setActive }) => {
|
||||
/>
|
||||
<span>{validationErrors.username}</span>
|
||||
</div>
|
||||
<div className="inputContainer">
|
||||
<div className="input-container">
|
||||
<h5>E-mail</h5>
|
||||
<input
|
||||
type="email"
|
||||
@ -97,7 +97,7 @@ export const ModalRegistration = ({ active, setActive }) => {
|
||||
</div>
|
||||
|
||||
<div className="input-body__box">
|
||||
<div className="inputContainer">
|
||||
<div className="input-container">
|
||||
<h5>Пароль</h5>
|
||||
<input
|
||||
className={validationErrors.password ? "error" : ""}
|
||||
@ -109,7 +109,7 @@ export const ModalRegistration = ({ active, setActive }) => {
|
||||
/>
|
||||
<span>{validationErrors.password}</span>
|
||||
</div>
|
||||
<div className="inputContainer">
|
||||
<div className="input-container">
|
||||
<h5>Повторите пароль</h5>
|
||||
<input
|
||||
className={validationErrors.secondPassword ? "error" : ""}
|
||||
|
||||
@ -112,7 +112,7 @@
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.inputContainer {
|
||||
.input-container {
|
||||
margin: 0 0 20px 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@ -6,17 +6,17 @@ import "./modalReset.scss";
|
||||
|
||||
export const ModalReset = ({ setModalReset }) => {
|
||||
return (
|
||||
<div className="modalReset">
|
||||
<h3 className="modalReset__title">Восстановление доступа</h3>
|
||||
<div className="modalReset__input">
|
||||
<div className="modal-reset">
|
||||
<h3 className="modal-reset__title">Восстановление доступа</h3>
|
||||
<div className="modal-reset__input">
|
||||
<span>Укажите e-mail, для которого хотите восстановить пароль.</span>
|
||||
<input placeholder="e-mail" />
|
||||
</div>
|
||||
<button className="modalReset__submit">Восстановить</button>
|
||||
<button className="modal-reset__submit">Восстановить</button>
|
||||
<img
|
||||
onClick={() => setModalReset(false)}
|
||||
src={close}
|
||||
className="modalReset__close"
|
||||
className="modal-reset__close"
|
||||
alt="close"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.modalReset {
|
||||
.modal-reset {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 20px;
|
||||
background: linear-gradient(180deg, #FFF 0%, #EBEBEB 100%);
|
||||
background: linear-gradient(180deg, #fff 0%, #ebebeb 100%);
|
||||
padding: 23px 110px 8px 36px;
|
||||
row-gap: 29px;
|
||||
position: relative;
|
||||
@ -28,7 +28,7 @@
|
||||
padding: 8px 12px;
|
||||
font-size: 15px;
|
||||
border-radius: 8px;
|
||||
background-color: #EFF2F7;
|
||||
background-color: #eff2f7;
|
||||
outline: none;
|
||||
border: none;
|
||||
max-width: 300px;
|
||||
@ -37,9 +37,9 @@
|
||||
|
||||
&__submit {
|
||||
border-radius: 44px;
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
padding: 9px 46px;
|
||||
color: #FFF;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 32px;
|
||||
|
||||
@ -117,16 +117,16 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
};
|
||||
return (
|
||||
<ModalLayout active={active} setActive={setActive}>
|
||||
<div className="resetPassword">
|
||||
<div className="reset-password">
|
||||
<img
|
||||
className="resetPassword__close"
|
||||
className="reset-password__close"
|
||||
src={close}
|
||||
alt="close"
|
||||
onClick={() => setActive(false)}
|
||||
/>
|
||||
<h3 className="resetPassword__title">Восстановление пароля</h3>
|
||||
<h3 className="reset-password__title">Восстановление пароля</h3>
|
||||
{!step ? (
|
||||
<div className="resetPassword__email">
|
||||
<div className="reset-password__email">
|
||||
<h5>Введите ваш e-mail:</h5>
|
||||
<input
|
||||
type="email"
|
||||
@ -149,7 +149,7 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
<Loader style={"green"} />
|
||||
) : (
|
||||
<button
|
||||
className="resetPassword__btn"
|
||||
className="reset-password__btn"
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
submitHandler();
|
||||
@ -160,11 +160,11 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="resetPassword__email">
|
||||
<div className="reset-password__email">
|
||||
<img
|
||||
src={arrow}
|
||||
onClick={() => setStep(false)}
|
||||
className="resetPassword__email__arrow"
|
||||
className="reset-password__email__arrow"
|
||||
/>
|
||||
<h5>Введите код подтверждения:</h5>
|
||||
<input
|
||||
@ -185,7 +185,7 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
placeholder="token"
|
||||
/>
|
||||
{inputsError.token && (
|
||||
<span className="warningText">Введите данные</span>
|
||||
<span className="warning-text">Введите данные</span>
|
||||
)}
|
||||
<h5>Введите новый пароль:</h5>
|
||||
<input
|
||||
@ -206,13 +206,13 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
className={inputsError.password ? "error" : ""}
|
||||
/>
|
||||
{inputsError.password && (
|
||||
<span className="warningText">Минимум 6 символов</span>
|
||||
<span className="warning-text">Минимум 6 символов</span>
|
||||
)}
|
||||
{loader ? (
|
||||
<Loader style={"green"} />
|
||||
) : (
|
||||
<button
|
||||
className="resetPassword__btn"
|
||||
className="reset-password__btn"
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
resetPassword();
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.resetPassword {
|
||||
.reset-password {
|
||||
width: 280px;
|
||||
position: relative;
|
||||
|
||||
@ -62,7 +62,14 @@
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #ffffff;
|
||||
background-image: linear-gradient(to top, #6aaf5c 0%, #52b709 100%), linear-gradient(36deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 47%, rgba(255, 255, 255, 0.17) 50%, rgba(255, 255, 255, 0) 100%);
|
||||
background-image: linear-gradient(to top, #6aaf5c 0%, #52b709 100%),
|
||||
linear-gradient(
|
||||
36deg,
|
||||
rgba(255, 255, 255, 0) 0%,
|
||||
rgba(255, 255, 255, 0.16) 47%,
|
||||
rgba(255, 255, 255, 0.17) 50%,
|
||||
rgba(255, 255, 255, 0) 100%
|
||||
);
|
||||
color: #ffffff;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
@ -75,7 +82,7 @@
|
||||
border: 1px solid red;
|
||||
}
|
||||
|
||||
.warningText {
|
||||
.warning-text {
|
||||
color: red;
|
||||
font-size: 12px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
@ -7,11 +7,11 @@ import "./modalTrackerRegistration.scss";
|
||||
|
||||
export const ModalTrackerRegistration = ({ setModalReset, email }) => {
|
||||
return (
|
||||
<div className="modalConfirmTracker">
|
||||
<h3 className="modalConfirmTracker__title">
|
||||
<div className="modal-confirm-tracker">
|
||||
<h3 className="modal-confirm-tracker__title">
|
||||
Спасибо за регистрацию. Теперь можете войти в кабинет
|
||||
</h3>
|
||||
<p className="modalConfirmTracker__info">
|
||||
<p className="modal-confirm-tracker__info">
|
||||
Мы отправили ссылку
|
||||
<br />
|
||||
для активации вашего аккаунта на почту
|
||||
@ -20,14 +20,14 @@ export const ModalTrackerRegistration = ({ setModalReset, email }) => {
|
||||
<Link
|
||||
to={"/registration-setting"}
|
||||
onClick={() => setModalReset(false)}
|
||||
className="modalConfirmTracker__btn"
|
||||
className="modal-confirm-tracker__btn"
|
||||
>
|
||||
Понятно
|
||||
</Link>
|
||||
<img
|
||||
onClick={() => setModalReset(false)}
|
||||
src={close}
|
||||
className="modalReset__close"
|
||||
className="modal-reset__close"
|
||||
alt="close"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.modalConfirmTracker {
|
||||
.modal-confirm-tracker {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@ -27,13 +27,13 @@
|
||||
|
||||
&__btn {
|
||||
border-radius: 44px;
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
outline: none;
|
||||
border: none;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 32px;
|
||||
color: #FFF;
|
||||
color: #fff;
|
||||
padding: 9px 37px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.projectPersons {
|
||||
.project-persons {
|
||||
display: flex;
|
||||
position: relative;
|
||||
left: 5px;
|
||||
@ -37,7 +37,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.onePerson {
|
||||
.one-person {
|
||||
display: flex;
|
||||
position: relative;
|
||||
left: -15px;
|
||||
@ -63,7 +63,7 @@
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.countPersons {
|
||||
.count-persons {
|
||||
color: #252c32;
|
||||
border: 1px solid #dde2e4;
|
||||
background: white;
|
||||
|
||||
@ -558,7 +558,7 @@ export const ModalTiсket = ({
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("button-add-worker") ||
|
||||
div.classList.contains("dropdownList"))
|
||||
div.classList.contains("dropdown-list"))
|
||||
)
|
||||
) {
|
||||
setDropListOpen(false);
|
||||
@ -570,7 +570,7 @@ export const ModalTiсket = ({
|
||||
!path.find(
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("deadLine") ||
|
||||
(div.classList.contains("dead-line") ||
|
||||
div.classList.contains("react-datepicker-popper"))
|
||||
)
|
||||
) {
|
||||
@ -622,7 +622,7 @@ export const ModalTiсket = ({
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<h5 className="taskName">{inputsValue.title}</h5>
|
||||
<h5 className="task-name">{inputsValue.title}</h5>
|
||||
)}
|
||||
<div className="content__description">
|
||||
{editOpen ? (
|
||||
@ -674,13 +674,13 @@ export const ModalTiсket = ({
|
||||
</div>
|
||||
)}
|
||||
{/*{uploadedFile && (*/}
|
||||
{/* <div className="fileLoaded">*/}
|
||||
{/* <div className="file-loaded">*/}
|
||||
{/* {uploadedFile.map((file) => {*/}
|
||||
{/* return (*/}
|
||||
{/* <div className="loadedFile" key={file.id}>*/}
|
||||
{/* <div className="loaded-file" key={file.id}>*/}
|
||||
{/* <img src={backendImg(file.url)} alt="img" key={file.id} />*/}
|
||||
{/* <div*/}
|
||||
{/* className="deleteFile"*/}
|
||||
{/* className="delete-file"*/}
|
||||
{/* onClick={() => deleteLoadedFile(file)}*/}
|
||||
{/* >*/}
|
||||
{/* <img src={close} alt="delete" />*/}
|
||||
@ -781,7 +781,7 @@ export const ModalTiсket = ({
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="add-worker moreItems ">
|
||||
<div className="add-worker more-items">
|
||||
<button
|
||||
className="button-add-worker"
|
||||
onClick={() => setDropListOpen(true)}
|
||||
@ -790,16 +790,16 @@ export const ModalTiсket = ({
|
||||
</button>
|
||||
<span>Добавить исполнителя</span>
|
||||
{dropListOpen && (
|
||||
<div className="dropdownList">
|
||||
<div className="dropdown-list">
|
||||
<img
|
||||
src={close}
|
||||
className="dropdownList__close"
|
||||
className="dropdown-list__close"
|
||||
onClick={() => setDropListOpen(false)}
|
||||
/>
|
||||
{correctProjectUsers.map((person) => {
|
||||
return (
|
||||
<div
|
||||
className="dropdownList__person"
|
||||
className="dropdown-list__person"
|
||||
key={person.user_id}
|
||||
onClick={() => taskExecutor(person)}
|
||||
>
|
||||
@ -848,7 +848,7 @@ export const ModalTiсket = ({
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="add-worker moreItems">
|
||||
<div className="add-worker more-items">
|
||||
<button
|
||||
className="button-add-worker"
|
||||
onClick={() => setDropListMembersOpen(true)}
|
||||
@ -857,17 +857,17 @@ export const ModalTiсket = ({
|
||||
</button>
|
||||
<span>Добавить участников</span>
|
||||
{dropListMembersOpen && (
|
||||
<div className="dropdownList">
|
||||
<div className="dropdown-list">
|
||||
<img
|
||||
src={close}
|
||||
className="dropdownList__close"
|
||||
className="dropdown-list__close"
|
||||
onClick={() => setDropListMembersOpen(false)}
|
||||
/>
|
||||
{users.length ? (
|
||||
users.map((person) => {
|
||||
return (
|
||||
<div
|
||||
className="dropdownList__person"
|
||||
className="dropdown-list__person"
|
||||
key={person.user_id}
|
||||
onClick={() => addMember(person)}
|
||||
>
|
||||
@ -884,7 +884,7 @@ export const ModalTiсket = ({
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<p className="noUsers">Нет пользователей</p>
|
||||
<p className="no-users">Нет пользователей</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
@ -892,9 +892,9 @@ export const ModalTiсket = ({
|
||||
</div>
|
||||
|
||||
<div className="workers_box-middle">
|
||||
<div className="deadLine">
|
||||
<div className="dead-line">
|
||||
<div
|
||||
className="deadLine__container"
|
||||
className="dead-line__container"
|
||||
onClick={() => setDatePickerOpen(!datePickerOpen)}
|
||||
>
|
||||
<img src={calendarIcon} alt="calendar" />
|
||||
@ -994,7 +994,7 @@ export const ModalTiсket = ({
|
||||
{correctProjectTags.map((tag) => {
|
||||
return (
|
||||
<div
|
||||
className="tagItem"
|
||||
className="tag-item"
|
||||
key={tag.id}
|
||||
onClick={() => addTagToTask(tag.id)}
|
||||
>
|
||||
@ -1004,7 +1004,7 @@ export const ModalTiсket = ({
|
||||
);
|
||||
})}
|
||||
{!Boolean(correctProjectTags.length) && (
|
||||
<p className="tags__dropDown__noItem">Нет тегов</p>
|
||||
<p className="tags__dropDown__no-item">Нет тегов</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -143,7 +143,7 @@
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.taskName {
|
||||
.task-name {
|
||||
display: -webkit-box;
|
||||
max-width: 550px;
|
||||
overflow: hidden;
|
||||
@ -152,11 +152,11 @@
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.fullName {
|
||||
.full-name {
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.fullDescription {
|
||||
.full-description {
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
@ -195,7 +195,7 @@
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
&__subComment {
|
||||
&__sub-comment {
|
||||
&:before {
|
||||
content: "";
|
||||
background: #e4e4e6;
|
||||
@ -368,22 +368,22 @@
|
||||
margin-top: 33px;
|
||||
overflow-y: auto;
|
||||
|
||||
.taskFile {
|
||||
.task-file {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
.imgFile {
|
||||
.img-file {
|
||||
max-width: 170px;
|
||||
max-height: 104px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.deleteFile {
|
||||
.delete-file {
|
||||
background: rgb(226, 226, 226, 0.6);
|
||||
}
|
||||
}
|
||||
|
||||
.deleteFile {
|
||||
.delete-file {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
@ -404,7 +404,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.ImgOpened {
|
||||
.img-opened {
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
@ -416,7 +416,7 @@
|
||||
z-index: 100;
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
|
||||
.imgFile {
|
||||
.img-file {
|
||||
width: 90vw;
|
||||
height: 90vh;
|
||||
max-width: none;
|
||||
@ -425,18 +425,18 @@
|
||||
}
|
||||
}
|
||||
|
||||
.fileLoaded {
|
||||
.file-loaded {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 10px 0 0;
|
||||
|
||||
.loadedFile {
|
||||
.loaded-file {
|
||||
position: relative;
|
||||
img {
|
||||
max-width: 100px;
|
||||
object-fit: contain;
|
||||
}
|
||||
.deleteFile {
|
||||
.delete-file {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
@ -456,7 +456,7 @@
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
.deleteFile {
|
||||
.delete-file {
|
||||
background: rgb(226, 226, 226, 0.6);
|
||||
}
|
||||
}
|
||||
@ -727,7 +727,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.deadLine {
|
||||
.dead-line {
|
||||
position: relative;
|
||||
&__container {
|
||||
padding: 5px 10px 5px;
|
||||
@ -925,7 +925,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.dropdownList {
|
||||
.dropdown-list {
|
||||
position: absolute;
|
||||
background: white;
|
||||
padding: 10px;
|
||||
@ -938,7 +938,7 @@
|
||||
flex-direction: column;
|
||||
row-gap: 8px;
|
||||
|
||||
.noUsers {
|
||||
.no-users {
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
@ -1065,7 +1065,7 @@
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.tagItem {
|
||||
.tag-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@ -1092,7 +1092,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__noItem {
|
||||
&__no-item {
|
||||
line-height: 20px;
|
||||
font-size: 15px;
|
||||
margin: 0;
|
||||
|
||||
@ -565,7 +565,7 @@ export const TicketFullScreen = () => {
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("button-add-worker") ||
|
||||
div.classList.contains("dropdownList"))
|
||||
div.classList.contains("dropdown-list"))
|
||||
)
|
||||
) {
|
||||
setDropListOpen(false);
|
||||
@ -577,7 +577,7 @@ export const TicketFullScreen = () => {
|
||||
!path.find(
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("deadLine") ||
|
||||
(div.classList.contains("dead-line") ||
|
||||
div.classList.contains("react-datepicker-popper"))
|
||||
)
|
||||
) {
|
||||
@ -674,7 +674,7 @@ export const TicketFullScreen = () => {
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<h5 className="fullName nameFullScreen">
|
||||
<h5 className="full-name name-fullscreen">
|
||||
{inputsValue.title}
|
||||
</h5>
|
||||
)}
|
||||
@ -708,7 +708,7 @@ export const TicketFullScreen = () => {
|
||||
) : (
|
||||
<div className="ticket__description">
|
||||
<div
|
||||
className="fullDescription fullScreenDescription"
|
||||
className="full-description fullscreen-description"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: inputsValue.description
|
||||
}}
|
||||
@ -717,7 +717,7 @@ export const TicketFullScreen = () => {
|
||||
)}
|
||||
</div>
|
||||
{Boolean(taskFiles.length) && (
|
||||
<div className="task__files filesFullScreen">
|
||||
<div className="task__files files-fullscreen">
|
||||
{taskFiles.map((file) => {
|
||||
return (
|
||||
<FileTracker
|
||||
@ -731,17 +731,17 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
)}
|
||||
{uploadedFile && (
|
||||
<div className="fileLoaded">
|
||||
<div className="file-loaded">
|
||||
{uploadedFile.map((file) => {
|
||||
return (
|
||||
<div className="loadedFile" key={file.id}>
|
||||
<div className="loaded-file" key={file.id}>
|
||||
<img
|
||||
src={backendImg(file.url)}
|
||||
alt="img"
|
||||
key={file.id}
|
||||
/>
|
||||
<div
|
||||
className="deleteFile"
|
||||
className="delete-file"
|
||||
onClick={() => deleteLoadedFile(file)}
|
||||
>
|
||||
<img src={fileDelete} alt="delete" />
|
||||
@ -775,7 +775,7 @@ export const TicketFullScreen = () => {
|
||||
{caseOfNum(taskFiles.length, "files")}
|
||||
</div>
|
||||
</div>
|
||||
<div className="content__input commentFullScreen">
|
||||
<div className="content__input comment-fullscreen">
|
||||
<input
|
||||
placeholder="Оставить комментарий"
|
||||
value={inputsValue.comment}
|
||||
@ -809,7 +809,7 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="workers fullScreenWorkers">
|
||||
<div className="workers fullscreen-workers">
|
||||
<div className="workers_box task__info">
|
||||
<div className="workers__creator">
|
||||
Создатель: <p> {taskInfo.user?.fio}</p>
|
||||
@ -836,7 +836,7 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="add-worker moreItems ">
|
||||
<div className="add-worker more-items ">
|
||||
<button
|
||||
className="button-add-worker"
|
||||
onClick={() => setDropListOpen(true)}
|
||||
@ -845,16 +845,16 @@ export const TicketFullScreen = () => {
|
||||
</button>
|
||||
<span>Добавить исполнителя</span>
|
||||
{dropListOpen && (
|
||||
<div className="dropdownList">
|
||||
<div className="dropdown-list">
|
||||
<img
|
||||
src={close}
|
||||
className="dropdownList__close"
|
||||
className="dropdown-list__close"
|
||||
onClick={() => setDropListOpen(false)}
|
||||
/>
|
||||
{correctProjectUsers.map((person) => {
|
||||
return (
|
||||
<div
|
||||
className="dropdownList__person"
|
||||
className="dropdown-list__person"
|
||||
key={person.user_id}
|
||||
onClick={() => taskExecutor(person)}
|
||||
>
|
||||
@ -901,7 +901,7 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<div className="add-worker moreItems">
|
||||
<div className="add-worker more-items">
|
||||
<button
|
||||
className="button-add-worker"
|
||||
onClick={() => setDropListMembersOpen(true)}
|
||||
@ -910,17 +910,17 @@ export const TicketFullScreen = () => {
|
||||
</button>
|
||||
<span>Добавить участников</span>
|
||||
{dropListMembersOpen && (
|
||||
<div className="dropdownList">
|
||||
<div className="dropdown-list">
|
||||
<img
|
||||
src={close}
|
||||
className="dropdownList__close"
|
||||
className="dropdown-list__close"
|
||||
onClick={() => setDropListMembersOpen(false)}
|
||||
/>
|
||||
{users.length ? (
|
||||
users.map((person) => {
|
||||
return (
|
||||
<div
|
||||
className="dropdownList__person"
|
||||
className="dropdown-list__person"
|
||||
key={person.user_id}
|
||||
onClick={() => addMember(person)}
|
||||
>
|
||||
@ -937,7 +937,7 @@ export const TicketFullScreen = () => {
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<p className="noUsers">Нет пользователей</p>
|
||||
<p className="no-users">Нет пользователей</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
@ -945,9 +945,9 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
|
||||
<div className="workers_box-middle">
|
||||
<div className="deadLine">
|
||||
<div className="dead-line">
|
||||
<div
|
||||
className="deadLine__container"
|
||||
className="dead-line__container"
|
||||
onClick={() => setDatePickerOpen(!datePickerOpen)}
|
||||
>
|
||||
<img src={calendarIcon} alt="calendar" />
|
||||
@ -1050,7 +1050,7 @@ export const TicketFullScreen = () => {
|
||||
{correctProjectTags.map((tag) => {
|
||||
return (
|
||||
<div
|
||||
className="tagItem"
|
||||
className="tag-item"
|
||||
key={tag.id}
|
||||
onClick={() => addTagToTask(tag.id)}
|
||||
>
|
||||
@ -1060,7 +1060,7 @@ export const TicketFullScreen = () => {
|
||||
);
|
||||
})}
|
||||
{!Boolean(correctProjectTags.length) && (
|
||||
<p className="tags__dropDown__noItem">Нет тегов</p>
|
||||
<p className="tags__dropDown__no-item">Нет тегов</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -2,11 +2,11 @@
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.fullName {
|
||||
.full-name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span {
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 17px;
|
||||
@ -39,7 +39,7 @@
|
||||
span {
|
||||
display: flex;
|
||||
width: 120px;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 17px;
|
||||
@ -47,9 +47,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
.fullScreenWorkers {
|
||||
.fullscreen-workers {
|
||||
@media (max-width: 880px) {
|
||||
background: #DFF1FF;
|
||||
background: #dff1ff;
|
||||
|
||||
.workers_box {
|
||||
@media (max-width: 880px) {
|
||||
@ -62,7 +62,6 @@
|
||||
.workers__creator {
|
||||
margin-bottom: 0 !important;
|
||||
display: flex;
|
||||
|
||||
}
|
||||
|
||||
.add-worker {
|
||||
@ -85,7 +84,7 @@
|
||||
gap: 20px;
|
||||
border-bottom: none !important;
|
||||
|
||||
.deadLine {
|
||||
.dead-line {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@ -123,13 +122,13 @@
|
||||
}
|
||||
}
|
||||
|
||||
.commentFullScreen {
|
||||
.comment-fullscreen {
|
||||
@media (max-width: 520px) {
|
||||
width: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.filesFullScreen {
|
||||
.files-fullscreen {
|
||||
@media (max-width: 520px) {
|
||||
justify-content: space-evenly;
|
||||
max-height: 400px !important;
|
||||
@ -142,13 +141,13 @@
|
||||
}
|
||||
}
|
||||
|
||||
.nameFullScreen {
|
||||
.name-fullscreen {
|
||||
@media (max-width: 520px) {
|
||||
white-space: inherit !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fullScreenDescription {
|
||||
.fullscreen-description {
|
||||
@media (max-width: 1190px) {
|
||||
white-space: inherit !important;
|
||||
}
|
||||
|
||||
@ -487,8 +487,8 @@ export const TrackerModal = ({
|
||||
{modalType === "create-ticket-project" && (
|
||||
<>
|
||||
<div className="title-project">
|
||||
<div className="createTaskHead">
|
||||
<div className="createTaskBody__right__owner">
|
||||
<div className="create-task-head">
|
||||
<div className="create-task-body__right__owner">
|
||||
<p>Создатель: {profileInfo?.fio}</p>
|
||||
<img
|
||||
src={
|
||||
@ -500,8 +500,8 @@ export const TrackerModal = ({
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="createTaskBody">
|
||||
<div className="createTaskBody__left">
|
||||
<div className="create-task-body">
|
||||
<div className="create-task-body__left">
|
||||
<h4>Введите название и описание задачи</h4>
|
||||
<div className="input-container">
|
||||
<input
|
||||
@ -534,14 +534,14 @@ export const TrackerModal = ({
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="createTaskBody__right">
|
||||
<div className="createTaskBody__right__tags">
|
||||
<div className="create-task-body__right">
|
||||
<div className="create-task-body__right__tags">
|
||||
<div className="tags__selected">
|
||||
<div className="tags__selected__items">
|
||||
{taskTags.map((tag) => {
|
||||
return (
|
||||
<div
|
||||
className="selectedTag"
|
||||
className="selected-tag"
|
||||
key={tag.id}
|
||||
style={{ background: tag.color }}
|
||||
>
|
||||
@ -598,7 +598,7 @@ export const TrackerModal = ({
|
||||
);
|
||||
})}
|
||||
{Boolean(!correctProjectTags.length) && (
|
||||
<p className="noTags">Нет тегов</p>
|
||||
<p className="no-tags">Нет тегов</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
@ -690,7 +690,7 @@ export const TrackerModal = ({
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="createTaskBody__right__deadLine">
|
||||
<div className="create-task-body__right__dead-line">
|
||||
<img src={calendarImg} alt="calendar" />
|
||||
<span>Срок исполнения</span>
|
||||
<img src={arrowRight} className="arrow" alt="arrow" />
|
||||
|
||||
@ -293,7 +293,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.createTaskHead {
|
||||
.create-task-head {
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
display: flex;
|
||||
@ -307,7 +307,7 @@
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
&__selectColumn {
|
||||
&__select-column {
|
||||
display: flex;
|
||||
column-gap: 8px;
|
||||
cursor: pointer;
|
||||
@ -323,7 +323,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.createTaskBody {
|
||||
.create-task-body {
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
column-gap: 20px;
|
||||
@ -436,7 +436,7 @@
|
||||
gap: 8px;
|
||||
max-width: 393px;
|
||||
|
||||
.selectedTag {
|
||||
.selected-tag {
|
||||
display: flex;
|
||||
padding: 7px 7px 7px 8px;
|
||||
border-radius: 35px;
|
||||
@ -513,7 +513,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.noTags {
|
||||
.no-tags {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
}
|
||||
@ -591,7 +591,7 @@
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
&__deadLine {
|
||||
&__dead-line {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 18px;
|
||||
|
||||
Reference in New Issue
Block a user