Чек-лист по элементам дизайн-системы

Данный чек-лист используется во время разработки сайтов. Здесь указаны списки элементов, разрешений и того, что должно быть отрисовано в UI-kit и дизайн-системе.

Главная

1. Хэдэр
1. адаптивы ховер  (1920, 1600, 768, 360)
2. при скролле (1920, 1600, 768, 360), учитывая разные цвета блоков
3. ховер на пункт
4. строка поиска (при необходимости)
2. Футер
1. адаптивы футер  (1920, 1600, 768, 360)
3. Сетка главной и внутренних страниц

Меню

1. Ховеры на всех элементах (пунктах меню разного уровня)
2. Состояние меню, когда находишься внутри раздела, а не на главной
3. Адаптивы меню (1920, 1600, 768, 360)
4. Раскрытое меню
5. Адаптивы раскрытого меню (1920, 1600, 768, 360)
6. Раскрытое меню для “особых разделов” (где есть отличия)

Элементы

1. Кнопки и ссылки
1. все кнопки в 3-х состояниях (Default, Hover, Disabled) или в 2-х, если нет третьего
2. эти же состояния на адаптивах (1920, 1600, 768, 360)
2. Не забыть все появляющиеся кнопки на сайте, сгруппировать их:
1. основные кнопки
2. кнопки скачивания документов
3. ссылки - документы, вшитые в текст (“Согласен на обработку персональных данных”), просто ссылки со стрелками, например
4. Кнопки видео
5. Ссылки по типу “подробнее”
6. Кнопки добавления файла
7. Крестики закрытия
3. Теги - адаптивы (1920, 1600, 768, 360) и состояния (Default, Hover, Disabled)
4. Чекбоксы и радио - адаптивы (1920, 1600, 768, 360) и состояния (Default, Hover, Disabled)
5. Иконки соц. сетей - адаптивы (1920, 1600, 768, 360) и состояния (Default, Hover, Disabled)
6. Переключалки - адаптивы (1920, 1600, 768, 360) и состояния (Default, Hover, Disabled)
7. Табы - адаптивы (1920, 1600, 768, 360) и состояния (Default, Hover, Disabled)
8. Спойлеры - адаптивы (1920, 1600, 768, 360) и состояния (Развернуть, Свернуть)
9. Ползунки, скроллбар
10. Пагинация - адаптивы (1920, 1600, 768, 360) и состояния (Default, Hover)
11. Переключатель языков
12. Поиск
1. Default
2. Клик (активная строка)
3. Ввод + ховер на закрытие