Использовать шрифт Jost из Google Fonts, так как шрифт из макета платный.
При перезагрузке страницы сообщения не должны пропадать (исп. localStorage)
Header: только верстка
Окно чата
Дата в верхней части экрана (текущая дата в формате 8/20/2020)
Сообщения текущего пользователя по правую сторону экрана
Сообщения оппонента по левую сторону экрана
Новые сообщения появляются внизу списка сообщений (сверху - старые, снизу новые)
На любое сообщение “бот” отвечает Hello World! (аватарка и имя любое, можно взять из фигмы), время на сообщении должно отображаться корректно, в указанном формате
У “бота” на аватарке всегда отображается значок “В сети” (зеленый круг)
На сообщении пользователя должно быть актуальное время отправки в формате из фигмы
Сообщения
У пользователя должна быть возможность редактировать свои сообщения
(добавить иконку карандаша под сообщением)
У пользователя должна быть возможность удалять свои сообщения
(добавить иконку корзины под сообщением)
Поле ввода
Отрисовать два состояния, default и focus (см дизайн фигмы)
По нажатию на кнопку Enter или кнопку Send (иконка самолетика)
кнопка @ является событием Upload, т.е. в чат можно загрузить картинку (webp, png, jpg) и отправить ее в чат, она должна отобразиться в окне чата, как сообщение (дизайн на усмотрение разработчика)
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent