Add task work date management and enhance task popup layout

This commit is contained in:
2025-02-12 16:11:40 +01:00
parent 1f35e408bc
commit 65b78d49fd
8 changed files with 167 additions and 37 deletions

View File

@@ -3,6 +3,20 @@ $cRed: #aa0505;
$cGreen: #43833f;
$cBlack: #4e5e6a;
.default-btn {
display: flex;
align-items: center;
justify-content: center;
height: 40px;
border-radius: .25rem;
padding: 0 15px;
transition: all .3s ease;
&:hover {
text-decoration: none;
}
}
.animate {
animation: mymove 3s infinite;
}
@@ -122,7 +136,7 @@ body {
}
&.btn-danger {
background: #cc0000;
background: #cc563d;
&:hover {
background: #b30000;
@@ -135,7 +149,7 @@ body {
}
.form-error {
color: #cc0000;
color: #cc563d;
font-size: 13px;
}
@@ -324,7 +338,7 @@ body>.top {
&.tasks_suspended {
h2 {
border-bottom: 5px solid #cc0000;
border-bottom: 5px solid #cc563d;
}
}
@@ -378,7 +392,7 @@ body>.top {
position: relative;
&.notopened {
border: 2px solid #cc0000;
border: 2px solid #cc563d;
}
.left {
@@ -446,7 +460,7 @@ body>.top {
}
.task_end {
background: #cc0000;
background: #cc563d;
color: #FFF;
border-radius: 3px;
cursor: pointer;
@@ -526,7 +540,7 @@ body>.top {
font-size: 12px;
.danger {
color: #cc0000;
color: #cc563d;
font-weight: 600;
}
@@ -569,7 +583,7 @@ body>.top {
}
&.btn_cancel {
background: #cc0000;
background: #cc563d;
&:hover {
background: #b30000;
@@ -628,6 +642,20 @@ body>.top {
border-radius: 6px;
max-width: 1140px;
width: 100%;
transition: all 0.3s ease;
max-height: 600px;
&.open_works_time {
max-width: 1540px;
.content {
grid-template-columns: 1fr 300px 300px;
.task_work_details {
display: block;
}
}
}
.title {
font-size: 20px;
@@ -639,7 +667,7 @@ body>.top {
margin-right: 10px;
&.task-delete {
color: #cc0000;
color: #cc563d;
}
}
}
@@ -652,8 +680,11 @@ body>.top {
}
.content {
display: flex;
display: grid;
font-size: 14px;
grid-template-columns: 1fr 300px;
gap: 30px;
transition: all 0.3s ease;
h3 {
width: 100%;
@@ -665,7 +696,6 @@ body>.top {
}
.left {
width: 70%;
max-height: 700px;
overflow-y: auto;
@@ -740,7 +770,7 @@ body>.top {
top: 10px;
right: 10px;
cursor: pointer;
color: #cc0000;
color: #cc563d;
}
.author {
@@ -807,7 +837,7 @@ body>.top {
margin-left: auto;
margin-right: 0;
cursor: pointer;
background: #cc0000;
background: #cc563d;
display: flex;
height: 25px;
width: 25px;
@@ -839,30 +869,46 @@ body>.top {
}
.right {
width: 30%;
padding: 0 15px 15px;
.box {
margin-bottom: 15px;
}
.time {
a {
display: block;
padding: 10px;
border-radius: 6px;
a.time_worked_toggle {
@extend .default-btn;
color: #299cdb;
display: inline-flex;
border: 1px solid #299cdb;
&:hover {
background: #dff0fa;
text-decoration: none;
}
&:active,
&:focus {
text-decoration: none;
}
}
a:not(.time_worked_toggle) {
@extend .default-btn;
margin-top: 10px;
text-decoration: none;
text-align: center;
width: 100%;
gap: 10px;
&.task_start {
background: #57b951;
background: #0ab39c;
color: #FFF;
&:hover {
background: #099885;
}
}
&.task_end {
background: #cc0000;
background: #cc563d;
color: #FFF;
}
@@ -878,7 +924,7 @@ body>.top {
flex-wrap: wrap;
.danger {
color: #cc0000;
color: #cc563d;
font-weight: 600;
}
@@ -892,6 +938,32 @@ body>.top {
}
}
}
.task_work_details {
display: none;
overflow-y: auto;
max-height: 508px;
width: 100%;
padding-right: 10px;
._line {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-bottom: 5px;
._user {
width: 100%;
font-size: 13px;
}
input {
width: calc(50% - 10px);
text-align: center;
}
}
}
}
}
}
@@ -1038,7 +1110,7 @@ body>.top {
color: $cBlue;
&:hover {
color: #cc0000;
color: #cc563d;
}
}
}