- Створи репозиторій goit-markup-hw-08.
- Склонуй створений репозиторій і скопіюй в нього файли попередньої роботи.
- Виконай верстку адаптивної версії всіх елементів головної сторінки домашнього завдання #8.
- Налаштуй GitHub Pages і додай посилання на живу сторінку в шапку GitHub-репозиторія.
Для здачі домашнього завдання достатньо зробити адаптивну верстку головної сторінки (index.html). Виконання адаптивної верстки сторінки портфорліо (portfolio.html) не обов'язкове для здачі домашнього завдання.
«A1» Використовується методологія BEM.
«A2» Використовується препроцесор SASS.
«A3» У файлах index.html і portfolio.html підключений мініфікованний файл стилів main.min.css з папки css.
«A4» При перегляді сторінки на будь-якому пристрої шириною від 480px, не з'являється горизонтальна смуга прокручування.
«A5» Скрипт мобільного меню підключений в HTML окремим файлом mobile-menu.js.
Повний приклад створення мобільного меню з уже написаним скриптом розбери у майстерні.
«B1» У всіх сторінок в блоці < head> є метатег viewport.
«B2» Всі фонові і контентні растрові зображення - респонсивні і підтримують екрани щільністю x1 і x2.
«B3» Для респонсивних фонових зображень використані медіа-функціі min-device-pixel-ratio і min-resolution.
«B4» Виконана розмітка мобільного меню.
«C1» При написанні стилів використаний Mobile First підхід і медіа-функція (min-width: ).
«C2» Стилі, необхідні тільки у певному проміжку, закриті в медіа-запити (min-width: ) and (max-width: ) або тільки (max-width: ).
«C3» В медіа-запитах відсутнє зайве дублювання стилів.
«C4» Верстка виконана щодо трьох точок перелому: 480px, 768px і 1200px.
«C5» Виконано оформлення мобільного меню.