gatsby-matrix-theme 36.0.4 → 37.0.1

package/CHANGELOG.md

@@ -1,3 +1,36 @@
+## [37.0.1](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v37.0.0...v37.0.1) (2023-11-15)
+
+
+### Bug Fixes
+
+* added new toplist template ([8e8baf4](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/8e8baf44dc2cd0dc8c14fa87130300532d53beb1))
+* buttons fixes ([31b2695](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/31b2695dd4384e6b828b43a35327e5d46d59f2d0))
+* use the iframe module ([1938e14](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/1938e1408434990d20b53538ff756e96263fa0be))
+
+
+* Merge branch 'tm-3818-iframe' into 'master' ([0a7e047](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/0a7e047c02439c896403549a131c2a5b6b293a7d))
+
+# [37.0.0](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v36.0.4...v37.0.0) (2023-11-13)
+
+
+### Bug Fixes
+
+* cookie consent buttons ([34e4cd8](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/34e4cd89375adb57b44d667699a7674e2da15886))
+
+
+### Code Refactoring
+
+* add operator image and fix storybook issue ([fe6472f](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/fe6472f93b20feccc73bd696dee078a4d5208d68))
+* change to tablet view ([39cc3b8](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/39cc3b8df89b567900eaf2af5e559b37c16e26b0))
+* changes to toplist tablet view ([0fd3ab7](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/0fd3ab78d8eb78050aaf6590e3cf0c83be239820))
+* remove temp ([ad18f01](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/ad18f01450a7b73ba4a07ad0f8df12c31a07b46d))
+* temp ([1adc1b0](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/1adc1b0b06b9a3e01e4b40068eb0caf406409168))
+
+
+* Merge branch 'tm-3691-toplist' into 'master' ([18bc94d](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/18bc94d6f0a1ebf8ed88c6219b5b37655e64101f))
+* Merge branch 'tm-3815-storybook-issue' into 'master' ([93e63af](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/93e63afe94cf9067722fbe5e2c06f973d5107543))
+* Merge branch 'master' into tm-3691-toplist ([9b7a3bd](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/9b7a3bdd8c90bd88731082ef8fecb950b1d2cff6))
+
 ## [36.0.4](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v36.0.3...v36.0.4) (2023-11-10)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-matrix-theme",
-  "version": "36.0.4",
+  "version": "37.0.1",
   "main": "index.js",
   "description": "Matrix Theme NPM Package",
   "author": "",

package/src/components/atoms/newsletter/form/index.js

@@ -150,12 +150,10 @@ const NewsletterForm = ({
   }
 
   const handelSubmit = (e) => {
-    e.preventDefault();
-    const { elements } = e.target;
-    if (validationForm(elements)) {
+    if (validationForm(form.current)) {
       handleApi
-        ? handleApi(elements.name.value, elements.email.value, ip)
-        : bacomApi(elements.name.value, elements.email.value);
+        ? handleApi(form.current.name.value, form.current.email.value, ip)
+        : bacomApi(form.current.name.value, form.current.email.value);
     }
   };
 
@@ -213,7 +211,7 @@ const NewsletterForm = ({
               />
             )}
             <PrivacyandSuccess
-              onclick={() => handelSubmit()}
+              onSubmit={() => handelSubmit()}
               loading={setLogading || loading}
               btnText={formTextTranslated.buttonText}
               privacyText={privacyText}

package/src/components/atoms/newsletter/privacy&button/index.js

@@ -9,7 +9,7 @@ const PrivacyandSuccess = ({ privacyText, btnText, onSubmit = null }) => (
       // eslint-disable-next-line react/no-danger
       <p className={styles?.privacytext || ''} dangerouslySetInnerHTML={{ __html: privacyText }} />
     ) : null}
-    <Button btnText={btnText} buttonType="primary" onClick={() => onSubmit()} />
+    <Button isInternalLink={false} btnText={btnText} buttonType="primary" onClick={onSubmit} />
   </div>
 );
 

