Разработка анимированных элементов на Svelte

Необходимо реализовать два анимированных компонента для веб-страницы с использованием Svelte и CSS.

Основные задачи

  1. Анимированная гирлянда:
    • Разместить статичное изображение верёвки (гирлянды).
    • Подвесить к ней изображения шаров (исходники будут предоставлены).
  2. Бегущая строка логотипов:
    • Разместить под гирляндой горизонтальную ленту с циклически движущимися логотипами.
    • Анимация должна быть плавной и бесконечной.

Требования к анимации гирлянды

  • Горизонтальное движение: Плавное перемещение всей гирлянды слева направо и обратно.
  • Анимация шаров: Каждый шар должен слегка покачиваться, подобно маятнику, создавая естественный эффект.
  • Цикличность: Все движения должны быть зациклены в плавный, бесконечный анимационный цикл.

Технические требования

  • Использование фреймворка Svelte для реализации логики и реактивности.
  • Создание анимаций средствами CSS (предпочтительно) или с использованием встроенных возможностей Svelte.
  • Работа строго по предоставленным графическим исходникам (изображения верёвки, шаров, логотипов).
  • Код должен быть чистым, читаемым и хорошо закомментированным.