@widelab-nc/widelab 1.1.11 → 1.1.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widelab-nc/widelab",
-  "version": "1.1.11",
+  "version": "1.1.12",
   "description": "Widelab starter template based on Finsweet template + add-ons.",
   "homepage": "https://widelab.co",
   "license": "ISC",

package/src/index.js

@@ -1032,6 +1032,48 @@ window.closeContactModal = function() {
   contactFormOpen.timeScale(1).reverse();;
 }
 
+// Form animation
+// Hero animation on load
+window.successMsgAnimation = function(e) {
+  const successMsgAnim = gsap.timeline({}),
+
+    homeHeroHeading = new SplitText('#successHoooray, #successHeadiline', {
+      type: 'lines',
+      linesClass: 'hero-line',
+    }),
+    homeHeroHeadingMask = new SplitText('#successHoooray, #successHeadiline', {
+      type: 'lines',
+      linesClass: 'hero-line-mask',
+    });
+  successMsgAnim.from(
+    '.hero-line',
+    {
+      duration: 1.2,
+      y: '100%',
+      stagger: 0.2,
+      ease: 'loader2',
+    }
+  );
+    successMsgAnim.to(
+      e,
+      {
+        width: '0%',
+        duration: 0.6,
+        ease: 'loader2',
+      },
+      '>-0.5'
+    );
+  successMsgAnim.from(
+    '#successParagraph',
+    {
+      opacity: 0,
+      duration: 0.3,
+      ease: 'loader2',
+    },
+    '>-0.4'
+  );
+}
+
 // Form animation on submit
 window.formSubmitAnimation = function(e) {
   function observeDisplayChanges() {
@@ -1043,12 +1085,7 @@ window.formSubmitAnimation = function(e) {
     const observer = new MutationObserver(function(mutationsList, observer) {
       mutationsList.forEach(function(mutation) {
         if (mutation.target.style.display === 'block') {
-          gsap.to(e, {
-            scrollTrigger: { trigger: e, start: 'bottom bottom-=5%' },
-            width: 0,
-            ease: 'loader2',
-            duration: 0.6,
-          });
+          successMsgAnimation(e);
         }
       });
     });