diff options
Diffstat (limited to 'src/components/settings/AboutMe.tsx')
| -rw-r--r-- | src/components/settings/AboutMe.tsx | 36 |
1 files changed, 36 insertions, 0 deletions
diff --git a/src/components/settings/AboutMe.tsx b/src/components/settings/AboutMe.tsx new file mode 100644 index 0000000..b065a26 --- /dev/null +++ b/src/components/settings/AboutMe.tsx @@ -0,0 +1,36 @@ +import { useState } from 'react'; + +export default function AboutMe() { + const maxLength = 250; + const [text, setText] = useState(''); + + const handleChange = (e) => { + const value = e.target.value; + + if (value.length <= maxLength) { + setText(value); + } + }; + + return ( + <div className="flex flex-col flex-start gap-[10px] w-[600px] h-[284px]"> + <p className="font-medium text-light-violet gap-[10px] ml-[20px]"> + ОБО МНЕ + </p> + + <div className="flex flex-row flex-end p-[20px] w-[600px] h-[120px] border-solid border-[1px] rounded-[20px]"> + <Input + value={text} + onChange={handleChange} + placeholder="Введите описание о себе" + /> + + <p className="font-regular flex flex-row justify-center items-end ml-[10px] text-light-violet"> + {maxLength - text.length} + </p> + </div> + + <Button className="w-[105px]">Сменить</Button> + </div> + ); +} |
