adaptive
This commit is contained in:
parent
03071a7f91
commit
34bf7b55df
@ -746,6 +746,11 @@
|
||||
top: 10px !important;
|
||||
left: -110px !important;
|
||||
z-index: 10;
|
||||
|
||||
@media (max-width: 880px) {
|
||||
left: 0 !important;
|
||||
top: -15px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.react-datepicker__current-month {
|
||||
|
||||
@ -479,7 +479,7 @@ export const TicketFullScreen = () => {
|
||||
<div className="tracker__tabs__head">
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab active-tab"
|
||||
className="tab active-tab projectsTab"
|
||||
onClick={() => toggleTabs(1)}
|
||||
>
|
||||
<img src={project} alt="img" />
|
||||
@ -487,7 +487,7 @@ export const TicketFullScreen = () => {
|
||||
</Link>
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab"
|
||||
className="tab tasksTab"
|
||||
onClick={() => toggleTabs(2)}
|
||||
>
|
||||
<img src={tasks} alt="img" />
|
||||
@ -495,7 +495,7 @@ export const TicketFullScreen = () => {
|
||||
</Link>
|
||||
<Link
|
||||
to="/profile/tracker"
|
||||
className="tab"
|
||||
className="tab archiveTab"
|
||||
onClick={() => toggleTabs(3)}
|
||||
>
|
||||
<img src={archive} alt="img" />
|
||||
@ -626,7 +626,7 @@ export const TicketFullScreen = () => {
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<h5 className="fullName">{inputsValue.title}</h5>
|
||||
<h5 className="fullName nameFullScreen">{inputsValue.title}</h5>
|
||||
)}
|
||||
<div className="content__description">
|
||||
{editOpen ? (
|
||||
@ -657,7 +657,7 @@ export const TicketFullScreen = () => {
|
||||
/>
|
||||
) : (
|
||||
<p
|
||||
className="fullDescription"
|
||||
className="fullDescription fullScreenDescription"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: inputsValue.description,
|
||||
}}
|
||||
@ -665,7 +665,7 @@ export const TicketFullScreen = () => {
|
||||
)}
|
||||
</div>
|
||||
{Boolean(taskFiles.length) && (
|
||||
<div className="task__files">
|
||||
<div className="task__files filesFullScreen">
|
||||
{taskFiles.map((file) => {
|
||||
return (
|
||||
<div className="taskFile" key={file.id}>
|
||||
@ -742,7 +742,7 @@ export const TicketFullScreen = () => {
|
||||
{caseOfNum(taskFiles.length, "files")}
|
||||
</div>
|
||||
</div>
|
||||
<div className="content__input">
|
||||
<div className="content__input commentFullScreen">
|
||||
<input
|
||||
placeholder="Оставить комментарий"
|
||||
value={inputsValue.comment}
|
||||
@ -771,11 +771,11 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="workers">
|
||||
<div className="workers fullScreenWorkers">
|
||||
<div className="workers_box task__info">
|
||||
<p className="workers__creator">
|
||||
Создатель : <br />
|
||||
{taskInfo.user?.fio}
|
||||
Создатель :
|
||||
<p> {taskInfo.user?.fio}</p>
|
||||
</p>
|
||||
|
||||
{taskInfo.executor ? (
|
||||
|
||||
@ -8,6 +8,112 @@
|
||||
|
||||
&-whith {
|
||||
width: 850px !important;
|
||||
|
||||
@media (max-width: 1190px) {
|
||||
width: auto !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 880px) {
|
||||
flex-direction: column !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fullScreenWorkers {
|
||||
@media (max-width: 880px) {
|
||||
background: #DFF1FF;
|
||||
|
||||
.workers_box {
|
||||
@media (max-width: 880px) {
|
||||
flex-direction: inherit !important;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
padding: 10px 18px !important;
|
||||
|
||||
.workers__creator {
|
||||
margin-bottom: 0 !important;
|
||||
display: flex;
|
||||
|
||||
}
|
||||
|
||||
.add-worker {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.executor {
|
||||
p {
|
||||
max-width: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.workers_box-middle {
|
||||
padding: 0 10px !important;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
border-bottom: none !important;
|
||||
|
||||
.deadLine {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.start {
|
||||
margin-top: 0 !important;
|
||||
order: 2;
|
||||
}
|
||||
|
||||
.time {
|
||||
margin-top: 0;
|
||||
order: 3;
|
||||
}
|
||||
}
|
||||
|
||||
.workers_box-bottom {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
padding: 10px !important;
|
||||
|
||||
div {
|
||||
width: 145px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.commentFullScreen {
|
||||
@media (max-width: 520px) {
|
||||
width: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.filesFullScreen {
|
||||
@media (max-width: 520px) {
|
||||
justify-content: space-evenly;
|
||||
max-height: 400px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.comments__list__item {
|
||||
@media (max-width: 520px) {
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.nameFullScreen {
|
||||
@media (max-width: 520px) {
|
||||
white-space: inherit !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fullScreenDescription {
|
||||
@media (max-width: 1190px) {
|
||||
white-space: inherit !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -15,7 +15,7 @@ export const TrackerSelectColumn = ({ columns, task, currentColumn }) => {
|
||||
className="trackerSelectColumn"
|
||||
onClick={() => setOpenSelect(!openSelect)}
|
||||
>
|
||||
<p>Выберите колонку</p>
|
||||
<p>{currentColumn.title}</p>
|
||||
<img className={openSelect ? "open" : ""} src={arrowDown} alt="arrow" />
|
||||
{openSelect && (
|
||||
<div className="trackerSelectColumn__dropDown">
|
||||
@ -26,7 +26,7 @@ export const TrackerSelectColumn = ({ columns, task, currentColumn }) => {
|
||||
onClick={() => {
|
||||
dispatch(
|
||||
moveProjectTask({
|
||||
startWrapperIndex: { index: currentColumn, task },
|
||||
startWrapperIndex: { index: currentColumn.id, task },
|
||||
columnId: column.id,
|
||||
})
|
||||
);
|
||||
|
||||
@ -15,8 +15,8 @@
|
||||
|
||||
p {
|
||||
color: #252c32;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
|
||||
@ -194,7 +194,7 @@ export const ProjectTracker = () => {
|
||||
}
|
||||
|
||||
function openTicket(e, task) {
|
||||
if (window.innerWidth < 900) {
|
||||
if (window.innerWidth < 985) {
|
||||
return;
|
||||
}
|
||||
setSelectedTicket(task);
|
||||
@ -634,7 +634,11 @@ export const ProjectTracker = () => {
|
||||
}
|
||||
onClick={(e) => openTicket(e, task)}
|
||||
>
|
||||
<div className="tasks__board__item__title">
|
||||
<div className="tasks__board__item__title" onClick={() => {
|
||||
if (window.innerWidth < 985) {
|
||||
window.location.replace(`/tracker/task/${task.id}`)
|
||||
}
|
||||
}}>
|
||||
<p className="task__board__item__title">
|
||||
{task.title}
|
||||
</p>
|
||||
@ -690,7 +694,7 @@ export const ProjectTracker = () => {
|
||||
columns={projectBoard.columns.filter(
|
||||
(item) => item.id !== column.id
|
||||
)}
|
||||
currentColumn={column.id}
|
||||
currentColumn={column}
|
||||
task={task}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -402,7 +402,7 @@
|
||||
|
||||
.persons__list {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
z-index: 20;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: linear-gradient(180deg, #ffffff 0%, #ebebeb 100%);
|
||||
@ -527,6 +527,33 @@
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
width: 390px;
|
||||
padding: 15px 30px;
|
||||
.persons__list__info {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.persons__list__items {
|
||||
flex-direction: column;
|
||||
margin-bottom: 20px;
|
||||
row-gap: 15px;
|
||||
|
||||
.persons__list__item {
|
||||
max-width: none;
|
||||
span {
|
||||
max-width: none;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 440px) {
|
||||
width: 290px;
|
||||
padding: 15px 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -620,6 +647,17 @@
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
@media (max-width: 915px) {
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
justify-content: start;
|
||||
|
||||
p {
|
||||
font-size: 16px;
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
p {
|
||||
color: #252c32;
|
||||
@ -659,6 +697,11 @@
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
|
||||
@media (max-width: 915px) {
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
@ -811,6 +854,7 @@
|
||||
|
||||
@media (max-width: 900px) {
|
||||
width: 100%;
|
||||
max-height: none;
|
||||
|
||||
&:hover {
|
||||
transform: none;
|
||||
@ -1025,6 +1069,10 @@
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user