gatsby-matrix-theme 31.0.0 → 31.0.1

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+## [31.0.1](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v31.0.0...v31.0.1) (2023-08-24)
+
+
+### Bug Fixes
+
+* excluded header fo search path ([3f12519](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/3f1251900d9584941ce5e19743bfeaaa3fc1dcd3))
+* update search for matrix ([164282d](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/164282d94590827dd8e60a923e6af343b29be06d))
+* update the latest core version ([c7070a0](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/c7070a068ed6b3bc2cf941342489477ebfd5b10a))
+
+
+### Code Refactoring
+
+* show custom heading for site contacts ([70eaf22](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/70eaf22fc60504812f4b794fc96c8e8ad7956d09))
+
+
+* Merge branch 'tm-3556-contact-us-page' into 'master' ([f44db71](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/f44db71e0c8140e8ab8a70719baf466fd2c91092))
+* Merge branch 'tm-3533-enable-search-for-multiple-market' into 'master' ([c936102](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/c9361024ca289104e007cbc1f4e04bbf35bee621))
+* Merge branch 'tm-3533-enable-search-for-multiple-market' into 'master' ([1a1c463](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/1a1c463d101b6c08a047d6cc865a629eb8232231))
+
 # [31.0.0](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v30.0.0...v31.0.0) (2023-08-22)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-matrix-theme",
-  "version": "31.0.0",
+  "version": "31.0.1",
   "main": "index.js",
   "description": "Matrix Theme NPM Package",
   "author": "",