package/src/components/molecules/cookie-modal/index.js

@@ -14,6 +14,7 @@ import styles from './cookie-modal.module.scss';
 const CookieModal = ({
   handleAcceptCookies,
   handleDeclineCookies,
+  declineButtonType = 'secondary',
   closeModal,
   cookieLink = {
     title: '',
@@ -136,7 +137,7 @@ const CookieModal = ({
               'I reject Non-Necessary'
             )}
             isInternalLink={false}
-            buttonType="primary"
+            buttonType={declineButtonType}
             buttonSize="m"
             gtmClass="cookie-consent-gtm btn-cta"
           />
@@ -204,6 +205,7 @@ CookieModal.propTypes = {
   handleDeclineCookies: PropTypes.func,
   closeModal: PropTypes.func,
   logo: PropTypes.string,
+  declineButtonType: PropTypes.string,
   templateTwo: PropTypes.bool,
   cookieLink: PropTypes.shape({
     title: PropTypes.string,

package/src/components/molecules/toplist/row/variant-one.module.scss

@@ -14,7 +14,8 @@
   }
 }
 
-.list {
+.list,
+.toplist_2 {
   &.rowNoTandC,
   > .container {
     @include min(tablet) {
@@ -60,9 +61,14 @@
 
 .grid {
   @include flex-align(stretch, stretch);
+
   @include min(tablet) {
     @include flex-align(stretch, space-between);
-    display: flex !important;
+
+    &.toplist_0,
+    &.toplist_1 {
+      display: flex !important;
+    }
     
     > div {
       > a {
@@ -73,6 +79,21 @@
       }
     }
   }
+
+  @include min(laptop) {
+    &.toplist_2 {
+      display: flex !important;
+      align-items: flex-start;
+
+      > ul {
+        padding: 0;
+      }
+
+      > a:last-child {
+        align-self: stretch;
+      }
+    }
+  }
 }
 
 .container {

package/src/components/molecules/wagering-calculator/wagering-calculator.module.scss

@@ -25,8 +25,8 @@
       cursor: pointer;
     }
 
-    button {
-      align-self: end;
+    a {
+      align-self: flex-end;
       height: 4.8rem !important;
       width: 100%;
     }

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

@@ -79,7 +79,10 @@ const Modules = ({ module, page, pageContext, index, exclOperator }) => {
         return loadable(() => import('../../../../components/molecules/operator-summary'));
       case 'game_iframe':
       case 'iframe':
-        return loadable(() => import('../../../../components/molecules/game-iframe'));
+        if (moduleItem?.value_type === 'template_block') {
+          return loadable(() => import('../../../../components/molecules/game-iframe'));
+        }
+        return loadable(() => import('gatsby-core-theme/src/components/atoms/iframe'));
       // Template blocks
       case 'info_grid':
       case 'information_grid':
@@ -126,18 +129,26 @@ const Modules = ({ module, page, pageContext, index, exclOperator }) => {
     ? 'archiveLabel'
     : null;
 
-  const extraProps =
-    module.name === 'bonus'
-      ? {
+  const extraProps = () => {
+    switch (module.name) {
+      case 'bonus':
+        return {
           operator: module?.value,
           logo: module?.value?.logo_url,
           hasLink: true,
           prettyLink: prettyTracker(module?.value, 'main', false, page?.template),
           isStickyCta: false,
-        }
-      : {
+        };
+      case 'iframe':
+        return {
+          src: module?.iframe_source,
+        };
+      default:
+        return {
           anchorLabel,
         };
+    }
+  };
 
   const moduleClassName = `${module.name}Module`;
 
@@ -183,7 +194,7 @@ const Modules = ({ module, page, pageContext, index, exclOperator }) => {
           module={module}
           page={page}
           pageContext={pageContext}
-          {...extraProps}
+          {...extraProps()}
           exclOperator={exclOperator}
           isHomepageFirstModule={homepageFirstModule}
         />

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

@@ -18,6 +18,7 @@ const CookieConsent = ({
   location = 'bottom',
   showOnScroll = true,
   settingsCookie,
+  settingsButtonType = 'secondary',
   isPageHomepage,
   type,
   cookieImage = '../../../images/cookie.png',
@@ -64,7 +65,7 @@ const CookieConsent = ({
                   isInternalLink={false}
                   onClick={() => setShowModal(!showModal)}
                   btnText={translate(translations, 'cookie_setting_button', 'Cookie Setting')}
-                  buttonType="tertiary"
+                  buttonType={settingsButtonType}
                   buttonSize="m"
                   gtmClass="cookie-consent-gtm btn-cta"
                 />
@@ -113,6 +114,7 @@ CookieConsent.propTypes = {
   type: PropTypes.string,
   cookieName: PropTypes.string,
   showOnScroll: PropTypes.bool,
+  settingsButtonType: PropTypes.string,
   isPageHomepage: PropTypes.bool,
   cookieImage: PropTypes.string,
   logo: PropTypes.string,

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

@@ -11,6 +11,7 @@ import Row from '../../../../../components/molecules/toplist/row/variant-one';
 import styles from './list.module.scss';
 import styleTemplateOne from './template-one.module.scss';
 import styleTemplateTwo from './template-two.module.scss';
+import styleTemplateThree from './template-three.module.scss';
 
 export default function List({
   pagePath,
@@ -56,16 +57,22 @@ export default function List({
     }
   }
 
+  const templateStyle = () => {
+    switch (modulestyle) {
+      case 'template_two':
+        return styleTemplateTwo.templateTwo;
+      case 'template_three':
+        return styleTemplateThree.templateThree;
+      default:
+        return styleTemplateOne.templateOne;
+    }
+  };
+
+  const isGrid = modulestyle === 'template_two';
+
   return (
     <>
-      <ul
-        className={`${styles.list || ''} ${
-          modulestyle === 'template_two'
-            ? styleTemplateTwo.templateTwo || ''
-            : styleTemplateOne.templateOne || ''
-        } `}
-        key={keygen()}
-      >
+      <ul className={`${styles.list || ''} ${templateStyle()} `} key={keygen()}>
         {items.map((item, index) => (
           <Row
             pagePath={pagePath}
@@ -78,8 +85,9 @@ export default function List({
             key={keygen()}
             itemRefs={elRefs}
             template={template}
-            layout={modulestyle === 'template_two' ? 'grid' : 'list'}
+            layout={isGrid ? 'grid' : 'list'}
             verifyIcon={verifyIcon}
+            showAuthor={modulestyle !== 'template_three'}
           />
         ))}
       </ul>

package/src/gatsby-core-theme/components/organisms/toplist/list/list.module.scss

@@ -1,7 +1,7 @@
 .list {
   padding: 0;
   list-style: none;
-  gap: 2rem;
+  row-gap: 2rem;
   counter-reset: toplist-counter;
 
   > li {

package/src/gatsby-core-theme/components/organisms/toplist/list/template-three.module.scss

@@ -0,0 +1,28 @@
+.templateThree {
+    // @include flex-direction(column);
+    columns: 29rem;
+    gap: 1rem;
+    counter-reset: grid;
+    row-gap: 2rem;
+  
+    > li {
+      break-inside: avoid;
+      aspect-ratio: 4 / 3;
+      display: flex !important;
+      margin-bottom: 1rem;
+      margin-top: 1rem;
+  
+      > div:first-child {
+        display: flex !important;
+      }
+  
+      &:nth-child(3n) {
+        aspect-ratio: 1;
+      }
+  
+      // &:nth-child(3n - 1) {
+      //   aspect-ratio: 2 / 3;
+      // }
+    }
+  }
+  

package/src/gatsby-core-theme/components/organisms/toplist/list/template-two.module.scss

@@ -3,10 +3,11 @@
   grid-template-columns: auto;
 
   @include min(tablet) {
-    grid-template-columns: repeat(3, minmax(0, 1fr));
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    column-gap: 2.4rem;
   
     > li {
-      grid-column: 1/4;
+      grid-column: 1/3;
   
       &:first-child {
         grid-column: 1;
@@ -15,6 +16,14 @@
       &:nth-child(2) {
         grid-column: 2;
       }
+    }
+  }
+  
+  @include min(laptop) {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  
+    > li {
+      grid-column: 1/4;
   
       &:nth-child(3) {
         grid-column: 3;

package/src/gatsby-core-theme/components/organisms/toplist/toplist.stories.js

@@ -82,6 +82,7 @@ export default {
 
 const ToplistTemplateOne = (args) => <Toplist {...args} />;
 const ToplistTemplateTwo = (args) => <Toplist {...args} />;
+const ToplistTemplateThree = (args) => <Toplist {...args} />;
 
 export const TemplateOne = ToplistTemplateOne.bind({});
 TemplateOne.args = {
@@ -92,3 +93,8 @@ export const TemplateTwo = ToplistTemplateTwo.bind({});
 TemplateTwo.args = {
   module: getSingleToplistWithTemplate('template_two'),
 };
+
+export const TemplateThree = ToplistTemplateThree.bind({});
+TemplateThree.args = {
+  module: getSingleToplistWithTemplate('template_three'),
+};

package/storybook/public/iframe.html

@@ -361,4 +361,4 @@
           
       
           
-            window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/organisms/navigation","files":"navigation.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/organisms\\/navigation\\/navigation\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/organisms/anchor","files":"anchor.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/organisms\\/anchor\\/anchor\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/bonus/template-one","files":"bonus.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/bonus\\/template-one\\/bonus\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/bonus/template-two","files":"bonus.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/bonus\\/template-two\\/bonus\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content","files":"text.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/text\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content","files":"show-more.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/show-more\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content","files":"content.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/content\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content/lists","files":"lists.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/lists\\/lists\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content/frame","files":"frame.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/frame\\/frame\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content/table","files":"table-one.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/table\\/table-one\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content/table","files":"table-two.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/table\\/table-two\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/pagination","files":"pagination.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/pagination\\/pagination\\.stories\\.js)$"}];</script><script src="runtime~main.daeb2a8f.iframe.bundle.js"></script><script src="487.2d630f0c.iframe.bundle.js"></script><script src="main.93d9d84b.iframe.bundle.js"></script></body></html>
+            window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/organisms/navigation","files":"navigation.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/organisms\\/navigation\\/navigation\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/organisms/anchor","files":"anchor.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/organisms\\/anchor\\/anchor\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/bonus/template-one","files":"bonus.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/bonus\\/template-one\\/bonus\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/bonus/template-two","files":"bonus.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/bonus\\/template-two\\/bonus\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content","files":"text.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/text\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content","files":"show-more.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/show-more\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content","files":"content.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/content\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content/lists","files":"lists.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/lists\\/lists\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content/frame","files":"frame.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/frame\\/frame\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content/table","files":"table-one.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/table\\/table-one\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/content/table","files":"table-two.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/content\\/table\\/table-two\\.stories\\.js)$"},{"titlePrefix":"","directory":"../node_modules/gatsby-core-theme/src/components/molecules/pagination","files":"pagination.stories.js","importPathMatcher":"^(?:\\.\\.\\/node_modules\\/gatsby-core-theme\\/src\\/components\\/molecules\\/pagination\\/pagination\\.stories\\.js)$"}];</script><script src="runtime~main.daeb2a8f.iframe.bundle.js"></script><script src="487.2d630f0c.iframe.bundle.js"></script><script src="main.6563717e.iframe.bundle.js"></script></body></html>