#66 Небольшие поправки

planner-front/src/components/MonthCalendarModalContent/MonthCalendarModalContent.js

-import { Button, FormControl, InputLabel, MenuItem, Select, TextField } from "@mui/material";
+import { Button, TextField } from "@mui/material";
 import { memo } from "react";
 import CustomSelect from '../UI/СustomSelect/СustomSelect'
 
@@ -38,8 +38,28 @@ function MonthCalendarModalContent({title, onChangeCurrentTaskHandler, descripti
       id={'priority-type'}
       items={priorities}
     />
-  <Button sx={{marginRight: '40px'}} onClick={sendNewTaskHandler}>Сохранить</Button>
-  <Button onClick={deleteTaskHandler}>Удалить</Button>
+    <div style={{display: 'flex', gap: '20px', margin: '20px 0'}}>
+      <TextField 
+        id="task-description-title" 
+        value={title}
+        label="От" 
+        variant="outlined" 
+        name='title'
+        onChange={(e)=>{onChangeCurrentTaskHandler(e)}}
+      />
+      <TextField 
+        id="task-description-title" 
+        value={title}
+        label="До" 
+        variant="outlined" 
+        name='title'
+        onChange={(e)=>{onChangeCurrentTaskHandler(e)}}
+      />
+    </div>
+    <div style={{display: 'flex', gap: '20px', margin: '10px 0'}}>
+      <Button onClick={sendNewTaskHandler}>Сохранить</Button>
+      <Button onClick={deleteTaskHandler}>Удалить</Button>
+    </div>
   </>);
 }
 

planner-front/src/components/UI/ModalTask/ModalTask.js

 import Box from '@mui/material/Box';
 import Modal from '@mui/material/Modal';
-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 
 
 export default function ModalTask({modal, handleClose, children}) {
@@ -19,32 +19,35 @@ export default function ModalTask({modal, handleClose, children}) {
 
   useEffect(() => {
     window.addEventListener('resize', detectSize)
-
     return () => {
       window.removeEventListener('resize', detectSize)
     }
   }, [windowDimenion])
+  const modalRef = useRef('')
+
 
   const getYCordinatesToModal = () => {
-    if (windowDimenion.winHeight > modal.yClickСordinates + 350) {
-      return modal.yClickСordinates - modal.yDiv - modal.yDivClick 
+    if (windowDimenion.winHeight > modal.yClickСordinates + 450) {
+      return modal.yClickСordinates - modal.yDiv - modal.yDivClick
     } else {
-      return modal.yClickСordinates - modal.yDiv - modal.yDivClick - ((modal.yClickСordinates + 350) - windowDimenion.winHeight) - 10
+      return modal.yClickСordinates - modal.yDiv - modal.yDivClick - ((modal.yClickСordinates + 450) - windowDimenion.winHeight) - 30
     }
   }
   const getXCordinatesToModal = () => {
-    if (windowDimenion.winWidth > modal.xClickСordinates + modal.xDiv + 250 + modal.xDivClick) {
+    if (windowDimenion.winWidth > modal.xClickСordinates + 270 + modal.xDiv) {
       return modal.xClickСordinates + modal.xDiv - modal.xDivClick + 10
     } else {
-      return modal.xClickСordinates - modal.xDiv - ((modal.xClickСordinates + 250) - windowDimenion.winWidth) - 120
+      return modal.xClickСordinates - modal.xDivClick - ((modal.yClickСordinates + 270) - windowDimenion.winHeight)
     }
   }
   const style = {
+    display: 'flex',
+    flexDirection: 'column',
     position: 'absolute',
     top: getYCordinatesToModal(),
     left: getXCordinatesToModal(),
-    width: 250,
-    height: 350,
+    width: 270,
+    height: 450,
     bgcolor: 'background.paper',
     border: '2px solid #000',
     boxShadow: 24,
@@ -59,7 +62,7 @@ export default function ModalTask({modal, handleClose, children}) {
         aria-describedby="modal-modal-description"
         BackdropProps={{ style: { backgroundColor: 'rgba(255,255,255, 0)' } }}
       >
-        <Box sx={style}>
+        <Box sx={style} ref={modalRef}>
           {children}
         </Box>
       </Modal>

planner-front/src/components/UI/Select/Select.js

@@ -8,7 +8,7 @@ import Select from "@mui/material/Select";
 export default function BasicSelect({value,label,name,onChange,task,items}) {
 
   return (
-    <Box sx={{ minWidth: 60 }}>
+    <Box sx={{ minWidth: 60, m: 0}}>
       <FormControl fullWidth>
         <InputLabel id="demo-simple-select-label"></InputLabel>
         <Select