Modal ticket finished
This commit is contained in:
parent
792b8542c0
commit
84a7f267ff
@ -6,8 +6,10 @@ import avatarMock1 from "../../../images/avatarMoсk1.png";
|
|||||||
import avatarMock2 from "../../../images/avatarMoсk2.png";
|
import avatarMock2 from "../../../images/avatarMoсk2.png";
|
||||||
import category from "../../../images/category.png";
|
import category from "../../../images/category.png";
|
||||||
import comments from "../../../images/comments.png";
|
import comments from "../../../images/comments.png";
|
||||||
|
import watch from "../../../images/watch.png";
|
||||||
import files from "../../../images/files.png";
|
import files from "../../../images/files.png";
|
||||||
import task from "../../../images/tasksMock.png";
|
import task from "../../../images/tasksMock.png";
|
||||||
|
import arrow from "../../../images/arrowStart.png";
|
||||||
|
|
||||||
export const ModalTiket = ({ active, setActive }) => {
|
export const ModalTiket = ({ active, setActive }) => {
|
||||||
const [tiket] = useState({
|
const [tiket] = useState({
|
||||||
@ -85,12 +87,21 @@ export const ModalTiket = ({ active, setActive }) => {
|
|||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
<div>
|
|
||||||
|
<div className="add-worker">
|
||||||
<button>+</button>
|
<button>+</button>
|
||||||
<span>Добавить участников</span>
|
<span>Добавить участников</span>
|
||||||
</div>
|
</div>
|
||||||
<div></div>
|
|
||||||
<button>Начать делать</button>
|
<div className="time">
|
||||||
|
<img src={watch}></img>
|
||||||
|
<span>Длительность : </span>
|
||||||
|
<p>{"8:30:22"}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button className="start">
|
||||||
|
Начать делать <img src={arrow}></img>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -117,10 +117,53 @@
|
|||||||
font-family: "Inter", sans-serif;
|
font-family: "Inter", sans-serif;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
|
|
||||||
color: #807777;
|
color: #807777;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.add-worker {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
span {
|
||||||
|
color: #000000;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 32px;
|
||||||
|
margin-left: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
background: #8bcc60;
|
||||||
|
width: 33px;
|
||||||
|
height: 33px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.start {
|
||||||
|
margin-top: 25px;
|
||||||
|
background: #1458dd;
|
||||||
|
border-radius: 44px;
|
||||||
|
|
||||||
|
img {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-size: 12px;
|
||||||
|
margin-top: 20px;
|
||||||
|
width: 160px;
|
||||||
|
|
||||||
|
p {
|
||||||
|
color: #000000;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&__creator {
|
&__creator {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 32px;
|
line-height: 32px;
|
||||||
|
BIN
src/images/arrowStart.png
Normal file
BIN
src/images/arrowStart.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 278 B |
Loading…
Reference in New Issue
Block a user