gatsby-core-theme 2.0.18 → 2.2.1

package/CHANGELOG.md

@@ -1,3 +1,88 @@
+## [2.2.1](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v2.2.0...v2.2.1) (2022-01-20)
+
+
+### Bug Fixes
+
+* dmca badge now using env var for id ([bc65104](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/bc651049d3a435ee0cbf4b7f2bd418a300609fc8))
+
+# [2.2.0](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v2.1.0...v2.2.0) (2022-01-18)
+
+
+### Bug Fixes
+
+* add track background color ([8886659](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/888665908dc7a97e008d42321e1a61482d1d31d8))
+* add variable  thumb-color ([7d0d1da](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/7d0d1da9f6244573fa38dca0fbc463ceb0e5840d))
+* dmca ([a320701](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/a320701a80b61e1a354fcc295f531d763b683261))
+* fixes ([3886daf](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/3886daf5e8771ae69e4379a440ed944b23d39ae6))
+* menu item, cards row gap ([6fca1e4](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/6fca1e4f9117bd0d84c143ba57eb0531b467327b))
+* menu item, cards row gap ([cd319ca](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/cd319ca0f4efa1845e5cf2df1e22644dd366e312))
+* placeholder ([8c9b5bd](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/8c9b5bdaef7173406689e3e210e586b237d46ba3))
+* relocate placeholders to processor ([96c17f6](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/96c17f636abc652013d0bf396b3a496a167748ea))
+* removed slider from anchor module ([185975f](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/185975f75a3f6a592a4477d772ccf148e17e07ce))
+* small fixes ([cc29dfa](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/cc29dfa365105bbaae1b14c0b9641d2d936c1ffe))
+* use generateplaceholder for sitemap titles ([9e3ef4e](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/9e3ef4ee5f8f0c5dff129f2da8a50f3997215feb))
+
+
+### Code Refactoring
+
+* move replacePlaceholder to gatsby node esm ([9eb9d84](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/9eb9d842f2ef1496550348a502d1323ce1552475))
+* update counter li key prop ([8796b36](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/8796b361618e44347e1250943e2d31a6b8977b09))
+* update generators tests ([39dd1f5](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/39dd1f5e24f7e79abbaf98793be83ede80ca7a14))
+* update placeholder generation in gatsby-node.esm, processSitemapPages and generatePlaceholderString ([52ae3fe](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/52ae3fe551d4520296be05302df58a1880f46970))
+* update processSitemapPages for tests and remove generatePlaceholderString import ([3b73cb8](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/3b73cb84a2d4d00ceb625aa0f21a4416990dfc34))
+* update siteInfo check for node process ([6940762](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/69407626dda1f4541b86589c2f738929363ddb09))
+
+
+* Merge branch 'tm-2625-dmca' into 'master' ([d75e192](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/d75e1927e5c8eac06426c43b5e18396202359b72))
+* Merge branch 'tm-2654-minor-fixes' into 'master' ([d207bd6](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/d207bd6a376d390714c157f82f98ccdca3334844))
+* Merge branch 'tm-2656-placeholder' into 'master' ([92d1b1b](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/92d1b1b36f733f9b880750b36aa710bd5bba536a))
+* Merge branch 'tm-2557-cards-v2-changes' into 'master' ([bd5c28f](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/bd5c28f764cb38a949d0638d6bf4782a7ad9de14))
+* Merge branch 'tm-2655-anchor-module' into 'master' ([4748e7a](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/4748e7a8458003eea7c8dd0c163fb338dcd2f173))
+* Merge branch 'tm-2656-fix-placeholders' into 'master' ([b8a06f3](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/b8a06f3cc24fc39df0ca949c404c41ed69a13ad8))
+
+
+### Features
+
+* cards v2 filters cvhanges ([b0f3a96](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/b0f3a96cc784fcf432cee9c14b63574df362e05f))
+
+# [2.1.0](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v2.0.19...v2.1.0) (2022-01-13)
+
+
+### Bug Fixes
+
+* added dmca as component ([2aae7bc](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/2aae7bc3cf0d8ba1210154ad0f7aecd24221c92d))
+* added lazyload and image added as prop ([71b7ad7](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/71b7ad70f0499a09eeada813fce007c273c99422))
+* test ([d103191](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/d103191b379926afd7ae9effcd29f0cbe61d9c28))
+
+
+### Code Refactoring
+
+* update counter and counterItem for w3 validator ([9ebbcdc](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/9ebbcdcbe14f0a5adf8ca6acedfbe1c7c7b19ec3))
+* update css parser for w3 validator ([db7dd7d](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/db7dd7d76f3d0404a19471bdf45e883bff635512))
+
+
+* Merge branch 'tm-2654-open-graph' into 'master' ([0e2a375](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/0e2a37579483adde033aa19e58b677fa80e75f3a))
+* Merge branch 'tm-2567-update-theme-for-w3-validator' into 'master' ([cb0ab99](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/cb0ab990a56d26a7591bb089d2ed38f001b0cc74))
+* Merge branch 'tm-2625-dmca-implementation' into 'master' ([8cb7230](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/8cb7230734fb97c2222ebb8207c646206ab9d92c))
+* Merge branch 'tm-2567-update-theme-for-w3-validator' into tm-2567-update-theme-for-w3-validator ([2a0701e](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/2a0701e35a71d0d00e86d303d82843b0897531fb))
+
+
+### Features
+
+* added new og properties ([2aba269](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/2aba2697f9f80b1326e0118a8bf80f50f52e721f))
+
+## [2.0.19](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v2.0.18...v2.0.19) (2022-01-11)
+
+
+### Bug Fixes
+
+* bonus and selleing points extra divs ([892d6a4](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/892d6a4542efeb16717136472b0422ca5e089ca8))
+* make key dynamic cta ([a7b883c](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/a7b883cfa2010d5e95d54137e1cb7f86a92115ac))
+
+
+* Merge branch 'tm-2473-lottery-fixes' into 'master' ([fbc331c](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/fbc331c1d3f8ff3276b56e518e6de3e359393fc2))
+* Merge branch 'master' of git.ilcd.rocks:team-floyd/themes/gatsby-themes ([86b2be9](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/commit/86b2be99241420c6fb77fb3bea3e22f69a1ddb98))
+
 ## [2.0.18](https://git.ilcd.rocks/team-floyd/themes/gatsby-themes/compare/v2.0.17...v2.0.18) (2022-01-10)
 
 

