Notes

npm install - install modules

npm start - start app

You can check it here: https://sphariab.github.io/notion/

Technologies: React, Antd, Sass, added eslint and prettier for preventing possible errors in code.

https://www.notion.so/25ddf5cd818b422398111fb0c870091c

### Поле Название

• В это поле можно вводить простой plaintext.
• У этого поля можно задать максимальную длину.
• При превышении максимальной длины должно появится сообщение об превышении длины, но сообщение не должно блокировать дальнейший пользовательский ввод.
• • Посчитать на сколько символов относительно лимита превышен ввод и показать это число(как в социальной сети твиттер)
• • Подсветить контент в поле, который вылезает за лимит

### Поле Контент

• В это поле можно вводить простой plaintext и html.
• HTML пользователь может добавить только через вставку из клипборда
• • Режим редактирования HTML

## Управление заметками

В приложении нужно сделать список где будут видны сохраненные заметки в виде карточек.

• Карточка заметки показывает название и превью контента
• В превью контента отображается только текст контента. Никаких html тегов или разметки там быть не должно.
• На карточке должна находится кнопка удаления заметки
• • Поле поискового запроса, которое ищет по названию и контенту
• • Редактирование заметки через форму создания заметки.

## Просмотр заметки

• Так как пользователь может ввести любой произвольный HTML, мы хотели мы обозначить список тегов который должен вырезаться при отображении заметки(Например script, iframe и так далее).
• Если в контенте заметки есть тег ссылки, то пользователь при нажатии должен увидеть алерт, и подтвердить переход по ссылке.
• • Динамическая загрузка картинок, которые пользователь может добавить через HTML
• • Вырезка аттрибутов из html(Например style, onClick и так далее)
• • Пользовательский HTML может выглядеть не очень, попробуйте улучшить типографику отображаемую на этом экране