fixes

src/components/ReportForm/ReportForm.js

@@ -2,6 +2,7 @@ import React, {useState, useEffect} from 'react'
 import {useSelector} from 'react-redux'
 import {Link, useNavigate} from 'react-router-dom'
 import DatePicker, { registerLocale } from "react-datepicker"
+import {getCorrectDate, getCreatedDate} from '../Calendar/calendarHelper'
 import ru from "date-fns/locale/ru"
 registerLocale("ru", ru);
 
@@ -27,18 +28,6 @@ const ReportForm = () => {
   const navigate= useNavigate();
   const reportDate = useSelector(getReportDate);
 
-  const getCreatedDate = (day) => {
-    if (day) {
-      return `${new Date(day).getFullYear()}-${new Date(day).getMonth() + 1}-${new Date(day).getDate()}`
-    } else {
-      const date = new Date();
-      const dd = String(date.getDate()).padStart(2, '0');
-      const mm = String(date.getMonth() + 1).padStart(2, '0');
-      const yyyy = date.getFullYear();
-      return `${yyyy}-${mm}-${dd}`
-    }
-  };
-
   useEffect(() => {
     initListeners()
   }, [])
@@ -130,7 +119,7 @@ const ReportForm = () => {
                     src={calendarIcon}
                     alt=''
                 />
-                {getCreatedDate(startDate)}
+                {getCorrectDate(startDate)}
               </div>
               <DatePicker
                   className='datePicker'
@@ -184,9 +173,11 @@ const ReportForm = () => {
                                        : input
                                  }))}/>
                         </div>
+                        {index > 0 &&
                         <div className='report-form__task-remove'>
                           <img onClick={() => deleteInput(index)} src={remove} alt=''/>
                         </div>
+                        }
                       </form>
                   )
                 })}
@@ -196,7 +187,6 @@ const ReportForm = () => {
                   <span>Добавить еще </span>
                 </div>
               </div>
-              <div className='col-4'></div>
             </div>
 
         <div className='row'>

src/components/ReportForm/reportForm.scss

@@ -18,6 +18,10 @@
     border-radius: 12px;
     margin: 25px 0 80px;
     padding: 50px 40px;
+
+    @media (max-width: 555px) {
+      padding: 25px 20px;
+    }
   }
 
   .report__head {
@@ -53,6 +57,10 @@
       letter-spacing: normal;
       line-height: 48.74px;
       text-align: left;
+
+      @media (max-width: 555px) {
+        font-size: 2.5em;
+      }
     }
 
     h3 {
@@ -65,6 +73,11 @@
       text-align: left;
       margin-top: 52px;
       margin-bottom: 35px;
+
+      @media (max-width: 555px) {
+        margin-top: 25px;
+        margin-bottom: 15px;
+      }
     }
   }
 
@@ -84,6 +97,7 @@
     letter-spacing: normal;
     line-height: normal;
     text-align: left;
+    cursor: pointer;
 
     img {
       margin-left: 20px;
@@ -102,7 +116,7 @@
       font-style: normal;
       letter-spacing: normal;
       line-height: 48.74px;
-      width: 40px;
+      width: 12px;
     }
 
     &-list {
@@ -144,16 +158,25 @@
         line-height: normal;
         text-align: left;
         margin-bottom: 26px;
+        white-space: nowrap;
       }
     }
 
     &-title {
-      &--description {
-        margin-left: 20px;
-      }
+      //&--description {
+      //  margin-left: 20px;
+      //}
 
       &--hours {
         margin-left: 330px;
+
+        @media (max-width: 810px) {
+          margin-left: 125px;
+        }
+
+        @media (max-width: 610px) {
+          margin-left: 25px;
+        }
       }
     }
 
@@ -161,6 +184,10 @@
       margin-left: 20px;
       display: flex;
       align-items: center;
+
+      img {
+        cursor: pointer;
+      }
     }
 
     &-form {
@@ -186,6 +213,14 @@
           font-size: 1.8em;
           padding-left: 20px;
           padding-right: 20px;
+
+          @media (max-width: 810px) {
+            width: 250px;
+          }
+
+          @media (max-width: 610px) {
+            width: 150px;
+          }
         }
       }
 
@@ -200,6 +235,18 @@
           outline: none;
           font-size: 1.8em;
           text-align: center;
+
+          @media (max-width: 500px) {
+            width: 100px;
+          }
+
+          @media (max-width: 440px) {
+            width: 75px;
+          }
+
+          @media (max-width: 410px) {
+            width: 50px;
+          }
         }
       }
     }
@@ -235,6 +282,11 @@
       padding-left: 20px;
       padding-right: 20px;
       outline: none;
+
+      @media (max-width: 610px) {
+        max-width: 460px;
+        width: 100%;
+      }
     }
   }