Вимоги
- Назва для папки з домашкою та гілки 5-rxjs;
- Вся логіка має бути реалізована через інструменти rxjs. в "subscribe" має бути лише логіка додавання або прибирання класів, всі інші обрахунки - через оператори;
- Для стилів використовуємо БЕМ;
- Вьорстка має бути резиновою та адаптивною.
- До пул реквесту має бути доданий коммент з посиланням на гітхаб пейджес.
Основне завдання
- Додати хедер на сторінку який буде показуватися після скроллу сторінки вверх, а після скроллу вниз - ховатися;
- Має обов'язково бути анімація ховання\показу хедера;
- Обов'зково має бути фільтування кількості івентів скролу;
- Хедер має ховатися\показуватися тільки якщо юзер проскролив більше 50 пікселів;
- В Хедері має бути навігація (посилання нікуди не ведуть, але мають працювати ховери та ектів ефекти);
- При зменшенні розміру скріна (на телефонах) Навігація має перетровитися в бургер-меню;
- Бургер меню має нормально працювати, відкриватися-закриватися.
https://www.dropbox.com/s/ofl8be279o72lix/main-task.mov?dl=0
**Завання з * **
- Посередині контенту сторінки має бути кнопка з текстом BUY NOW і після того як юзер проскролює її то має змінюватися логіка роботи хедера;
- У випадку коли юзер ще не доскроллив до цієї кнопки то має бути логіка хедера як в основному завданні;
- Після скролла вверх має показуватися звичайний хедер тільки доданою кнопкою BUY NOW справа (навігація також має лишатися);
- Після скролла вниз має показуватися хедер з текстом Get an amazing discount та кнопкою BUY NOW.
https://www.dropbox.com/s/5t29uz3yvkqox3a/advanced-task.mov?dl=0
Приклад дизайну для хедера:
Вимоги
Основне завдання
https://www.dropbox.com/s/ofl8be279o72lix/main-task.mov?dl=0
**Завання з * **
https://www.dropbox.com/s/5t29uz3yvkqox3a/advanced-task.mov?dl=0
Приклад дизайну для хедера:
