Check list before final review #426
Description
Як має виглядати проект?
- Фільтр на сторінці [Pokemons]/[Games] повинен фільтрувати чекбокси. Якщо ви не виконували завдання з зірочкою та у вас не працює фільтрація по інших полях (select, radio buttons, input search) - будь ласка задізейбліть їх (зверніть увагу щоб візуально відрізнявся disabled стан для пошуку)
- Ваш проект має складатись з 4 сторінок: [Calculator], [Pokemons]/[Games], [About], [Login]
- Кожна сторінка містить header та footer з клікабельними посиланнями
- Додайте адаптив для стилів свого проекту (ми будемо дивитись основні девайси: мобільний, планшет (768px), десктоп) + перевірте щоб не було горизонтального скролу
- Перегляньте чи не "стрибає" сторінка при натисненні input чи кнопок, якщо змінюється висота поля/кнопки - треба фіксити)
- Переконайтесь, що кольори на всіх елементах, включаючи hover, focus, active відповідають дизайну проекту + позбавтесь outline для інпутів
- додайте сторінкам
min-width, наприклад 400 пікселів, щоб при її зменшенні виникав горізонтальний скролл
Що по коду?
- Видаліть непотрібний/непрацюючий код та коментарі
- Діставайте елементи за дата атрибутами
- Задавайте стилі лише на класи (не на елементи)
- Не використовуйте
innerHTMLдля відображення того, що ви отримаєте з бекенду. Це може призвести до XSS атак.innerHTML=''- можна ;) - Не пишіть функції в EventListener. Створіть функцію та викликайте її в лістенері
- Перевірте single responsibility для функцій: якщо функція виконує більше ніж 1 задачу - розділяйте її логіку на менші функції
- Зверніть увагу на неймінг змінних та функцій: вони мають бути очевидними та зрозумілими
- Використовуйте семантичні теги для контенту
- Позбавтесь непотрібних дівів, класів які не містять стилів
- Використовуйте лише цілі числа для стилів (відступи, розмір шрифту, ширина тощо)
Перегляньте як виглядає ваш проект після деплою, якщо все виглядає як ви того очікували - робіть реквест на final review
та собі какао з зефірками поки чекаєте відрук ментора