diff --git a/src/s2-homeworks/hw05/pages/JuniorPlus.tsx b/src/s2-homeworks/hw05/pages/JuniorPlus.tsx index cf96bb5..f98ef58 100644 --- a/src/s2-homeworks/hw05/pages/JuniorPlus.tsx +++ b/src/s2-homeworks/hw05/pages/JuniorPlus.tsx @@ -1,6 +1,6 @@ import React from 'react' import HW10 from '../../hw10/HW10' -// import HW11 from '../../hw11/HW11' +import HW11 from '../../hw11/HW11' // import HW12 from '../../hw12/HW12' // import HW13 from '../../hw13/HW13' @@ -8,7 +8,7 @@ function JuniorPlus() { return (
- {/**/} + {/**/} {/**/}
diff --git a/src/s2-homeworks/hw11/HW11.module.css b/src/s2-homeworks/hw11/HW11.module.css index be956c0..669a7ef 100644 --- a/src/s2-homeworks/hw11/HW11.module.css +++ b/src/s2-homeworks/hw11/HW11.module.css @@ -8,8 +8,14 @@ display: flex; align-items: center; gap: 25px; + font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 16px; line-height: 20px; } + +.number { + display: inline-block; + width: 17px; +} diff --git a/src/s2-homeworks/hw11/HW11.tsx b/src/s2-homeworks/hw11/HW11.tsx index e6e5f9c..e45820a 100644 --- a/src/s2-homeworks/hw11/HW11.tsx +++ b/src/s2-homeworks/hw11/HW11.tsx @@ -4,18 +4,24 @@ import s2 from '../../s1-main/App.module.css' import { restoreState } from '../hw06/localStorage/localStorage' import SuperRange from './common/c7-SuperRange/SuperRange' -function HW11() { - const [value1, setValue1] = useState(restoreState('hw11-value1', 0)) - const [value2, setValue2] = useState( - restoreState('hw11-value2', 100) - ) +/* +* 1 - передать значения в оба слайдера +* 2 - дописать типы и логику функции change +* 3 - сделать стили в соответствии с дизайном +* */ - const change = (event: Event, newValue: number | number[]) => { - if (Array.isArray(newValue)) { - setValue1(newValue[0]) - setValue2(newValue[1]) +function HW11() { + // for autotests // не менять // можно подсунуть в локалСторэдж нужные числа, чтоб увидеть как они отображаются + const [value1, setValue1] = useState(restoreState('hw11-value1', 0)) + const [value2, setValue2] = useState(restoreState('hw11-value2', 100)) + + const change = (event: any, value: any) => { + // пишет студент // если пришёл массив - сохранить значения в оба useState, иначе в первый + if (Array.isArray(value)) { + setValue1(value[0]) + setValue2(value[1]) } else { - setValue1(newValue) + setValue1(value) } } @@ -23,24 +29,26 @@ function HW11() {
Homework #11
- {/*should work (должно работать)*/}
- {value1} + {value1}
- {value1} + {value1} - {value2} + {value2}
diff --git a/src/s2-homeworks/hw11/common/c7-SuperRange/SuperRange.tsx b/src/s2-homeworks/hw11/common/c7-SuperRange/SuperRange.tsx index 66d1139..ae64836 100644 --- a/src/s2-homeworks/hw11/common/c7-SuperRange/SuperRange.tsx +++ b/src/s2-homeworks/hw11/common/c7-SuperRange/SuperRange.tsx @@ -1,44 +1,35 @@ import React from 'react' -import { Slider, SliderProps } from '@mui/material' +import {Slider, SliderProps} from '@mui/material' -// здесь мы говорим что у нашего слайдера будут такие же пропсы как у обычного mui слайдера -// (чтоб не писать value: string, onChange: ...; они уже все описаны в DefaultInputPropsType) -type SuperRangePropsType = SliderProps - -const SuperRange: React.FC = ({ - ...restProps // все остальные пропсы попадут в объект restProps -}) => { +const SuperRange: React.FC = (props) => { return ( - <> - - + }, + }} + {...props} // отдаём слайдеру пропсы если они есть (value например там внутри) + /> ) }