finished report page

This commit is contained in:
Hope87 2021-06-23 12:53:56 +03:00
parent 435d4fc5ad
commit 5be414307b
4 changed files with 60 additions and 60 deletions

View File

@ -1,6 +1,7 @@
import React from 'react'; import React from 'react';
import style from './InputsComponent.module.css';
const InputsComponent = ({ inputsArr, deleteInput, remove, style }) => const InputsComponent = ({ inputsArr, deleteInput, remove }) =>
inputsArr.map((input) => ( inputsArr.map((input) => (
<form id={input} key={input} className={style.reportForm__form}> <form id={input} key={input} className={style.reportForm__form}>
<span>{input}.</span> <span>{input}.</span>

View File

@ -0,0 +1,57 @@
.reportForm__form {
position: relative;
display: flex;
justify-content: space-between;
margin-left: 14px;
margin-bottom: 28px;
}
.reportForm__form > span {
font-family: 'GT Eesti Pro Display';
font-size: 2em;
font-weight: 700;
font-style: normal;
letter-spacing: normal;
text-align: left;
position: absolute;
left: 0;
bottom: 7px;
}
.input__text,
.input__number {
display: flex;
flex-direction: column;
margin-left: 20px;
}
.input__text > input {
width: 460px;
height: 42px;
box-shadow: 0 0 59px rgba(44, 44, 44, 0.05);
border-radius: 5px;
border: 1px solid #c4c4c4;
background-color: #ffffff;
outline: none;
font-size: 1.8em;
padding-left: 20px;
padding-right: 20px;
}
.input__number > input {
width: 141px;
height: 42px;
box-shadow: 0 0 59px rgba(44, 44, 44, 0.05);
border-radius: 5px;
border: 1px solid #c4c4c4;
background-color: #ffffff;
outline: none;
font-size: 1.8em;
text-align: center;
}
.reportForm__form > img {
margin-top: 5px;
width: 23px;
height: 23px;
}

View File

@ -48,7 +48,7 @@ const ReportForm = () => {
<p className={style.text1}>Краткое описание задачи</p> <p className={style.text1}>Краткое описание задачи</p>
<p className={style.text2}>Количество часов</p> <p className={style.text2}>Количество часов</p>
</div> </div>
<InputsComponent deleteInput={deleteInput} inputsArr={inputs} remove={remove} style={style} /> <InputsComponent deleteInput={deleteInput} inputsArr={inputs} remove={remove} />
<div className={style.reportForm__formAdd}> <div className={style.reportForm__formAdd}>
<img onClick={addInput} src={addIcon} alt="" /> <img onClick={addInput} src={addIcon} alt="" />
<span>Добавить еще </span> <span>Добавить еще </span>

View File

@ -97,64 +97,6 @@
margin-right: 86px; margin-right: 86px;
} }
.reportForm__form {
position: relative;
display: flex;
justify-content: space-between;
margin-left: 14px;
margin-bottom: 28px;
}
.reportForm__form > span {
font-family: 'GT Eesti Pro Display';
font-size: 2em;
font-weight: 700;
font-style: normal;
letter-spacing: normal;
text-align: left;
position: absolute;
left: 0;
bottom: 7px;
}
.input__text,
.input__number {
display: flex;
flex-direction: column;
margin-left: 20px;
}
.input__text > input {
width: 460px;
height: 42px;
box-shadow: 0 0 59px rgba(44, 44, 44, 0.05);
border-radius: 5px;
border: 1px solid #c4c4c4;
background-color: #ffffff;
outline: none;
font-size: 1.8em;
padding-left: 20px;
padding-right: 20px;
}
.input__number > input {
width: 141px;
height: 42px;
box-shadow: 0 0 59px rgba(44, 44, 44, 0.05);
border-radius: 5px;
border: 1px solid #c4c4c4;
background-color: #ffffff;
outline: none;
font-size: 1.8em;
text-align: center;
}
.reportForm__form > img {
margin-top: 5px;
width: 23px;
height: 23px;
}
.reportForm__formAdd { .reportForm__formAdd {
margin-left: 28px; margin-left: 28px;
} }