Просмотреть проект можно на GitHub Pages по ссылке: https://mgkraynova.github.io/online-store/
Проект Online-store подготовлен для отработки навыков верстки статичных интернет страниц.
Страница проекта сверстана по концепции Pixel perfect и адаптирована под разрешение экранов разного размера.
На кнопки, ссылки и карточки из раздела Categories добавлена анимация плавного увеличения элементов.
Макет проекта был предоставлен наставником Яндекс.Практикума Максимом Чеченевым.
Окончание проекта - ноябрь 2021 года.
Страница проекта стилизована с помощью CSS:
- Для верстки Pixel perfect на разрешениях 1152px и больше некоторые элементы были спозиционированы абсолютно. На меньших разрешениях экрана использовались иные способы позиционирования.
- Для расположения элементов на странице использовались свойства display со значением flex и grid.
- Для стилизации элементов использовались псевдоклассы.
- На кнопки, ссылки и карточки из раздела Categories добавлены свойства transition и transform для создания анимации.
- Страница адаптирована под экраны с разным разрешением с помощью адаптивной верстки и медиазапросов.
Поскольку макет страницы был представлен в разрешении 1152px, вид страницы при других разрешениях экрана подбирался автором проекта самостоятельно.
При разработке и организации файлов использовалась БЭМ методология.
Скриншот сравнения проекта и макета c помощью специального расширения для браузера Chrome. Нажмите, чтобы развернуть
В будущем в проект планируется добавить:
- попапы, предупреждающие, что сайт находится в разработке, если пользователь нажмет на ссылку на несуществующую страницу;
- кнопку возврата на начало страницы;
- попап с формой для ссылки Contact us.