U B E R E A T S / landing / Выпускной проект курса на платформе Stepik "Веб-разработка для начинающих: HTML и CSS"

Описание задачи

Требования

• Использование flexboxgrid2
• Двустраничная версия статичного UberEats по макету в Figma

Реализация

• В опубликованной версии отсутствует вёрстка с использованием для адптивности flexboxgrid2 из-за несемантичности содержимого. Версия на flexboxgrid2 будет опубликована отдельно.

Стек технологий

• HTML
• CSS

Технологии реализации

• Технология построения сеток:

• Flexbox
• Grid Layout

• БЭМ вёрстка / Организация файлов БЭМ Nested
• Работа с макетом в Figma
• Реализация "маски" при наведении на карточку ресторана при помощи псевдоэлемента (без лишних обёрток в HTML)
• Использование псевдоклассов

Планы по доработке проекта

Вёрстка

• Доработка секции footer, максимально возможное уменьшение несемантических "обёрток"
• Реализация блоков в footer при помощи Grid Layout, без лишних margin
• Добавление второй страницы - страницы ресторана "Пушкин" согласно ТЗ
• Улучшение структуры проекта по БЭМ

Кроссбраузерность

• Добавление префиксов для кроссбраузерности

Адаптивная вёрстка

• Адаптивная вёрстка (с "резиновыми" элементами) для Mobile, Tablet версий (без использования flexboxgrid2 и других фреймворков), через медиа-запросы (at-rules @media)

Дизайн

• Улучшить маски для различных состояний ссылок, форм, кнопок с применнением псевдоклассов

Многостраничность

• Дополнить сайт страницей ресторана "Пушкин" согласно ТЗ