feat/landing-third-step

[Mirved64]

Close #12

[Mirved64]

@Nelfimov

Скоуп Анимация параллакса в проекте

Описание Не могу понять как сделать эффект параллакса как в макете. Не понимаю до конца саму анимацию параллакса (как секция при прокрутке наезжает на предыдущую секцию).

Мои действия

• Смотрел примеры - там нет этой анимации.
• Пробовал использовать @atls-ui-proto/parallax, застопорился на настройке провайдера - не получилось разобраться с ui, забросил.
• Решил использовать библиотеку react-scroll-parallax.
• Подключил библиотеку, обернул App в ParallaxProvider, использовал компонент Parallax - работает.
• Пробовал настроить анимацию, но не до конца понимаю как сделать нужную анимацию.
• Читал документацию к библиотеке, нагуглил статью про библиотеку.
• Не смог найти нужную анимацию (как секция при скролле наезжает на предыдущую секцию).

Вопросы Какие параметры меняются при анимации? (translateY? тогда получается, что контент секции наезжает на предыдущую, но потом идет очень большой gap до следующей)

Какой механизм анимации?

[Nelfimov]

Давай пока начнем с очевидных фиксов:

1. перейди на % параметры в translateY
2. параллакс должен распространяться на элементы внутри background
3. параллакс как эффект по дизайну применяется только там, где есть фон - в нашем случае это синий. То есть будто белый наезжает на синий.

[Mirved64]

@Nelfimov

Странно, у меня кроме адаптивности карточек всё хорошо. Смотрел в хроме и мозиле, точно ветка третьего степа.

• навбар на месте
  Details

• список правильно отображается
  Details

• Карточки, которые в мобильном виде прокручиваются свайпом с зазорами по бокам
  Details

Screencast from 15.08.2023 19:59:59.webm

Screencast from 15.08.2023 20:00:39.webm