Домашнее задание 01
- Создай репозиторий
goit-markup-hw-04
. - Склонируй созданный репозиторий и скопируй в него файлы предыдущей работы.
- Добавь разметку и оформление иконок и декоративных эффектов для страниц из макета домашнего задания #4.
- Для генерации SVG-спрайта используй сервис Icomoon.
- Для оптимизации созданного SVG-спрайта используй сервис svgomg.
- Настрой
GitHub Pages
и добавь ссылку на живую страницу в шапку GitHub-репозитория.
«A1»
В корне проекта есть папка images
с изображениями.
«A2»
Все векторные изображения (иконки) собраны в SVG-спрайт icons.svg
, который лежит в
папке images
.
«A3»
Все векторные изображения оптимизированы.
«A4»
В корне проекта есть папка css
с файлами стилей.
«A5»
Все стили написаны в одном файле styles.css
, который находится в папке css
.
«A6»
В названиях файлов нет заглавных букв, пробелов и транслита, только буквы и слова
английского языка.
«A7»
Исходный код отформатирован при помощи Prettier
.
«A8»
Все изображения и текстовый контент взяты из макета.
«A9»
На всех HTML-страницах подключен нормализатор стилей
modern-nomalize
.
«A10»
Код написан следуя руководству.
«B1»
Для всех иконок используется векторная графика в формате svg
.
«B2»
SVG-иконки экспортированы правильно. При экспорте выбрана «группа», а не сам вектор.
«B3»
Все иконки из SVG-спрайта добавлены в HTML при помощи тегов <svg>
и <use>
«B4»
Размеры иконок взяты из макета и заданы элементу <svg>
в HTML-файле.
«B5»
В блоке Контактов
в шапке, добавлены иконки конверта и телефона.
«B6»
В секции Преимуществ
добавлены иконки.
«B7»
В секции Команды
добавлены иконки соцсетей.
«B8»
В секции Клиентов
добавлены иконки компаний.
«B9»
В футере
добавлены иконки соцсетей.
«C1»
Большое изображение с эффектом затемнения (под хедером) выполнено как фон. Для затемнения
используется многослойный фон с градиентом.
«C2»
Фоновое изображение в блоке под хедером не растягивается шире своего оригинального
размера 1600рх
.
«C3»
В карточках секции Наша команда
есть постоянный эффект тени.
«C4»
В карточках страницы Портфолио
есть эффект тени при ховере в любом месте карточки.
«C5»
В фильтре (список кнопок) страницы Портфолио
есть эффект тени при ховере или фокусе на
кнопки.
«C6»
При ховере или фокусе, иконки должны переходить в активное состояние - изменять цвет,
если это указано в макете.