@@ -25,7 +25,7 @@
   "dependencies": {
     "@react-icons/all-files": "^4.1.0",
     "gatsby": "^5.11.0",
-    "gatsby-core-theme": "28.0.1",
+    "gatsby-core-theme": "28.0.2",
     "gatsby-plugin-sharp": "^5.11.0",
     "gatsby-plugin-sitemap": "^3.3.0",
     "gatsby-transformer-sharp": "^5.11.0",

package/src/components/atoms/site-contacts/index.js

@@ -1,24 +1,34 @@
-import React from 'react';
+import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
+import { Context } from 'gatsby-core-theme/src/context/MainProvider';
+import { translate } from 'gatsby-core-theme/src/helpers/getters';
 import keygen from 'gatsby-core-theme/src/helpers/keygen';
 import styles from './site-contacts.module.scss';
 
-const SiteContacts = ({ page }) => {
+const SiteContacts = ({ page, showHeading = false, heading = null }) => {
+  const { translations } = useContext(Context) || {};
   const { siteSchema } = page || {};
   const email = siteSchema?.email || null;
 
   if (!email) return;
 
   return (
-    <div className={styles.siteContacts}>
-      <ul className={styles?.generalContacts || ''}>
-        {email?.map((item) => (
-          <li key={keygen()}>
-            <p>{item.contact_type}</p>
-            <a href={`mailto:${item.email}`}>{item.email}</a>
-          </li>
-        ))}
-      </ul>
+    <div className={styles.siteContactsContainer}>
+      {showHeading && (
+        <h2>
+          {heading || translate(translations, 'reach_us', 'Reach out to one of our departments')}
+        </h2>
+      )}
+      <div className={styles.siteContacts}>
+        <ul className={styles?.generalContacts || ''}>
+          {email?.map((item) => (
+            <li key={keygen()}>
+              <p>{item.contact_type}</p>
+              <a href={`mailto:${item.email}`}>{item.email}</a>
+            </li>
+          ))}
+        </ul>
+      </div>
     </div>
   );
 };
@@ -29,4 +39,6 @@ SiteContacts.propTypes = {
   page: PropTypes.shape({
     siteSchema: PropTypes.shape({}),
   }).isRequired,
+  showHeading: PropTypes.bool,
+  heading: PropTypes.string,
 };

package/src/components/atoms/site-contacts/site-contacts.stories.js

@@ -32,6 +32,18 @@ export default {
         defaultValue: { summary: '' },
       },
     },
+    showHeading: {
+      name: 'showHeading',
+      type: { name: 'boolean', required: false },
+      defaultValue: false,
+      description: 'Show/hide intro description of page',
+    },
+    heading: {
+      name: 'heading',
+      type: { name: 'string', required: false },
+      defaultValue: 'Show custom heading here',
+      description: 'Show custom heading here',
+    },
   },
   parameters: {
     docs: {

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

@@ -10,9 +10,10 @@ import keygen from 'gatsby-core-theme/src/helpers/keygen';
 import styles from 'gatsby-core-theme/src/components/molecules/main/main.module.scss';
 import settings from '../../../../constants/settings/newsletter';
 import FeedBackModule from '../../../../components/atoms/feedBackModule';
+import { isSearchPath } from '~helpers/isSearchPath';
 
 const Main = ({ section = {}, pageContext = {}, showAuthor = true, exclOperator = false }) => {
-  const { page } = pageContext;
+  const { page, allMarkets } = pageContext;
   const siteName = process.env.GATSBY_SITE_NAME;
   const showNewsletter = !(
     settings[siteName]?.filter_pages?.includes('*') ||
@@ -21,10 +22,9 @@ const Main = ({ section = {}, pageContext = {}, showAuthor = true, exclOperator
   );
   const isContactUsPage = !!section?.modules?.filter((module) => module.name === 'contact_form')
     .length;
-  const SearchPage =
-    page.path === 's'
-      ? loadable(() => import(`gatsby-core-theme/src/components/pages/search`))
-      : null;
+
+  const pathPrefixes = isSearchPath(allMarkets, page.path);
+  const SearchPage = pathPrefixes ? loadable(() => import(`~pages/search`)) : null;
   const HtmlSitemap = pageContext.sitemapData
     ? loadable(() => import(`gatsby-core-theme/src/components/atoms/sitemap`))
     : null;

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

@@ -34,6 +34,7 @@ const Search = ({
   children,
   noResults = 'We can’t find anything that matches your query. Please try again with other keywords.',
   page,
+  pageContext,
 }) => {
   const { setShowSearch } = useContext(NavigationContext);
   const pageSearchOptionsCopy = pageSearchOptions;
@@ -89,6 +90,16 @@ const Search = ({
         if (formSearchOptionsCopy.sort) {
           const types = getChildrenTypes();
           let filteredResults = [];
+
+          searchResultsRef.current.forEach((object) => {
+            if (object.relation && object.relation.market === pageContext.page?.market) {
+              filteredResults = [
+                ...filteredResults,
+                ...searchResultsRef.current.filter(filterByKey('id', object.id)),
+              ];
+            }
+          });
+
           types.forEach((type) => {
             filteredResults = [
               ...filteredResults,
@@ -109,7 +120,13 @@ const Search = ({
         setIsLoading(false);
       }
     }
-  }, [searchQuery, formSearchOptionsCopy, getChildrenTypes]);
+  }, [
+    searchQuery,
+    formSearchOptionsCopy?.sort,
+    formSearchOptionsCopy?.limit,
+    getChildrenTypes,
+    pageContext?.page?.market,
+  ]);
 
   // PROCESSES
 
@@ -340,7 +357,21 @@ const Search = ({
               )}
             >
               {getChildrenTypes().map((type, index) => {
-                let items = searchResultsRef.current.filter((item) => item.type === type);
+                let items = [];
+
+                searchResultsRef.current.forEach((object) => {
+                  if (
+                    object.relation &&
+                    object.relation.market === page?.market &&
+                    object.type === type
+                  ) {
+                    const filteredItems = searchResultsRef.current.filter(
+                      filterByKey('id', object.id)
+                    );
+                    items = items.concat(filteredItems);
+                  }
+                });
+
                 const titleObj = pageSearchOptionsCopy.archiveOptions.titles.find(
                   (title) => title.type === type
                 );
@@ -448,7 +479,15 @@ Search.propTypes = {
   }),
   children: PropTypes.elementType,
   styles: PropTypes.shape({}),
-  page: PropTypes.shape({}),
+  page: PropTypes.shape({
+    translations: PropTypes.shape({}),
+    market: PropTypes.string,
+  }),
+  pageContext: PropTypes.shape({
+    page: PropTypes.shape({
+      market: PropTypes.string,
+    }),
+  }),
 };
 
 export default Search;

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

@@ -10,7 +10,14 @@ import { NavigationContext } from 'gatsby-core-theme/src/components/organisms/na
 
 import styles from 'gatsby-core-theme/src/components/organisms/search/search.module.scss';
 
-const SearchForm = ({ className, searchIcon, iconWidth = 24, iconHeight = 24 }) => {
+const SearchForm = ({
+  className,
+  searchIcon,
+  iconWidth = 24,
+  iconHeight = 24,
+  pageContext,
+  searchURLPageName,
+}) => {
   const { showSearch, setShowSearch, setShowMenu, showMenu } = useContext(NavigationContext);
 
   const Search = showSearch ? (
@@ -89,6 +96,8 @@ const SearchForm = ({ className, searchIcon, iconWidth = 24, iconHeight = 24 })
           className={`${styles?.searchForm || ''} ${styles?.show || ''}`}
         >
           <Search
+            pageContext={pageContext}
+            searchURLPageName={searchURLPageName}
             searchIcon={searchIcon}
             formSearchOptions={{
               autoComplete: true,
@@ -128,6 +137,8 @@ SearchForm.propTypes = {
   searchIcon: PropTypes.string,
   iconWidth: PropTypes.number,
   iconHeight: PropTypes.number,
+  pageContext: PropTypes.shape({}),
+  searchURLPageName: PropTypes.string,
 };
 
 export default SearchForm;

package/src/gatsby-core-theme/components/pages/body/index.js

@@ -11,6 +11,7 @@ import Main from 'gatsby-core-theme/src/components/molecules/main';
 import Header from 'gatsby-core-theme/src/components/molecules/header';
 import Footer from '../../molecules/footer';
 import LinkMenu from '../../../../components/atoms/link-menu';
+import { isSearchPath } from '~helpers/isSearchPath';
 
 function Body({ pageContext, children, excludeTemplateInPopup = [], hideOperatorBanner = false }) {
   useEffect(() => {
@@ -62,7 +63,8 @@ function Body({ pageContext, children, excludeTemplateInPopup = [], hideOperator
       ? loadable(() => import(`gatsby-core-theme/src/components/atoms/open-graph`))
       : null;
 
-  const isSearch = pageContext.page.path === 's' && true;
+  const isSearch = isSearchPath(pageContext.allMarkets, pageContext.page.path);
+
   const status = pageContext.page.relation?.status;
 
   const hideBanner = status === 'inactive' || status === 'coming_soon';

package/storybook/public/{238.63241167.iframe.bundle.js → 238.6573b754.iframe.bundle.js}

@@ -1 +1 @@
-"use strict";(self.webpackChunkgatsby_matrix_theme=self.webpackChunkgatsby_matrix_theme||[]).push([[238],{"../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:function(){return operator}});var react=__webpack_require__("../node_modules/react/index.js"),prop_types=__webpack_require__("../node_modules/gatsby-core-theme/node_modules/prop-types/index.js"),prop_types_default=__webpack_require__.n(prop_types),lazy_image=__webpack_require__("../node_modules/gatsby-core-theme/src/hooks/lazy-image/index.js"),getters=__webpack_require__("../node_modules/gatsby-core-theme/src/helpers/getters.mjs"),atoms_button=__webpack_require__("../node_modules/gatsby-core-theme/src/components/atoms/button/index.js"),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),operator_module=__webpack_require__("../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/sass-loader/dist/cjs.js!../node_modules/sass-resources-loader/lib/loader.js??ruleSet[1].rules[10].use[3]!../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.module.scss"),options={insert:"head",singleton:!1},autocomplete_operator_module=(injectStylesIntoStyleTag_default()(operator_module.Z,options),operator_module.Z.locals||{}),Operator=function Operator(_ref){var _relation$standardise,_ref$item=_ref.item,item=void 0===_ref$item?{}:_ref$item,relation=item.relation,img=(null==relation||null===(_relation$standardise=relation.standardised_logo_url_object)||void 0===_relation$standardise?void 0:_relation$standardise.filename)||relation.logo_url;return react.createElement("div",{className:autocomplete_operator_module.row||""},react.createElement(lazy_image.Z,{width:56,height:56,src:(0,getters.S7)(img,56,56),alt:item.title}),react.createElement("h3",null,item.title),react.createElement(atoms_button.Z,{to:"/#",primaryColor:!0,isInternalLink:!1,gtmClass:"operator-gtm btn-cta"}))};Operator.displayName="Operator",Operator.propTypes={item:prop_types_default().shape({title:prop_types_default().string,relation:prop_types_default().shape({logo_url:prop_types_default().string})}).isRequired},Operator.__docgenInfo={description:"",methods:[],displayName:"Operator",props:{item:{defaultValue:{value:"{}",computed:!1},description:"",type:{name:"shape",value:{title:{name:"string",required:!1},relation:{name:"shape",value:{logo_url:{name:"string",required:!1}},required:!1}}},required:!1}}};var operator=Operator;"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.js"]={name:"Operator",docgenInfo:Operator.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.js"})},"../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/sass-loader/dist/cjs.js!../node_modules/sass-resources-loader/lib/loader.js??ruleSet[1].rules[10].use[3]!../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.module.scss":function(module,__webpack_exports__,__webpack_require__){var _css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../node_modules/css-loader/dist/runtime/cssWithMappingToString.js"),_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__),_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,".r58fNxDfcLwVDC\\+bB1aHXg\\=\\={display:flex;align-items:center;justify-content:space-between;background-color:#fff;padding:0 1rem;border-top:1px solid #ccc}.r58fNxDfcLwVDC\\+bB1aHXg\\=\\= img{max-width:6.5rem}.r58fNxDfcLwVDC\\+bB1aHXg\\=\\= h3{font-size:1.6rem}","",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_mixins.scss"],names:[],mappings:"AAcA,6BCbE,YAAA,CACA,kBDaoB,CCZpB,6BDY4B,CAC5B,qBAAA,CACA,cAAA,CACA,yBAAA,CACA,iCACE,gBAAA,CAEF,gCACE,gBAAA",sourcesContent:["// Global styles extended in each theme\n\n// Utils\n@import '../../../../styles/utils/variables/typography';\n@import '../../../../styles/utils/variables/layout';\n@import '../../../../styles/utils/variables/stack-order';\n@import '../../../../styles/utils/media-queries';\n@import '../../../../styles/utils/icons';\n@import '../../../../styles/utils/tooltip';\n@import '../../../../styles/utils/loader';\n@import '../../../../styles/utils/mixins';\n@import '../../../../styles/utils/scrollbar';\n@import '../../../../styles/utils/animations';\n\n.row {\n  @include flex-align(center, space-between);\n  background-color: white;\n  padding: 0 1rem;\n  border-top: 1px solid #ccc;\n  img {\n    max-width: 6.5rem;\n  }\n  h3 {\n    font-size: 1.6rem;\n  }\n}\n","@mixin flex-align($align-items, $justify-content) {\n  display: flex;\n  align-items: $align-items;\n  justify-content: $justify-content;\n}\n\n@mixin flex-direction($flex-direction) {\n  display: flex;\n  flex-direction: $flex-direction;\n}\n\n@mixin overflow($overflow-type, $overflow-value, $scrolling) {\n  #{$overflow-type}: $overflow-value;\n  -webkit-overflow-scrolling: $scrolling; // Autoprefixer doesn't add\n}\n\n@mixin text-background($bgcolor, $text-color) {\n  background: $bgcolor;\n  border-radius: 100px;\n  color: $text-color;\n  font-weight: 700;\n  @include flex-align(center, center);\n  padding: 0 2rem;\n}\n\n@mixin link-color($color) {\n  color: $color;\n\n  &:hover {\n    color: $color;\n  }\n}\n\n// Using em because I want images in content to inherit size based on parent element (not root)\n@mixin content-img-float($direction) {\n  float: $direction;\n  @if $direction == right {\n    margin: 0 0 2.4rem 5.6rem;\n  }\n  @else if $direction == left {\n    margin: 0 5.6rem 2.4rem 0;\n  }\n  @else {\n    margin: 0 1em 1em 0;\n  }\n}\n\n@mixin content-img-align($direction: center, $spacing: 1em) {\n  display: block;\n  @if $direction == right {\n    margin: $spacing 0 $spacing auto;\n  } @else if $direction == left {\n    margin: $spacing auto $spacing 0;\n  } @else {\n    margin: $spacing auto;\n  }\n}\n\n@mixin section-arrow-down($color, $width, $height) {\n  position: relative;\n  &:after {\n    top: 100%;\n    left: 50%;\n    border: solid transparent;\n    content: '';\n    height: 0;\n    width: 0;\n    position: absolute;\n    pointer-events: none;\n    border-color: rgba(0, 0, 0, 0);\n    border-top: $height solid $color;\n    border-right: calc($width / 2) solid transparent;\n    border-left: calc($width / 2) solid transparent;\n    margin-left: - calc($width / 2);\n  }\n}\n\n@mixin gradientBtn($color1, $color2, $color3) {\n  background: linear-gradient(to bottom, $color1 0, $color2 14%, $color3 61%);\n  &:hover {\n    background: linear-gradient(to bottom, $color1 0, $color2 14%, $color3 61%);\n  }\n}\n\n@mixin sportBtn($color1, $color2) {\n  background: linear-gradient(to bottom, $color1 0, $color2 100%);\n  &:hover {\n    background: linear-gradient(to bottom, $color2 0, $color1 100%);\n  }\n}\n\n@mixin star($border-color: #ffb400, $fill-color: #ffb400, $width: 16px, $line-height: 2rem) {\n  line-height: $line-height;\n  width: $width;\n  font-weight: normal;\n  display: inline-block;\n  color: $fill-color;\n  font-size: 15px;\n  position: relative;\n  text-shadow: -1px 0 $border-color, 0 1px $border-color, 1px 0 $border-color, 0 -1px $border-color;\n\n  &:last-child {\n    margin-right: 0;\n  }\n  &:before {\n    content: '\\2605';\n  }\n}\n\n@mixin half-star($border-color: #ffb400, $half-empty-color: #ffb400, $half-full-color: white) {\n  line-height: 2rem;\n  width: 16px;\n  font-weight: normal;\n  display: inline-block;\n  color: $half-full-color;\n  font-size: 15px;\n  position: relative;\n  &:before {\n    content: '\\2605';\n  }\n  text-shadow: -1px 0 $border-color, 0 1px $border-color, 1px 0 $border-color, 0 -1px $border-color;\n  &:after {\n    content: '\\2605';\n    color: $half-empty-color;\n    position: absolute;\n    width: 7px;\n    overflow: hidden;\n    bottom: 0;\n    left: 0;\n  }\n}\n\n\n@mixin border-gradient($color-1, $color-2, $bgcolor, $radius: .8rem) {\n  background: $bgcolor;\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    border-radius: $radius;\n    border: 2px solid transparent;\n    background: $color-1, $color-2 border-box;\n    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);\n    -webkit-mask-composite: destination-out;\n    mask-composite: exclude;\n  }\n}\n\n@mixin buttonsColor($color1, $color2, $color3, $textColor: 'white') {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  background-color: $color1;\n  color: $textColor;\n  padding: 0.9rem 3rem;\n  font-weight: 700;\n  font-size: 1.8rem;\n  border-radius: var(--border-radius);\n\n  >svg {\n      flex: none;\n      margin-left: .8rem;\n  }\n\n  &:hover {\n      background-color: $color2;\n      color: $textColor;\n  }\n\n  &:active {\n      background-color: $color3;\n      color: $textColor;\n  }\n}"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={row:"r58fNxDfcLwVDC+bB1aHXg=="},__webpack_exports__.Z=___CSS_LOADER_EXPORT___}}]);
+"use strict";(self.webpackChunkgatsby_matrix_theme=self.webpackChunkgatsby_matrix_theme||[]).push([[238],{"../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:function(){return operator}});var react=__webpack_require__("../node_modules/react/index.js"),prop_types=__webpack_require__("../node_modules/gatsby-core-theme/node_modules/prop-types/index.js"),prop_types_default=__webpack_require__.n(prop_types),lazy_image=__webpack_require__("../node_modules/gatsby-core-theme/src/hooks/lazy-image/index.js"),getters=__webpack_require__("../node_modules/gatsby-core-theme/src/helpers/getters.mjs"),atoms_button=__webpack_require__("../node_modules/gatsby-core-theme/src/components/atoms/button/index.js"),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),operator_module=__webpack_require__("../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/sass-loader/dist/cjs.js!../node_modules/sass-resources-loader/lib/loader.js??ruleSet[1].rules[10].use[3]!../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.module.scss"),options={insert:"head",singleton:!1},autocomplete_operator_module=(injectStylesIntoStyleTag_default()(operator_module.Z,options),operator_module.Z.locals||{}),Operator=function Operator(_ref){var _relation$standardise,_ref$item=_ref.item,item=void 0===_ref$item?{}:_ref$item,relation=item.relation,img=(null==relation||null===(_relation$standardise=relation.standardised_logo_url_object)||void 0===_relation$standardise?void 0:_relation$standardise.filename)||relation.logo_url;return react.createElement("div",{className:autocomplete_operator_module.row||""},react.createElement(lazy_image.Z,{width:56,height:56,src:(0,getters.S7)(img,56,56),alt:item.title}),react.createElement("h3",null,item.title),react.createElement(atoms_button.Z,{to:"/#",primaryColor:!0,isInternalLink:!1,gtmClass:"operator-gtm btn-cta"}))};Operator.displayName="Operator",Operator.propTypes={item:prop_types_default().shape({title:prop_types_default().string,relation:prop_types_default().shape({logo_url:prop_types_default().string})}).isRequired},Operator.__docgenInfo={description:"",methods:[],displayName:"Operator",props:{item:{defaultValue:{value:"{}",computed:!1},description:"",type:{name:"shape",value:{title:{name:"string",required:!1},relation:{name:"shape",value:{logo_url:{name:"string",required:!1}},required:!1}}},required:!1}}};var operator=Operator;"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.js"]={name:"Operator",docgenInfo:Operator.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.js"})},"../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/sass-loader/dist/cjs.js!../node_modules/sass-resources-loader/lib/loader.js??ruleSet[1].rules[10].use[3]!../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.module.scss":function(module,__webpack_exports__,__webpack_require__){var _css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../node_modules/css-loader/dist/runtime/cssWithMappingToString.js"),_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__),_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,".r58fNxDfcLwVDC\\+bB1aHXg\\=\\={display:flex;align-items:center;justify-content:space-between;background-color:#fff;padding:0 1rem;border-top:1px solid #ccc}.r58fNxDfcLwVDC\\+bB1aHXg\\=\\= img{max-width:6.5rem}.r58fNxDfcLwVDC\\+bB1aHXg\\=\\= h3{font-size:1.6rem}","",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/operator.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_mixins.scss"],names:[],mappings:"AAcA,6BCbE,YAAA,CACA,kBDaoB,CCZpB,6BDY4B,CAC5B,qBAAA,CACA,cAAA,CACA,yBAAA,CACA,iCACE,gBAAA,CAEF,gCACE,gBAAA",sourcesContent:["// Global styles extended in each theme\n\n// Utils\n@import '../../../../styles/utils/variables/typography';\n@import '../../../../styles/utils/variables/layout';\n@import '../../../../styles/utils/variables/stack-order';\n@import '../../../../styles/utils/media-queries';\n@import '../../../../styles/utils/icons';\n@import '../../../../styles/utils/tooltip';\n@import '../../../../styles/utils/loader';\n@import '../../../../styles/utils/mixins';\n@import '../../../../styles/utils/scrollbar';\n@import '../../../../styles/utils/animations';\n\n.row {\n  @include flex-align(center, space-between);\n  background-color: white;\n  padding: 0 1rem;\n  border-top: 1px solid #ccc;\n  img {\n    max-width: 6.5rem;\n  }\n  h3 {\n    font-size: 1.6rem;\n  }\n}\n","@mixin flex-align($align-items, $justify-content) {\n  display: flex;\n  align-items: $align-items;\n  justify-content: $justify-content;\n}\n\n@mixin flex-direction($flex-direction) {\n  display: flex;\n  flex-direction: $flex-direction;\n}\n\n@mixin overflow($overflow-type, $overflow-value, $scrolling) {\n  #{$overflow-type}: $overflow-value;\n  -webkit-overflow-scrolling: $scrolling; // Autoprefixer doesn't add\n}\n\n@mixin text-background($bgcolor, $text-color) {\n  background: $bgcolor;\n  border-radius: 100px;\n  color: $text-color;\n  font-weight: 700;\n  @include flex-align(center, center);\n  padding: 0 2rem;\n}\n\n@mixin link-color($color) {\n  color: $color;\n\n  &:hover {\n    color: $color;\n  }\n}\n\n// Using em because I want images in content to inherit size based on parent element (not root)\n@mixin content-img-float($direction) {\n  float: $direction;\n  @if $direction == right {\n    margin: 0 0 2.4rem 4.8rem;\n  }\n  @else if $direction == left {\n    margin: 0 4.8rem 2.4rem 0;\n  }\n  @else {\n    margin: 0 1em 1em 0;\n  }\n}\n\n@mixin content-img-align($direction: center, $spacing: 1em) {\n  display: block;\n  @if $direction == right {\n    margin: $spacing 0 $spacing auto;\n  } @else if $direction == left {\n    margin: $spacing auto $spacing 0;\n  } @else {\n    margin: $spacing auto;\n  }\n}\n\n@mixin section-arrow-down($color, $width, $height) {\n  position: relative;\n  &:after {\n    top: 100%;\n    left: 50%;\n    border: solid transparent;\n    content: '';\n    height: 0;\n    width: 0;\n    position: absolute;\n    pointer-events: none;\n    border-color: rgba(0, 0, 0, 0);\n    border-top: $height solid $color;\n    border-right: calc($width / 2) solid transparent;\n    border-left: calc($width / 2) solid transparent;\n    margin-left: - calc($width / 2);\n  }\n}\n\n@mixin gradientBtn($color1, $color2, $color3) {\n  background: linear-gradient(to bottom, $color1 0, $color2 14%, $color3 61%);\n  &:hover {\n    background: linear-gradient(to bottom, $color1 0, $color2 14%, $color3 61%);\n  }\n}\n\n@mixin sportBtn($color1, $color2) {\n  background: linear-gradient(to bottom, $color1 0, $color2 100%);\n  &:hover {\n    background: linear-gradient(to bottom, $color2 0, $color1 100%);\n  }\n}\n\n@mixin star($border-color: #ffb400, $fill-color: #ffb400, $width: 16px, $line-height: 2rem) {\n  line-height: $line-height;\n  width: $width;\n  font-weight: normal;\n  display: inline-block;\n  color: $fill-color;\n  font-size: 15px;\n  position: relative;\n  text-shadow: -1px 0 $border-color, 0 1px $border-color, 1px 0 $border-color, 0 -1px $border-color;\n\n  &:last-child {\n    margin-right: 0;\n  }\n  &:before {\n    content: '\\2605';\n  }\n}\n\n@mixin half-star($border-color: #ffb400, $half-empty-color: #ffb400, $half-full-color: white) {\n  line-height: 2rem;\n  width: 16px;\n  font-weight: normal;\n  display: inline-block;\n  color: $half-full-color;\n  font-size: 15px;\n  position: relative;\n  &:before {\n    content: '\\2605';\n  }\n  text-shadow: -1px 0 $border-color, 0 1px $border-color, 1px 0 $border-color, 0 -1px $border-color;\n  &:after {\n    content: '\\2605';\n    color: $half-empty-color;\n    position: absolute;\n    width: 7px;\n    overflow: hidden;\n    bottom: 0;\n    left: 0;\n  }\n}\n\n\n@mixin border-gradient($color-1, $color-2, $bgcolor, $radius: .8rem) {\n  background: $bgcolor;\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    border-radius: $radius;\n    border: 2px solid transparent;\n    background: $color-1, $color-2 border-box;\n    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);\n    -webkit-mask-composite: destination-out;\n    mask-composite: exclude;\n  }\n}\n\n@mixin buttonsColor($color1, $color2, $color3, $textColor: 'white') {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  background-color: $color1;\n  color: $textColor;\n  padding: 0.9rem 3rem;\n  font-weight: 700;\n  font-size: 1.8rem;\n  border-radius: var(--border-radius);\n\n  >svg {\n      flex: none;\n      margin-left: .8rem;\n  }\n\n  &:hover {\n      background-color: $color2;\n      color: $textColor;\n  }\n\n  &:active {\n      background-color: $color3;\n      color: $textColor;\n  }\n}"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={row:"r58fNxDfcLwVDC+bB1aHXg=="},__webpack_exports__.Z=___CSS_LOADER_EXPORT___}}]);

package/storybook/public/{343.6a79d1f0.iframe.bundle.js → 343.6342e7dd.iframe.bundle.js}

@@ -1 +1 @@
-"use strict";(self.webpackChunkgatsby_matrix_theme=self.webpackChunkgatsby_matrix_theme||[]).push([[343],{"../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:function(){return game}});var react=__webpack_require__("../node_modules/react/index.js"),prop_types=__webpack_require__("../node_modules/gatsby-core-theme/node_modules/prop-types/index.js"),prop_types_default=__webpack_require__.n(prop_types),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),game_module=__webpack_require__("../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/sass-loader/dist/cjs.js!../node_modules/sass-resources-loader/lib/loader.js??ruleSet[1].rules[10].use[3]!../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.module.scss"),options={insert:"head",singleton:!1},autocomplete_game_module=(injectStylesIntoStyleTag_default()(game_module.Z,options),game_module.Z.locals||{}),Game=function Game(_ref){var _ref$item=_ref.item,item=void 0===_ref$item?{}:_ref$item;return react.createElement("div",{className:autocomplete_game_module.row||""},react.createElement("h3",null,item.title))};Game.displayName="Game",Game.propTypes={item:prop_types_default().shape({title:prop_types_default().string}).isRequired},Game.__docgenInfo={description:"",methods:[],displayName:"Game",props:{item:{defaultValue:{value:"{}",computed:!1},description:"",type:{name:"shape",value:{title:{name:"string",required:!1}}},required:!1}}};var game=Game;"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.js"]={name:"Game",docgenInfo:Game.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.js"})},"../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/sass-loader/dist/cjs.js!../node_modules/sass-resources-loader/lib/loader.js??ruleSet[1].rules[10].use[3]!../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.module.scss":function(module,__webpack_exports__,__webpack_require__){var _css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../node_modules/css-loader/dist/runtime/cssWithMappingToString.js"),_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__),_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,".kFHTXGonUmeUo4L5waNvpw\\=\\={display:flex;align-items:center;justify-content:space-between;background-color:#fff;padding:0 1rem;border-top:1px solid #ccc}.kFHTXGonUmeUo4L5waNvpw\\=\\= h3{font-size:1.6rem}","",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_mixins.scss"],names:[],mappings:"AAcA,4BCbE,YAAA,CACA,kBDaoB,CCZpB,6BDY4B,CAC5B,qBAAA,CACA,cAAA,CACA,yBAAA,CACA,+BACE,gBAAA",sourcesContent:["// Global styles extended in each theme\n\n// Utils\n@import '../../../../styles/utils/variables/typography';\n@import '../../../../styles/utils/variables/layout';\n@import '../../../../styles/utils/variables/stack-order';\n@import '../../../../styles/utils/media-queries';\n@import '../../../../styles/utils/icons';\n@import '../../../../styles/utils/tooltip';\n@import '../../../../styles/utils/loader';\n@import '../../../../styles/utils/mixins';\n@import '../../../../styles/utils/scrollbar';\n@import '../../../../styles/utils/animations';\n\n.row {\n  @include flex-align(center, space-between);\n  background-color: white;\n  padding: 0 1rem;\n  border-top: 1px solid #ccc;\n  h3 {\n    font-size: 1.6rem;\n  }\n}\n","@mixin flex-align($align-items, $justify-content) {\n  display: flex;\n  align-items: $align-items;\n  justify-content: $justify-content;\n}\n\n@mixin flex-direction($flex-direction) {\n  display: flex;\n  flex-direction: $flex-direction;\n}\n\n@mixin overflow($overflow-type, $overflow-value, $scrolling) {\n  #{$overflow-type}: $overflow-value;\n  -webkit-overflow-scrolling: $scrolling; // Autoprefixer doesn't add\n}\n\n@mixin text-background($bgcolor, $text-color) {\n  background: $bgcolor;\n  border-radius: 100px;\n  color: $text-color;\n  font-weight: 700;\n  @include flex-align(center, center);\n  padding: 0 2rem;\n}\n\n@mixin link-color($color) {\n  color: $color;\n\n  &:hover {\n    color: $color;\n  }\n}\n\n// Using em because I want images in content to inherit size based on parent element (not root)\n@mixin content-img-float($direction) {\n  float: $direction;\n  @if $direction == right {\n    margin: 0 0 2.4rem 5.6rem;\n  }\n  @else if $direction == left {\n    margin: 0 5.6rem 2.4rem 0;\n  }\n  @else {\n    margin: 0 1em 1em 0;\n  }\n}\n\n@mixin content-img-align($direction: center, $spacing: 1em) {\n  display: block;\n  @if $direction == right {\n    margin: $spacing 0 $spacing auto;\n  } @else if $direction == left {\n    margin: $spacing auto $spacing 0;\n  } @else {\n    margin: $spacing auto;\n  }\n}\n\n@mixin section-arrow-down($color, $width, $height) {\n  position: relative;\n  &:after {\n    top: 100%;\n    left: 50%;\n    border: solid transparent;\n    content: '';\n    height: 0;\n    width: 0;\n    position: absolute;\n    pointer-events: none;\n    border-color: rgba(0, 0, 0, 0);\n    border-top: $height solid $color;\n    border-right: calc($width / 2) solid transparent;\n    border-left: calc($width / 2) solid transparent;\n    margin-left: - calc($width / 2);\n  }\n}\n\n@mixin gradientBtn($color1, $color2, $color3) {\n  background: linear-gradient(to bottom, $color1 0, $color2 14%, $color3 61%);\n  &:hover {\n    background: linear-gradient(to bottom, $color1 0, $color2 14%, $color3 61%);\n  }\n}\n\n@mixin sportBtn($color1, $color2) {\n  background: linear-gradient(to bottom, $color1 0, $color2 100%);\n  &:hover {\n    background: linear-gradient(to bottom, $color2 0, $color1 100%);\n  }\n}\n\n@mixin star($border-color: #ffb400, $fill-color: #ffb400, $width: 16px, $line-height: 2rem) {\n  line-height: $line-height;\n  width: $width;\n  font-weight: normal;\n  display: inline-block;\n  color: $fill-color;\n  font-size: 15px;\n  position: relative;\n  text-shadow: -1px 0 $border-color, 0 1px $border-color, 1px 0 $border-color, 0 -1px $border-color;\n\n  &:last-child {\n    margin-right: 0;\n  }\n  &:before {\n    content: '\\2605';\n  }\n}\n\n@mixin half-star($border-color: #ffb400, $half-empty-color: #ffb400, $half-full-color: white) {\n  line-height: 2rem;\n  width: 16px;\n  font-weight: normal;\n  display: inline-block;\n  color: $half-full-color;\n  font-size: 15px;\n  position: relative;\n  &:before {\n    content: '\\2605';\n  }\n  text-shadow: -1px 0 $border-color, 0 1px $border-color, 1px 0 $border-color, 0 -1px $border-color;\n  &:after {\n    content: '\\2605';\n    color: $half-empty-color;\n    position: absolute;\n    width: 7px;\n    overflow: hidden;\n    bottom: 0;\n    left: 0;\n  }\n}\n\n\n@mixin border-gradient($color-1, $color-2, $bgcolor, $radius: .8rem) {\n  background: $bgcolor;\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    border-radius: $radius;\n    border: 2px solid transparent;\n    background: $color-1, $color-2 border-box;\n    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);\n    -webkit-mask-composite: destination-out;\n    mask-composite: exclude;\n  }\n}\n\n@mixin buttonsColor($color1, $color2, $color3, $textColor: 'white') {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  background-color: $color1;\n  color: $textColor;\n  padding: 0.9rem 3rem;\n  font-weight: 700;\n  font-size: 1.8rem;\n  border-radius: var(--border-radius);\n\n  >svg {\n      flex: none;\n      margin-left: .8rem;\n  }\n\n  &:hover {\n      background-color: $color2;\n      color: $textColor;\n  }\n\n  &:active {\n      background-color: $color3;\n      color: $textColor;\n  }\n}"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={row:"kFHTXGonUmeUo4L5waNvpw=="},__webpack_exports__.Z=___CSS_LOADER_EXPORT___}}]);
+"use strict";(self.webpackChunkgatsby_matrix_theme=self.webpackChunkgatsby_matrix_theme||[]).push([[343],{"../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:function(){return game}});var react=__webpack_require__("../node_modules/react/index.js"),prop_types=__webpack_require__("../node_modules/gatsby-core-theme/node_modules/prop-types/index.js"),prop_types_default=__webpack_require__.n(prop_types),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),game_module=__webpack_require__("../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/sass-loader/dist/cjs.js!../node_modules/sass-resources-loader/lib/loader.js??ruleSet[1].rules[10].use[3]!../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.module.scss"),options={insert:"head",singleton:!1},autocomplete_game_module=(injectStylesIntoStyleTag_default()(game_module.Z,options),game_module.Z.locals||{}),Game=function Game(_ref){var _ref$item=_ref.item,item=void 0===_ref$item?{}:_ref$item;return react.createElement("div",{className:autocomplete_game_module.row||""},react.createElement("h3",null,item.title))};Game.displayName="Game",Game.propTypes={item:prop_types_default().shape({title:prop_types_default().string}).isRequired},Game.__docgenInfo={description:"",methods:[],displayName:"Game",props:{item:{defaultValue:{value:"{}",computed:!1},description:"",type:{name:"shape",value:{title:{name:"string",required:!1}}},required:!1}}};var game=Game;"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.js"]={name:"Game",docgenInfo:Game.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.js"})},"../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/sass-loader/dist/cjs.js!../node_modules/sass-resources-loader/lib/loader.js??ruleSet[1].rules[10].use[3]!../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.module.scss":function(module,__webpack_exports__,__webpack_require__){var _css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../node_modules/css-loader/dist/runtime/cssWithMappingToString.js"),_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__),_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,".kFHTXGonUmeUo4L5waNvpw\\=\\={display:flex;align-items:center;justify-content:space-between;background-color:#fff;padding:0 1rem;border-top:1px solid #ccc}.kFHTXGonUmeUo4L5waNvpw\\=\\= h3{font-size:1.6rem}","",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/atoms/search/autocomplete/game.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_mixins.scss"],names:[],mappings:"AAcA,4BCbE,YAAA,CACA,kBDaoB,CCZpB,6BDY4B,CAC5B,qBAAA,CACA,cAAA,CACA,yBAAA,CACA,+BACE,gBAAA",sourcesContent:["// Global styles extended in each theme\n\n// Utils\n@import '../../../../styles/utils/variables/typography';\n@import '../../../../styles/utils/variables/layout';\n@import '../../../../styles/utils/variables/stack-order';\n@import '../../../../styles/utils/media-queries';\n@import '../../../../styles/utils/icons';\n@import '../../../../styles/utils/tooltip';\n@import '../../../../styles/utils/loader';\n@import '../../../../styles/utils/mixins';\n@import '../../../../styles/utils/scrollbar';\n@import '../../../../styles/utils/animations';\n\n.row {\n  @include flex-align(center, space-between);\n  background-color: white;\n  padding: 0 1rem;\n  border-top: 1px solid #ccc;\n  h3 {\n    font-size: 1.6rem;\n  }\n}\n","@mixin flex-align($align-items, $justify-content) {\n  display: flex;\n  align-items: $align-items;\n  justify-content: $justify-content;\n}\n\n@mixin flex-direction($flex-direction) {\n  display: flex;\n  flex-direction: $flex-direction;\n}\n\n@mixin overflow($overflow-type, $overflow-value, $scrolling) {\n  #{$overflow-type}: $overflow-value;\n  -webkit-overflow-scrolling: $scrolling; // Autoprefixer doesn't add\n}\n\n@mixin text-background($bgcolor, $text-color) {\n  background: $bgcolor;\n  border-radius: 100px;\n  color: $text-color;\n  font-weight: 700;\n  @include flex-align(center, center);\n  padding: 0 2rem;\n}\n\n@mixin link-color($color) {\n  color: $color;\n\n  &:hover {\n    color: $color;\n  }\n}\n\n// Using em because I want images in content to inherit size based on parent element (not root)\n@mixin content-img-float($direction) {\n  float: $direction;\n  @if $direction == right {\n    margin: 0 0 2.4rem 4.8rem;\n  }\n  @else if $direction == left {\n    margin: 0 4.8rem 2.4rem 0;\n  }\n  @else {\n    margin: 0 1em 1em 0;\n  }\n}\n\n@mixin content-img-align($direction: center, $spacing: 1em) {\n  display: block;\n  @if $direction == right {\n    margin: $spacing 0 $spacing auto;\n  } @else if $direction == left {\n    margin: $spacing auto $spacing 0;\n  } @else {\n    margin: $spacing auto;\n  }\n}\n\n@mixin section-arrow-down($color, $width, $height) {\n  position: relative;\n  &:after {\n    top: 100%;\n    left: 50%;\n    border: solid transparent;\n    content: '';\n    height: 0;\n    width: 0;\n    position: absolute;\n    pointer-events: none;\n    border-color: rgba(0, 0, 0, 0);\n    border-top: $height solid $color;\n    border-right: calc($width / 2) solid transparent;\n    border-left: calc($width / 2) solid transparent;\n    margin-left: - calc($width / 2);\n  }\n}\n\n@mixin gradientBtn($color1, $color2, $color3) {\n  background: linear-gradient(to bottom, $color1 0, $color2 14%, $color3 61%);\n  &:hover {\n    background: linear-gradient(to bottom, $color1 0, $color2 14%, $color3 61%);\n  }\n}\n\n@mixin sportBtn($color1, $color2) {\n  background: linear-gradient(to bottom, $color1 0, $color2 100%);\n  &:hover {\n    background: linear-gradient(to bottom, $color2 0, $color1 100%);\n  }\n}\n\n@mixin star($border-color: #ffb400, $fill-color: #ffb400, $width: 16px, $line-height: 2rem) {\n  line-height: $line-height;\n  width: $width;\n  font-weight: normal;\n  display: inline-block;\n  color: $fill-color;\n  font-size: 15px;\n  position: relative;\n  text-shadow: -1px 0 $border-color, 0 1px $border-color, 1px 0 $border-color, 0 -1px $border-color;\n\n  &:last-child {\n    margin-right: 0;\n  }\n  &:before {\n    content: '\\2605';\n  }\n}\n\n@mixin half-star($border-color: #ffb400, $half-empty-color: #ffb400, $half-full-color: white) {\n  line-height: 2rem;\n  width: 16px;\n  font-weight: normal;\n  display: inline-block;\n  color: $half-full-color;\n  font-size: 15px;\n  position: relative;\n  &:before {\n    content: '\\2605';\n  }\n  text-shadow: -1px 0 $border-color, 0 1px $border-color, 1px 0 $border-color, 0 -1px $border-color;\n  &:after {\n    content: '\\2605';\n    color: $half-empty-color;\n    position: absolute;\n    width: 7px;\n    overflow: hidden;\n    bottom: 0;\n    left: 0;\n  }\n}\n\n\n@mixin border-gradient($color-1, $color-2, $bgcolor, $radius: .8rem) {\n  background: $bgcolor;\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    border-radius: $radius;\n    border: 2px solid transparent;\n    background: $color-1, $color-2 border-box;\n    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);\n    -webkit-mask-composite: destination-out;\n    mask-composite: exclude;\n  }\n}\n\n@mixin buttonsColor($color1, $color2, $color3, $textColor: 'white') {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  background-color: $color1;\n  color: $textColor;\n  padding: 0.9rem 3rem;\n  font-weight: 700;\n  font-size: 1.8rem;\n  border-radius: var(--border-radius);\n\n  >svg {\n      flex: none;\n      margin-left: .8rem;\n  }\n\n  &:hover {\n      background-color: $color2;\n      color: $textColor;\n  }\n\n  &:active {\n      background-color: $color3;\n      color: $textColor;\n  }\n}"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={row:"kFHTXGonUmeUo4L5waNvpw=="},__webpack_exports__.Z=___CSS_LOADER_EXPORT___}}]);