From fd1d77b4860d4c9371ff15cddcf3018541394692 Mon Sep 17 00:00:00 2001
From: alexanderroese <github@roese.dev>
Date: Fri, 21 Jun 2024 17:03:05 +0200
Subject: [PATCH] contact us animation

---
 assets/section-contact-form.css | 18 +++++++++++++-----
 sections/contact-form.liquid    |  4 ++--
 2 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/assets/section-contact-form.css b/assets/section-contact-form.css
index cae38e8..2322892 100644
--- a/assets/section-contact-form.css
+++ b/assets/section-contact-form.css
@@ -24,6 +24,16 @@
     grid-template-columns: repeat(2, 1fr);
     grid-column-gap: 2rem;
   }
+
+  #shx-contact-form-contact-us-send {
+    width: 250px;
+    height: 250px;
+  }
+
+  #shx-contact-form-contact-people-talking {
+    height: 500px;
+    width: 500px;
+  }
 }
 /*
 .contact__button {
@@ -47,9 +57,7 @@
   margin: 0 auto;
 }
 
-@media screen and (min-width: 750px) {
-  #shx-contact-form-contact-us-send {
-    width: 250px;
-    height: 250px;
-  }
+#shx-contact-form-contact-people-talking {
+  height: 250px;
+  width: 250px;
 }
diff --git a/sections/contact-form.liquid b/sections/contact-form.liquid
index a447d76..f977397 100644
--- a/sections/contact-form.liquid
+++ b/sections/contact-form.liquid
@@ -17,15 +17,15 @@
 <div class="color-{{ section.settings.color_scheme }} gradient">
   <div class="contact page-width page-width--narrow section-{{ section.id }}-padding">
     <dotlottie-player
-      id="shx-contact-form-contact-us-send"
+      id="shx-contact-form-contact-people-talking"
       src="{{ 'lottie_page_contact_us_people_talking.lottie' | asset_url }}"
       background="transparent"
       speed="1"
+      loop="true"
       autoplay
       direction="1"
       mode="bounce"></dotlottie-player>
 
-
     <div style="background-color: #fff; padding: 10px 20px 20px 20px; border-radius: 12px; box-shadow: 0 0 12px rgba(0, 0, 0, 0.1);">
       {%- if section.settings.heading != blank -%}
         <h2 class="title title-wrapper--no-top-margin inline-richtext {{ section.settings.heading_size }}{% if settings.animations_reveal_on_scroll %} scroll-trigger animate--slide-in{% endif %}" style="text-align: center; margin-bottom: 0;">