package/gatsby-node.esm.js

@@ -5,7 +5,7 @@
 import { cloneDeep, chunk, pick } from 'lodash';
 import chalk from 'chalk';
 import { getData, getLocalData } from './src/helpers/api';
-import { generatePlaceholderString, generateTrackerLink } from './src/helpers/generators';
+import { generateTrackerLink } from './src/helpers/generators';
 import processor, { processSitemapPages } from './src/helpers/processor';
 import { pickAuthorsPageKeys } from './src/constants/pick-keys';
 
@@ -150,13 +150,13 @@ exports.createPages = async ({ actions: { createPage } }, themeOptions) => {
   // add data to modules
   const processed = processor.run(response, themeOptions, fs);
   pages = processed.pages;
-  htmlSitemapPages = processSitemapPages(pages, processed.site_markets);
   siteInfo = processed.general;
   operators = processed.relations.operator;
   templates = processed.templates;
   // eslint-disable-next-line prefer-destructuring
   languageKey = Object.keys(processed.relations.translations)[0];
   translations = processed.relations.translations[languageKey];
+  htmlSitemapPages = processSitemapPages(pages, processed.site_markets);
 
   if (themeOptions.siteType === 'sport') {
     sports = Object.keys(response.relations['sports_data'].sports).map(
@@ -204,26 +204,6 @@ exports.createPages = async ({ actions: { createPage } }, themeOptions) => {
           pick(authors[key], pickAuthorsPageKeys)
         );
 
-        // replacing string placehoders with year, month, date, etc.
-        page.title =
-          page.title &&
-          generatePlaceholderString(page.title, translations, {
-            siteName: response.general.site_name,
-            siteTitle: page.title,
-          });
-        page.meta_title =
-          page.meta_title &&
-          generatePlaceholderString(page.meta_title, translations, {
-            siteName: response.general.site_name,
-            siteTitle: page.title,
-          });
-        page.meta_description =
-          page.meta_description &&
-          generatePlaceholderString(page.meta_description, translations, {
-            siteName: response.general.site_name,
-            siteTitle: page.title,
-          });
-
         if (hasArchiveModule(page)) {
           createArchivePage(page, marketSections, prefilledModules, createPage);
           return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-core-theme",
-  "version": "2.0.18",
+  "version": "2.2.1",
   "description": "Gatsby Theme NPM Package",
   "main": "index.js",
   "GATSBY_RECAPTCHA_SITEKEY": "6LfoyvMUAAAAAO4nl_MQnqHb4XdHxEiu5cXgIqeB",

package/src/components/atoms/bonus/bonus.module.scss

@@ -1,15 +1,12 @@
-.bonus {
-  @include flex-direction(column);
-  div:first-child {
-    font-size: 2rem;
-    font-weight: 700;
-    color: var(--primary-color);
-    padding-right: 1rem;
-  }
-  div:nth-child(2) {
-    font-size: 1.6rem;
-    color: var(--color-22);
-    font-weight: 700;
-    padding: 0.5rem 0;
-  }
+.title {
+  font-size: 2rem;
+  font-weight: 700;
+  color: var(--primary-color);
+  padding-right: 1rem;
+}
+.desc {
+  font-size: 1.6rem;
+  color: var(--color-22);
+  font-weight: 700;
+  padding: 0.5rem 0;
 }

package/src/components/atoms/bonus/bonus.test.js

@@ -8,10 +8,9 @@ import Bonus from '.';
 describe('Bonus Component', () => {
   test('render with props', () => {
     const item = getToplistItem();
-    const { container, getByText } = render(<Bonus item={item} tracker="main" />);
+    const { getByText } = render(<Bonus item={item} tracker="main" />);
     expect(getByText('€100 welcome bonus')).toBeTruthy();
     expect(getByText('€100 welcome bonus').getAttribute('class')).toEqual('title');
-    expect(container.querySelector('div.bonus')).toBeTruthy();
   });
   test('without oneLiner', () => {
     const { container } = render(

package/src/components/atoms/bonus/index.js

@@ -14,12 +14,10 @@ const Bonus = ({ item, tracker = 'main' }) => {
   const onelinerSplitted = oneLiner.one_liner.split('+');
 
   return (
-    <div className={styles.bonus}>
-      <div className={styles.title}>{onelinerSplitted[0]}</div>
-      {onelinerSplitted.length === 2 && (
-        <div className={styles.desc}>{`+${onelinerSplitted[1]}`}</div>
-      )}
-    </div>
+    <>
+      <p className={styles.title}>{onelinerSplitted[0]}</p>
+      {onelinerSplitted.length === 2 && <p className={styles.desc}>{`+${onelinerSplitted[1]}`}</p>}
+    </>
   );
 };
 

package/src/components/atoms/disclaimer/disclaimer.test.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { render, cleanup } from '@testing-library/react';
+
+import '@testing-library/jest-dom/extend-expect';
+
+import Disclaimer from '.';
+
+const dmcaImg = (
+  <img
+    src="https://images.dmca.com/Badges/_dmca_premi_badge_1.png?ID=9e466e76-827d-4247-ac51-4eb75b227301"
+    alt="DMCA.com Protection Status"
+  />
+);
+
+describe('Disclaimer Component', () => {
+  test('render disclaimer badge', () => {
+    const { container } = render(<Disclaimer image={dmcaImg} />);
+    expect(container.querySelectorAll('a')).toHaveLength(1);
+    expect(container.querySelectorAll('img')).toHaveLength(1);
+  });
+});
+afterEach(() => {
+  cleanup();
+});

package/src/components/atoms/disclaimer/index.js

@@ -0,0 +1,45 @@
+/* eslint-disable no-return-assign */
+/* eslint-disable no-plusplus */
+/* eslint-disable no-var */
+import React, { useRef } from 'react';
+import PropTypes from 'prop-types';
+
+const Disclaimer = ({ image }) => {
+  const anchorElement = useRef(null);
+
+  function dmca() {
+    document.addEventListener(
+      'click',
+      () => {
+        const element = anchorElement.current;
+        if (element.getAttribute('href').indexOf('refurl') < 0) {
+          element.href = `${`${
+            element.href + (element.href.indexOf('?') === -1 ? '?' : '&')
+          }refurl`}=${document.location}`;
+        }
+      },
+      false
+    );
+  }
+
+  return (
+    <>
+      <a
+        ref={anchorElement}
+        onClick={dmca}
+        href={`//www.dmca.com/Protection/Status.aspx?ID=${process.env.DMCA_PROTECTION_ID}`}
+        title="DMCA.com Protection Status"
+        target="_blank"
+        rel="noreferrer"
+      >
+        {image}
+      </a>
+    </>
+  );
+};
+
+export default Disclaimer;
+
+Disclaimer.propTypes = {
+  image: PropTypes.node,
+};

package/src/components/atoms/menu/items/item/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable no-nested-ternary */
 import React, { useState, useEffect, useContext } from 'react';
 import PropTypes from 'prop-types';
 import Link from '~hooks/link';
@@ -63,7 +64,7 @@ export default function Item({
       {item.value?.includes('http') || item.value?.includes('www') ? (
         <a
           aria-label={`${item?.title} link`}
-          href={item.value}
+          href={item.value ? item.value : '#'}
           title={item.title}
           rel={`noreferrer ${item.nofollow && 'nofollow'}`}
           target="_blank"
@@ -78,7 +79,7 @@ export default function Item({
           <ItemImage />
           {item.title}
         </a>
-      ) : (
+      ) : item.value !== null ? (
         <Link
           className={`${gtmClass} ${styles.item} ${opened && styles.openedLink} ${active} ${
             !options.mobile.subMenuDropDownButton && isMobile && hasChildren
@@ -87,7 +88,8 @@ export default function Item({
           } ${hasChildren ? styles.hasChildren : ''} ${
             !options.mobile.subMenuDropDownButton ? styles.noDropDownButton : ''
           }`}
-          to={item.value ? item.value : '#'}
+          disabled={item.value === null}
+          to={item.value}
           title={item.title}
           rel={item.nofollow && 'nofollow'}
           aria-label={`${item?.title} link`}
@@ -96,6 +98,8 @@ export default function Item({
           <ItemImage />
           {item.title}
         </Link>
+      ) : (
+        <div className={styles.item}>{item.title}</div>
       )}
       {options.mobile.subMenuDropDownButton && isMobile && hasChildren && (
         <button

package/src/components/atoms/operator-cta/index.js

@@ -12,6 +12,7 @@ export default function OperatorCta({
   placeholderText = 'Coming Soon',
   closedCasinoText = 'This Casino has closed',
   playText = 'Visit',
+  translationKey = 'play_now',
   tracker = 'main',
   gtmClass = '',
 }) {
@@ -46,7 +47,7 @@ export default function OperatorCta({
 
     const trackerType = tracker.toLowerCase().replace(' ', '_');
     const prettyLink = prettyTracker(operator, trackerType);
-    const translateBtn = translate(translations, 'play_now', playText);
+    const translateBtn = translate(translations, translationKey, playText);
     return (
       <Button
         to={prettyLink}

package/src/components/atoms/selling-points/index.js

@@ -11,9 +11,8 @@ const SellingPoints = ({ sellingPoints, icon, limit = 3 }) => {
   return (
     <ul className={styles.sellingPoint}>
       {sellingPoints.slice(0, limit).map((item) => (
-        <li key={keygen()}>
-          <span className={`${icon && styles.tick}`}>{` `}</span>
-          <span>{item}</span>
+        <li className={`${icon && styles.tick}`} key={keygen()}>
+          {item}
         </li>
       ))}
     </ul>

package/src/components/atoms/selling-points/selling-points.module.scss

@@ -7,7 +7,7 @@
     font-size: 1.4rem;
     width: 100%;
 
-    .tick {
+    &.tick {
       position: relative;
       margin-left: 2rem;
       &::before {
@@ -16,7 +16,6 @@
         padding: 0px 0px .8rem .32rem;
         border-right-width: .18rem;
         border-bottom-width: .18rem;
-        bottom: -.3rem;
         left: -1.8rem;
       }
     }

package/src/components/molecules/counter/counter-item/counter-item.module.scss

@@ -1,19 +1,14 @@
-.counterItem {
-  @include flex-align(center, center);
-  flex-direction: column;
-
-  .title {
-    color: black;
-    font: {
-      size: var(--h2-size);
-      weight: bold;
-    }
+.title {
+  color: black;
+  font: {
+    size: var(--h2-size);
+    weight: bold;
   }
+}
 
-  .value {
-    font: {
-      weight: bold;
-      size: 10rem;
-    }
+.value {
+  font: {
+    weight: bold;
+    size: 10rem;
   }
 }

package/src/components/molecules/counter/counter-item/index.js

@@ -5,20 +5,18 @@ import LazyLoad from 'react-lazyload';
 import CountNumber from './count-number';
 import styles from './counter-item.module.scss';
 
-const CounterItem = ({ data, icon }) => {
-  return (
-    <li className={styles.counterItem}>
-      <div className={styles.title}>{data.title}</div>
-      <div className={styles.value}>
-        {icon && icon}
-        {/* run count up if the item is visible and has not counted up yet */}
-        <LazyLoad>
-          <CountNumber end={parseInt(data.value)} />
-        </LazyLoad>
-      </div>
-    </li>
-  );
-};
+const CounterItem = ({ data, icon }) => (
+  <>
+    <div className={styles.title}>{data.title}</div>
+    <div className={styles.value}>
+      {icon && icon}
+      {/* run count up if the item is visible and has not counted up yet */}
+      <LazyLoad>
+        <CountNumber end={parseInt(data.value)} />
+      </LazyLoad>
+    </div>
+  </>
+);
 
 CounterItem.propTypes = {
   data: PropTypes.shape({

package/src/components/molecules/counter/counter.module.scss

@@ -8,6 +8,8 @@
   }
 
   li {
+    @include flex-align(center, center);
+    flex-direction: column;
     width: 40rem;
     height: 20rem;
     background: white;

package/src/components/molecules/counter/index.js

@@ -7,20 +7,22 @@ import CounterItem from './counter-item';
 import styles from './counter.module.scss';
 import keygen from '~helpers/keygen';
 
-const Counter = ({ module }) => {
-  return (
-    <>
-      {module.content && (
-        <p className={styles.counterContent} dangerouslySetInnerHTML={{ __html: module.content }} />
-      )}
-      <ul className={styles.counter}>
-        {module.items.map((item) => {
-          return <CounterItem data={item} key={keygen()} />;
-        })}
-      </ul>
-    </>
-  );
-};
+const Counter = ({ module }) => (
+  <>
+    {module.content && (
+      <p className={styles.counterContent} dangerouslySetInnerHTML={{ __html: module.content }} />
+    )}
+    <ul className={styles.counter}>
+      {module.items.map((item) => {
+        return (
+          <li key={keygen()}>
+            <CounterItem data={item} />;
+          </li>
+        );
+      })}
+    </ul>
+  </>
+);
 
 Counter.propTypes = {
   module: PropTypes.shape({

package/src/components/molecules/toplist/default-row/index.js

@@ -43,7 +43,14 @@ const Row = ({ item, oneliner = 'main', layout = 'list', tracker = 'main' }) =>
           height={40}
         />
       </a>
-      <Bonus item={item} tracker={oneliner} />
+      <a
+        href={prettyLink}
+        target="_blank"
+        rel="noreferrer"
+        className="toplist-variant-one-gtm bonus-cta"
+      >
+        <Bonus item={item} tracker={oneliner} />
+      </a>
       <StarRating numOfStars={5} rating={itemRating} />
       <SellingPoints icon={<MdCheck />} sellingPoints={item.selling_points} />
       <div>

package/src/components/organisms/anchor/anchor.module.scss

@@ -1,13 +1,26 @@
-.sliderWrapper {
+.anchor {
+  @include flex-direction(row);
+  &::-webkit-scrollbar {
+    height: 0.5rem;
+  }
+  &::-webkit-scrollbar-track {
+    background: var(--anchor-track-color);
+  }
+  &::-webkit-scrollbar-thumb {
+    background: var(--anchor-thumb-color);
+  }
+  overflow-x: scroll;
   .link {
     word-break: inherit;
     white-space: nowrap;
-
+    margin-bottom: 0.5rem;
     background-color: var(--color-7);
     padding: 1rem 2.5rem;
     border-radius: 0.6rem;
     color: #000;
     font-weight: 400;
+    margin-right: 1.6rem;
+    margin-bottom: 0.5rem;
 
     &:hover {
       background-color: var(--secondary-color);
@@ -15,10 +28,10 @@
     }
   }
 }
-.storyDivs{
+.storyDivs {
   width: 100%;
   display: block;
   margin: 3rem 0;
   background-color: #eee;
   padding: 2rem;
-}
+}

package/src/components/organisms/anchor/index.js

@@ -1,12 +1,11 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import Slider from '~molecules/slider';
 import keygen from '~helpers/keygen';
 import { anchorLink } from '~helpers/strings';
 import styles from './anchor.module.scss';
 
-function Anchor({ module: { items }, headerOffset = 80, sliderGap = 0 }) {
+function Anchor({ module: { items }, headerOffset = 80 }) {
   const handleClick = (event) => {
     event.preventDefault();
     const scrollToElementId = event.currentTarget.getAttribute('href').replace('#', '');
@@ -23,13 +22,7 @@ function Anchor({ module: { items }, headerOffset = 80, sliderGap = 0 }) {
   };
 
   return (
-    <Slider
-      useArrows={false}
-      usePagination={false}
-      settings={{ numberOfSlides: 0, sliderGap }}
-      className={styles.sliderWrapper}
-      gtmClass="anchor-carousel-gtm"
-    >
+    <div className={styles.anchor} gtmClass="anchor-carousel-gtm">
       {items.map((anchor) => (
         <a
           className={`${styles.link} anchor-carousel-gtm anchor-menu-gtm`}
@@ -40,7 +33,7 @@ function Anchor({ module: { items }, headerOffset = 80, sliderGap = 0 }) {
           {anchor?.label}
         </a>
       ))}
-    </Slider>
+    </div>
   );
 }
 
@@ -53,7 +46,6 @@ Anchor.propTypes = {
     ),
   }).isRequired,
   headerOffset: PropTypes.number.isRequired,
-  sliderGap: PropTypes.number,
   styles: PropTypes.shape({}),
 };
 

package/src/components/organisms/cards/cards.module.scss

@@ -13,6 +13,8 @@
     grid-template-columns: repeat(var(--cards-desktop-column), minmax(0,1fr));
   }
   column-gap: 0.8rem;
+  row-gap: 1rem;
+
   @include min(desktop) {
     column-gap: 1.6rem;
   }

package/src/components/organisms/head/index.js

@@ -66,6 +66,10 @@ const Head = ({ page = {}, siteInfo }) => {
       <meta name="og:type" content={page.path === '/' ? 'website' : 'article'} />
       <meta name="og:image" content={pageImage} />
       <meta name="og:url" content={getUrl(page.path)} />
+      <meta
+        property="og:locale"
+        content={getLanguage(page.language) === 'en' ? 'en_GB' : getLanguage(page.language)}
+      />
 
       {schemaGenerator(page, pageImage).map(
         (schema) =>

package/src/helpers/css-parser.js

@@ -6,11 +6,13 @@ export function parseCss(css) {
   let token;
 
   while ((token = tokenizer.exec(cssFormat))) {
-    obj[
-      token[1].replace(/-([a-z])/g, function (g) {
-        return g[1].toUpperCase();
-      })
-    ] = token[2];
+    if (token[2] && token[2] !== 'null') {
+      obj[
+        token[1].replace(/-([a-z])/g, function (g) {
+          return g[1].toUpperCase();
+        })
+      ] = token[2];
+    }
   }
 
   return obj;

package/src/helpers/css-parser.test.js

@@ -5,7 +5,7 @@ describe('parseCss Helper', () => {
     expect(typeof parseCss('margin-left: 20px;')).toEqual('object');
   });
   test('output', () => {
-    expect(parseCss('margin-left: 20px; margin-bottom:40px')).toEqual({
+    expect(parseCss('margin-left: 20px; margin-bottom:40px; height: null')).toEqual({
       marginBottom: '40px',
       marginLeft: '20px',
     });

package/src/helpers/generators.js

@@ -21,7 +21,7 @@ export function generateTrackerLink(operator, trackerType) {
   }
 }
 
-export function generatePlaceholderString(string, translations, props) {
+export function generatePlaceholderString(string = '', translations, data) {
   const date = new Date();
   const day = date.getDate();
   const month = months[date.getMonth()];
@@ -38,8 +38,8 @@ export function generatePlaceholderString(string, translations, props) {
         '[currentdate]': `${(translations && translations[month]) || month} ${day}, ${year}`,
         '[currentmonth]': (translations && translations[month]) || month,
         '[currentyear]': year,
-        '[sitename]': (props && props.siteName) || '',
-        '[title]': (props && props.siteTitle) || '',
+        '[sitename]': (data && data.siteName) || '',
+        '[title]': (data && data.pageTitle) || '',
       }[match])
   );
 }

package/src/helpers/generators.test.js

@@ -32,7 +32,7 @@ describe('Generate Placeholders String', () => {
       null,
       {
         siteName: 'Site Name',
-        siteTitle: 'Site Title',
+        pageTitle: 'Site Title',
       }
     );
     const date = new Date();

package/src/helpers/processor/common.js

@@ -4,7 +4,7 @@ import settings from '../../constants/settings';
 // eslint-disable-next-line import/no-cycle
 import { processExtraFields } from '.';
 
-export function groupBy(list, keyName = 'author_id', single = false) {
+export function groupBy(list = {}, keyName = 'author_id', single = false) {
   const newObj = Object.values(list).reduce((acc, currentVal) => {
     if (!acc[currentVal[keyName]]) {
       acc[currentVal[keyName]] = [];

package/src/helpers/processor/index.js

@@ -8,7 +8,7 @@ import chalk from 'chalk';
 import ModuleValue from '../../constants/module-value';
 import SearchTypesEnable from '../../constants/search-types-enable';
 import { pickHTMLSitemapPageKeys } from '../../constants/pick-keys';
-
+import { generatePlaceholderString } from '../generators';
 // eslint-disable-next-line import/no-cycle
 import { processModule } from './modules';
 // eslint-disable-next-line import/no-cycle
@@ -131,6 +131,31 @@ export function processExtraFields(extraFields) {
   });
 }
 
+function updatePlaceholders(page, data) {
+  const languageKey = Object.keys(data.relations.translations)[0];
+  const translations = data.relations.translations[languageKey];
+
+  // replacing string placehoders with year, month, date, etc.
+  page.title =
+    page.title &&
+    generatePlaceholderString(page.title, translations, {
+      siteName: data.general.site_name,
+      siteTitle: page.title,
+    });
+  page.meta_title =
+    page.meta_title &&
+    generatePlaceholderString(page.meta_title, translations, {
+      siteName: data.general.site_name,
+      siteTitle: page.title,
+    });
+  page.meta_description =
+    page.meta_description &&
+    generatePlaceholderString(page.meta_description, translations, {
+      siteName: data.general.site_name,
+      siteTitle: page.title,
+    });
+}
+
 export default {
   run(data, themeOptions, fs) {
     const start = new Date();
@@ -163,6 +188,7 @@ export default {
         transformedPages[market][pageType].forEach((page, index) => {
           // process page extra fields
           processExtraFields(page.extra_fields);
+          updatePlaceholders(page, data);
 
           // set page relation
           if (

package/src/helpers/processor/modules.js

@@ -114,19 +114,25 @@ export function processCardsV2(module, pagesCloned, pagesMappedById) {
       pagesMappedById[page_id] && module.items.push(pagesMappedById[page_id]);
     });
   } else if (cardSelector === 'use_filters') {
-    // Get all pages by the selected page type
-    const pagesGroupedByType = pagesCloned[pageType];
+    let pagesList = [];
 
-    // Grouping pages by template ID
-    if (!pagesGroupedByTemplateId[pageType]) {
-      pagesGroupedByTemplateId[pageType] = groupBy(pagesGroupedByType, 'template_id');
-    }
+    if (pageType) {
+      // Get all pages by the selected page type
+      const pagesGroupedByType = pagesCloned[pageType];
+
+      // Grouping pages by template ID
+      if (!pagesGroupedByTemplateId[pageType]) {
+        pagesGroupedByTemplateId[pageType] = groupBy(pagesGroupedByType, 'template_id');
+      }
 
-    // Populate pagesList if page type and template exists
-    const pagesList =
-      !pagesGroupedByTemplateId[pageType] || !pagesGroupedByTemplateId[pageType][pageTemplateId]
-        ? []
-        : pagesGroupedByTemplateId[pageType][pageTemplateId];
+      // Populate pagesList if page type and template exists
+      pagesList =
+        !pagesGroupedByTemplateId[pageType] || !pagesGroupedByTemplateId[pageType][pageTemplateId]
+          ? []
+          : pagesGroupedByTemplateId[pageType][pageTemplateId];
+    } else {
+      pagesList = pagesMappedById.map((page) => page);
+    }
 
     // Check if there are pages before starting filtering
     if (pagesList.length > 0) {