gatsby-matrix-theme 3.2.22 → 3.2.26

package/src/components/organisms/footer-navigation/index.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 
 import LinkList from 'gatsby-core-theme/src/components/molecules/link-list';
@@ -6,8 +6,33 @@ import { getFirstModuleByName } from 'gatsby-core-theme/src/helpers/getters';
 import styles from './footer-navigation.module.scss';
 
 const FooterNavigation = ({ section, isStorybook = false }) => {
+  const [show, setShow] = useState(false);
   const menuArray = getFirstModuleByName(section, 'menu');
-  return (
+
+  const handleEvent = () => {
+    setShow(true);
+  };
+
+  const showAfter = (seconds) => {
+    setTimeout(() => {
+      setShow(true);
+    }, seconds * 1000);
+  };
+
+  useEffect(() => {
+    window.addEventListener('scroll', handleEvent);
+    window.addEventListener('mousemove', handleEvent);
+    window.addEventListener('touchstart', handleEvent);
+    showAfter(3);
+
+    return () => {
+      window.removeEventListener('scroll', handleEvent);
+      window.addEventListener('mousemove', handleEvent);
+      window.addEventListener('touchstart', handleEvent);
+    };
+  }, []);
+
+  return show ? (
     <div className={`${styles.footerLinks} ${isStorybook && styles.storybookStyles}`}>
       <LinkList
         showListTitle={false}
@@ -19,7 +44,7 @@ const FooterNavigation = ({ section, isStorybook = false }) => {
         gtmClass="mobile-menu-gtm"
       />
     </div>
-  );
+  ) : null;
 };
 
 FooterNavigation.propTypes = {

package/src/components/pages/contact-us/index.js

@@ -49,6 +49,7 @@ const ContactUs = ({
               )}
             </p>
             <Form
+              type="contact"
               hasButton
               buttonLabel="Send"
               submitUrl={submitUrl}

package/src/gatsby-core-theme/components/atoms/module-title/index.js

@@ -32,12 +32,12 @@ const ModuleTitle = ({ module, viewMoreIcon = <FaAngleRight />, pageContext = nu
     ? translate(translations, month, month)
     : false;
 
-  const getTitle = () => {
+  const getTitle = (className) => {
     const moduleTitle = module?.title || module?.module_title;
 
     if (!module?.module_title_tag) {
       return (
-        <h2 className={styles.noTag}>
+        <h2 className={`${styles.noTag} ${className}`}>
           {moduleTitle}
           {currentMonth ? (
             <span className={styles.toplistDate}>
@@ -51,7 +51,7 @@ const ModuleTitle = ({ module, viewMoreIcon = <FaAngleRight />, pageContext = nu
 
     if (module.module_title_tag)
       return (
-        <CustomTag>
+        <CustomTag className={className}>
           {moduleTitle}
           {currentMonth ? (
             <span className={styles.toplistDate}>
@@ -62,7 +62,7 @@ const ModuleTitle = ({ module, viewMoreIcon = <FaAngleRight />, pageContext = nu
         </CustomTag>
       );
     return (
-      <span className={styles.noTag}>
+      <span className={`${styles.noTag} ${className}`}>
         {moduleTitle}
         {currentMonth ? (
           <span className={styles.toplistDate}>
@@ -84,9 +84,7 @@ const ModuleTitle = ({ module, viewMoreIcon = <FaAngleRight />, pageContext = nu
           module?.style && styles[module.style]
         } ${tabsToplist ? styles.tabsToplist : null}`}
       >
-        <div className={styles.toplistTitle}>
-          {(module?.title || module.module_title) && getTitle(module)}
-        </div>
+        {(module?.title || module.module_title) && getTitle(styles.toplistTitle)}
 
         {module.link_label && (
           <Link to={module.link_value} className={`${styles.viewMore} module-title-gtm`}>
@@ -96,13 +94,12 @@ const ModuleTitle = ({ module, viewMoreIcon = <FaAngleRight />, pageContext = nu
         )}
       </div>
     ) : (
-      <div
-        className={`${styles.moduleTitle} ${styles[template]} ${
-          module?.style && styles[module.style]
-        } ${styles.toplistTitle} ${tabsToplist ? styles.tabsToplist : null}`}
-      >
-        {(module?.title || module.module_title) && getTitle(module)}
-      </div>
+      (module?.title || module.module_title) &&
+      getTitle(
+        `${styles.moduleTitle} ${styles[template]} ${module?.style && styles[module.style]} ${
+          styles.toplistTitle
+        } ${tabsToplist ? styles.tabsToplist : null}`
+      )
     ))
   );
 };

package/src/gatsby-core-theme/components/molecules/content/index.js

@@ -81,13 +81,13 @@ const Content = ({ module }) => {
 
   return (
     <>
-      <div className={`${styles.content} ${showMore && styles.showMore}`}>
-        <div className={`${switchStyle(module.style)}`}>
-          {module.value &&
-            parse(module.value, {
-              replace: replaceMedia,
-            })}
-        </div>
+      <div
+        className={`${styles.content} ${showMore && styles.showMore} ${switchStyle(module.style)}`}
+      >
+        {module.value &&
+          parse(module.value, {
+            replace: replaceMedia,
+          })}
       </div>
       {showMore && (
         <button type="button" className={styles.button} onClick={handleChange}>

package/src/gatsby-core-theme/components/organisms/carousel/index.js

@@ -43,28 +43,19 @@ const Carousel = ({ module = {}, settings = {}, gtmClass = '' }) => {
     return arr;
   };
 
+  const renderedItems =
+    width < 991 && width > 0 ? renderOne(module.items) : renderTwo(module.items);
+
   return (
     <div className={styles.carouselContainer}>
-      {width >= 991 && (
-        <Slider
-          {...settings}
-          className={styles.screenshotCarousel}
-          useArrows={false}
-          gtmClass={gtmClass}
-        >
-          {renderTwo(module.items)}
-        </Slider>
-      )}
-      {width < 991 && width > 0 && (
-        <Slider
-          {...settings}
-          className={styles.screenshotCarousel}
-          useArrows={false}
-          gtmClass={gtmClass}
-        >
-          {renderOne(module.items)}
-        </Slider>
-      )}
+      <Slider
+        {...settings}
+        className={styles.screenshotCarousel}
+        useArrows={false}
+        gtmClass={gtmClass}
+      >
+        {renderedItems}
+      </Slider>
     </div>
   );
 };