https://www.figma.com/file/B3btXO8PsarqxgeToXPosu/Untitled

Основные требования

1. Клонировать этот репозиторий
2. Создать свой публичный репозиторий
3. По завершению работы предоставить ссылку на свой публичный репозиторий

Адаптивная верстка с использованием Bootstrap и БЭМ

Минимизировать количество стилей, путем импорта только тех компонентов которые используются в проекте

Поддержка браузеров - https://angular.io/guide/browser-support

HEADER

Фиксирован, виден всегда. Состоит из:

• Кнопка переключения меню - при клике отображает или скрывает меню
• Заголовок
• Местоположение
• Выбор языка - при клике отображается список доступных языков. Переопределить стили списка на свое усмотрение (размер шрифта, цвет при ховере)

SIDENAV

По умолчанию скрыт

При открытии, размер блока основного контента уменьшается на размер sidenav и затемняется

Когда содержимое переполняет sidenav в нем появляется прокрутка

CONTENT

• Строка поиска - содержит поле подсказки и ошибки, переопределить стили подсказки и ошибки на свое усмотрение (размер шрифта, цвет), при ошибке изменить цвет обводки текстового поля на красный
• Выпадающий список - переопределить стили списка на свое усмотрение (размер шрифта, цвет при ховере)
• Кнопка добавления - при клике открывается модальное окно
• Импорт, экспорт - при ховере переопределить стили на свое усмотрение
• Таблица с данными - при переполнении по горизонтали появляется прокрутка, стилизовать согласно дизайну

DIALOG

При переполнении появляется вертикальная прокрутка на всю страницу. Стилизовать согласно дизайну