reports adaptive

This commit is contained in:
Victor Batischev 2023-12-04 21:08:15 +03:00
parent 4e15f79c76
commit 7f0e5be087
5 changed files with 28 additions and 22 deletions

View File

@ -186,16 +186,26 @@
}
}
@media (max-width: 1200px) {
width: 110px;
}
@media (max-width: 968px) {
width: 90px;
font-size: 11px;
}
@media (max-width: 680px) {
width: 70px;
font-size: 10px;
}
@media (max-width: 610px) {
width: 55px;
height: 45px;
@media (max-width: 550px) {
width: 60px;
height: 35px;
}
@media (max-width: 480px) {
@media (max-width: 450px) {
width: 45px;
height: 35px;
}

View File

@ -205,11 +205,11 @@ export const ProfileCalendarComponent = React.memo(
<div className="calendar-component">
<div className="calendar-component__header">
<div className="calendar-component__header-info">
<h3>Мои отчеты:</h3>
<h3>Мои отчеты за </h3>
<p className="calendar__hours">
{month}&nbsp;
<span>
{totalHours} {hourOfNum(totalHours)}{" "}
({totalHours} {hourOfNum(totalHours)})
</span>
</p>
</div>
@ -316,13 +316,13 @@ export const ProfileCalendarComponent = React.memo(
? `${getCorrectDate(startDate)} - ${getCorrectDate(endDate)}`
: `${getCorrectDate(endDate)} - ${getCorrectDate(startDate)}`
: activePeriod
? "Выберите начало диапазона"
? "Выберите диапазон на календаре"
: "Выбрать диапазон"}
</span>
<span>
{totalRangeHours
? `${totalRangeHours} ${hourOfNum(totalRangeHours)}`
: "0 часов"}
: endDate ? "0 часов" : ""}
</span>
{endDate && (
<BaseButton

View File

@ -43,7 +43,7 @@ const ReportForm = () => {
const [isFetching, setIsFetching] = useState(false);
const [reportSuccess, setReportSuccess] = useState("");
const [startDate, setStartDate] = useState(
reportDate ? new Date(reportDate._d) : new Date(),
reportDate ? new Date(reportDate._d) : new Date()
);
const [datePickerOpen, setDatePickerOpen] = useState(false);
@ -73,7 +73,7 @@ const ReportForm = () => {
(div) =>
div.classList &&
(div.classList.contains("report-form__block-img") ||
div.classList.contains("react-datepicker-popper")),
div.classList.contains("react-datepicker-popper"))
)
) {
setDatePickerOpen(false);
@ -180,9 +180,7 @@ const ReportForm = () => {
<p className="report-form__task-title--description">
Краткое описание задачи
</p>
<p className="report-form__task-title--hours">
Количество часов
</p>
<p className="report-form__task-title--hours">Кол-во часов</p>
</div>
{inputs.map((input, index) => {
@ -212,7 +210,7 @@ const ReportForm = () => {
task: e.target.value,
}
: input;
}),
})
)
}
/>
@ -238,7 +236,7 @@ const ReportForm = () => {
hours_spent: Number(e.target.value),
}
: input;
}),
})
)
}
/>
@ -299,7 +297,7 @@ const ReportForm = () => {
{isFetching ? <Loader /> : "Отправить"}
</button>
<p className="report-form__footer-text">
Всего за день :{" "}
Всего за день:{" "}
<span>
{totalHours} {hourOfNum(totalHours)}
</span>

View File

@ -352,6 +352,7 @@
&__footer {
display: flex;
flex-direction: column-reverse;
align-items: center;
margin-top: 20px;
@ -380,16 +381,13 @@
&-text {
font-family: "GT Eesti Pro Display";
font-size: 1.9em;
font-weight: 600;
font-style: normal;
letter-spacing: normal;
line-height: 22.38px;
text-align: left;
margin-left: 40px;
margin-bottom: 0;
margin-bottom: 20px;
span {
font-weight: 100;
font-weight: 600;
}
}

View File

@ -47,7 +47,7 @@ export const Instruction = () => {
<img src={comment} alt="" />
</div>
<div className="instruction__text instruction__text_info">
Количество вопросов в тесте: <span>{countQuestions}</span>
Вопросов в тесте: <span>{countQuestions}</span>
</div>
</div>
</>