Вёрстка приложения погоды по готовому ТЗ. Нативный HTML, CSS (SCSS), JS, без фреймворков и библиотек.
- HTML5
- CSS3 / SCSS
- JavaScript
- Динамический вывод данных
- Стилизация состояний поля ввода: default, hover, active, typing, filled, hover на иконке очистки
- Очистка поля ввода по клику
https://weather-app-sigma-roan-b7qdin7m54.vercel.app
Данные ТЗ были предоставлены платформой PREAX
Согласно макету сверстать хедер страницы со всеми элементами, карточки справа и блок с прогнозом по текущему городу.
Для бэкграунда использовать дефолтное изображение в формате jpeg из макета (разместить в папке public). Оно не теряет пропорции и заполняет все пространство экрана.
Данные по городу на главной странице заполнить из макета.
Текст, введённый в поле поиска, выводится в консоль.
Минимальная ширина экрана 1280px. Контент страницы расположен по центру. При высоте окна меньшем чем контентная часть страницы, появляется скролл. При скролле страницы — фоновое изображение не меняет своего положения.
Для описания стилей использовать методологию БЭМ.
Важно: в рамках текущей задачи только верстка, настраивать функционал поиска не требуется.
Согласно макету, сверстать карточки метеоданных.
Вынести метеоданные в переменную, в отдельный файл. Данные карточек на главной странице заполнить из этой переменной.
Для описания стилей использовать методологию БЭМ.
Важно: в рамках этого задания выполняется только верстка блока карточек с заполнением данных о погоде из переменной, функционал получения актуальных данных о погоде реализовывать не требуется.
