gatsby-matrix-theme 7.1.18 → 7.1.21

package/CHANGELOG.md

@@ -1,3 +1,47 @@
+## [7.1.21](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v7.1.20...v7.1.21) (2022-06-14)
+
+
+### Bug Fixes
+
+* demo deploy pipeline ([b548277](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/b548277b1ce704015b4205613ea276c641cb30a0))
+* returning fragment instead of null ([f3ee440](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/f3ee44010caa9c7d448e5a0d9c11946c648a9d89))
+* toplist styling ([ffabfde](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/ffabfde564aaa92b8cc9983ced06a3337107f00c))
+
+
+* Merge branch 'tm-2867-module-titles' into 'master' ([fe6ad60](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/fe6ad602a632da849915da25e482964f24fd7e00))
+* Merge branch 'master' of git.ilcd.rocks:team-floyd/themes/matrix-theme ([a299045](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/a299045c840765c313e56072705924d6467d5126))
+
+## [7.1.20](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v7.1.19...v7.1.20) (2022-06-09)
+
+
+### Code Refactoring
+
+* remove bonus component override ([8525cd7](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/8525cd7f44490b3d77f8f073e22da713fe2ffa9e))
+* update bonus split by and fe separators ([c7f0897](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/c7f0897f4d7ab81bb60df5f9e47288ba0ac00103))
+
+
+### Config
+
+* update core theme version ([752355f](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/752355f60c0e461ff11a6e4a8ae9cf9a8ab8ee3c))
+
+
+* Merge branch 'tm-2869-toplist-icon-and-bonus-separator' into 'master' ([f817c1a](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/f817c1a39c74d68e33d2f3b162326c4b3ca9c21f))
+
+## [7.1.19](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v7.1.18...v7.1.19) (2022-06-08)
+
+
+### Code Refactoring
+
+* remove changefreq, priority and add lastmod ([b845065](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/b845065d0b3e25e6a1d7b03a3f8e2126188533d3))
+
+
+### Config
+
+* update gatsby theme ([4cb67a5](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/4cb67a55732ba93b9ea7e6d77228801490e64139))
+
+
+* Merge branch 'origin/tm-2816-sitemap-changes-matrix' into 'master' ([bd9377c](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/bd9377c0742f964adcb4444f163018a8a3a21c9c))
+
 ## [7.1.18](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v7.1.17...v7.1.18) (2022-06-03)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-matrix-theme",
-  "version": "7.1.18",
+  "version": "7.1.21",
   "main": "index.js",
   "description": "Matrix Theme NPM Package",
   "author": "",
@@ -29,7 +29,7 @@
     "react": "^17.0.2",
     "gatsby-plugin-sitemap": "^3.3.0",
     "react-dom": "^17.0.2",
-    "gatsby-core-theme": "^7.0.9"
+    "gatsby-core-theme": "^7.0.11"
   },
   "devDependencies": {
     "@babel/core": "^7.13.1",

package/src/components/molecules/toplist/row/variant-one.js

@@ -122,11 +122,6 @@ export default function Row({
         } ${hasRibbon ? styles.withRibbon : ''}`}
       >
         <Bonus item={item} tracker={oneliner} />
-        {showLaunchDate && (
-          <span>
-            {translate(translations, 'launch_date', 'Launch Date')}: {launchDate}
-          </span>
-        )}
       </a>
       <SellingPoints icon={<MdCheck />} sellingPoints={sellingPoints} limit={3} />
 

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

@@ -132,22 +132,6 @@
       padding: 0;
     }
 
-    span {
-      font-weight: 700;
-      font-size: 16px;
-      line-height: 23px;
-      color: #150e06;
-      display: none;
-
-      @include min(tablet) {
-        display: block;
-      }
-
-      @include min(laptop) {
-        display: none;
-      }
-    }
-
     &.withRibbon {
       @include min(tablet) {
         padding-top: 2rem !important;
@@ -202,6 +186,18 @@
     }
   }
 
+  .launchDateBonus {
+    font-weight: 700;
+    font-size: 16px;
+    line-height: 23px;
+    color: #150e06;
+    display: none;
+
+    @include min(tablet) {
+      display: block;
+    }
+  }
+
   > ul,
   .launchDate {
     @include flex-align(center, center);

package/src/helpers/sitemap.js

@@ -15,8 +15,7 @@ const getSitemap = (site, allSitePage) =>
       }
       return {
         url: site.siteMetadata.siteUrl + edge.path,
-        changefreq: `daily`,
-        priority: 0.7,
+        lastmod: edge.pageContext.page.updated_at,
       };
     })
     .filter((edge) => edge);

package/src/hooks/tabs/index.js

@@ -107,7 +107,7 @@ const Tabs = ({
       <div className={tabHeaderClass}>
         <div className={styles.titleAndTab}>
           {module.name === 'top_list' && getTitle(module)}
-          {TabList && (
+          {TabList ? (
             <TabList
               siteName={siteName}
               title={title}
@@ -120,6 +120,8 @@ const Tabs = ({
               module={module}
               gtmClass={gtmClass}
             />
+          ) : (
+            <></>
           )}
         </div>
         {module.module_introduction && (

package/storybook/public/331.fb509b74.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkgatsby_matrix_theme=self.webpackChunkgatsby_matrix_theme||[]).push([[331,720],{"../node_modules/gatsby-core-theme/src/components/atoms/label/index.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.d(__webpack_exports__,{Z:function(){return label}});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),label_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/label/label.module.scss"),options={insert:"head",singleton:!1},label_label_module=(injectStylesIntoStyleTag_default()(label_module.Z,options),label_module.Z.locals||{}),Label=function Label(_ref){var _ref$title=_ref.title,title=void 0===_ref$title?"":_ref$title,_ref$bgColor=_ref.bgColor,bgColor=void 0===_ref$bgColor?"yellow":_ref$bgColor;return react.createElement("span",{className:label_label_module.label,style:{backgroundColor:bgColor}},title)};Label.displayName="Label",Label.propTypes={title:prop_types_default().string,bgColor:prop_types_default().string},Label.__docgenInfo={description:"",methods:[],displayName:"Label",props:{title:{defaultValue:{value:"''",computed:!1},type:{name:"string"},required:!1,description:""},bgColor:{defaultValue:{value:"'yellow'",computed:!1},type:{name:"string"},required:!1,description:""}}};var label=Label;"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/atoms/label/index.js"]={name:"Label",docgenInfo:Label.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/atoms/label/index.js"})},"../node_modules/gatsby-core-theme/src/components/atoms/selling-points/index.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.d(__webpack_exports__,{Z:function(){return selling_points}});__webpack_require__("../node_modules/core-js/modules/es.array.map.js"),__webpack_require__("../node_modules/core-js/modules/es.array.slice.js");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),keygen=__webpack_require__("../node_modules/gatsby-core-theme/src/helpers/keygen.js"),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),selling_points_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/selling-points/selling-points.module.scss"),options={insert:"head",singleton:!1},selling_points_selling_points_module=(injectStylesIntoStyleTag_default()(selling_points_module.Z,options),selling_points_module.Z.locals||{}),SellingPoints=function SellingPoints(_ref){var sellingPoints=_ref.sellingPoints,icon=_ref.icon,_ref$limit=_ref.limit,limit=void 0===_ref$limit?3:_ref$limit;return sellingPoints&&0!==sellingPoints.length?react.createElement("ul",{className:selling_points_selling_points_module.sellingPoint},sellingPoints.slice(0,limit).map((function(item){return react.createElement("li",{className:"".concat(!icon&&selling_points_selling_points_module.tick),key:(0,keygen.Z)()},null!==icon&&icon,item)}))):react.createElement(react.Fragment,null)};SellingPoints.displayName="SellingPoints",SellingPoints.propTypes={sellingPoints:prop_types_default().arrayOf(prop_types_default().string),icon:prop_types_default().element,limit:prop_types_default().number},SellingPoints.__docgenInfo={description:"",methods:[],displayName:"SellingPoints",props:{limit:{defaultValue:{value:"3",computed:!1},type:{name:"number"},required:!1,description:""},sellingPoints:{type:{name:"arrayOf",value:{name:"string"}},required:!1,description:""},icon:{type:{name:"element"},required:!1,description:""}}};var selling_points=SellingPoints;"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/atoms/selling-points/index.js"]={name:"SellingPoints",docgenInfo:SellingPoints.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/atoms/selling-points/index.js"})},"../node_modules/gatsby-core-theme/src/components/molecules/star-rating/one-star.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:function(){return one_star}});__webpack_require__("../node_modules/core-js/modules/es.array.concat.js");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),TranslationsProvider=__webpack_require__("../node_modules/gatsby-core-theme/src/context/TranslationsProvider.js"),helpers_rating=__webpack_require__("../node_modules/gatsby-core-theme/src/helpers/rating.js"),getters=__webpack_require__("../node_modules/gatsby-core-theme/src/helpers/getters.js"),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),one_star_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/molecules/star-rating/one-star.module.scss"),options={insert:"head",singleton:!1},star_rating_one_star_module=(injectStylesIntoStyleTag_default()(one_star_module.Z,options),one_star_module.Z.locals||{}),OneStar=function OneStar(_ref){var numOfStars=_ref.numOfStars,rating=_ref.rating,_ref$active=_ref.active,active=void 0===_ref$active||_ref$active,_ref$showLabel=_ref.showLabel,showLabel=void 0!==_ref$showLabel&&_ref$showLabel,translations=((0,react.useContext)(TranslationsProvider._)||{}).translations;return react.createElement("div",{className:"".concat(star_rating_one_star_module.starRatingContainer," ").concat(!active&&star_rating_one_star_module.inactive)},showLabel&&react.createElement("span",{className:star_rating_one_star_module.text},(0,getters.Iu)(translations,"rating","Rating")),react.createElement("span",{className:star_rating_one_star_module.fullStar}),react.createElement("span",{className:star_rating_one_star_module.text},"".concat((0,helpers_rating.h)(rating),"/").concat(numOfStars)))};OneStar.displayName="OneStar",OneStar.propTypes={numOfStars:prop_types_default().oneOf([5,10]).isRequired,rating:prop_types_default().oneOfType([prop_types_default().array,prop_types_default().number,prop_types_default().string]).isRequired,active:prop_types_default().bool,showLabel:prop_types_default().bool},OneStar.__docgenInfo={description:"",methods:[],displayName:"OneStar",props:{active:{defaultValue:{value:"true",computed:!1},type:{name:"bool"},required:!1,description:""},showLabel:{defaultValue:{value:"false",computed:!1},type:{name:"bool"},required:!1,description:""},numOfStars:{type:{name:"enum",value:[{value:"5",computed:!1},{value:"10",computed:!1}]},required:!0,description:""},rating:{type:{name:"union",value:[{name:"array"},{name:"number"},{name:"string"}]},required:!0,description:""}}};var one_star=OneStar;"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/molecules/star-rating/one-star.js"]={name:"OneStar",docgenInfo:OneStar.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/molecules/star-rating/one-star.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/label/label.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,".XqK4sBymDHbEPbGfTSicPw\\=\\={padding:.5rem 1rem;font-size:1.4rem;color:#000}","",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/atoms/label/label.module.scss"],names:[],mappings:"AAcA,4BACE,kBAAA,CACA,gBAAA,CACA,UAAA",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.label {\n  padding: 0.5rem 1rem;\n  font-size: 1.4rem;\n  color: black;\n}\n"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={label:"XqK4sBymDHbEPbGfTSicPw=="},__webpack_exports__.Z=___CSS_LOADER_EXPORT___},"../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/selling-points/selling-points.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,'.w\\+VAxfOX00vjUBAsnXPtYw\\=\\={display:flex;align-items:center;justify-content:flex-start;flex-direction:column}.w\\+VAxfOX00vjUBAsnXPtYw\\=\\= li{display:flex;align-items:center;justify-content:flex-start;font-size:1.4rem;width:100%}.w\\+VAxfOX00vjUBAsnXPtYw\\=\\= li.EamexPE9zTDrr6gD-ssbMw\\=\\={position:relative;margin-left:2rem}.w\\+VAxfOX00vjUBAsnXPtYw\\=\\= li.EamexPE9zTDrr6gD-ssbMw\\=\\=::before{content:"";border:solid var(--selling-point-icon-color);border-width:0 .5rem .5rem 0;padding:.5rem;transform:rotate(45deg);position:absolute;padding:0px 0px .8rem .32rem;border-right-width:.18rem;border-bottom-width:.18rem;left:-1.8rem}@media only screen and (max-width:767px){.w\\+VAxfOX00vjUBAsnXPtYw\\=\\={width:90%;margin:0 auto;padding:1rem 0}}',"",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/atoms/selling-points/selling-points.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_mixins.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_icons.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_media-queries.scss"],names:[],mappings:"AAcA,6BCbE,YAAA,CACA,kBDaoB,CCZpB,0BDY4B,CAC5B,qBAAA,CAEA,gCCjBA,YAAA,CACA,kBDiBsB,CChBtB,0BDgB8B,CAC5B,gBAAA,CACA,UAAA,CAEA,2DACE,iBAAA,CACA,gBAAA,CACA,mEEzBJ,UAAA,CAaE,4CAAA,CACA,4BAAA,CACA,aAHQ,CAwBR,uBARW,CFDP,iBAAA,CACA,4BAAA,CACA,yBAAA,CACA,0BAAA,CACA,YAAA,CG2BN,yCH7CF,6BAwBI,SAAA,CACA,aAAA,CACA,cAAA,CAAA",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.sellingPoint {\n  @include flex-align(center, flex-start);\n  flex-direction: column;\n\n  li {\n    @include flex-align(center, flex-start);\n    font-size: 1.4rem;\n    width: 100%;\n\n    &.tick {\n      position: relative;\n      margin-left: 2rem;\n      &::before {\n        @include arrow(var(--selling-point-icon-color), 1.5rem, down, false);\n        position: absolute;        \n        padding: 0px 0px .8rem .32rem;\n        border-right-width: .18rem;\n        border-bottom-width: .18rem;\n        left: -1.8rem;\n      }\n    }\n  }\n\n  @include max(mobile) {\n    width: 90%;\n    margin: 0 auto;\n    padding: 1rem 0;\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 1em 1em;\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","@mixin arrow($color, $size, $orientation, $solid: true, $transform: '') {\n  content: '';\n\n  $rotation_right: 90deg;\n  $rotation_down: 180deg;\n  $rotation_left: -90deg;\n  $rotation: rotate(-135deg);\n\n  @if ($solid) {\n    border-left: $size solid transparent;\n    border-right: $size solid transparent;\n    border-bottom: $size solid $color;\n  } @else {\n    $size:  calc($size/3);\n    border: solid $color;\n    border-width: 0 $size $size 0;\n    padding: $size;\n  }\n\n  $rotation_right: -45deg;\n  $rotation_down: 45deg;\n  $rotation_left: 135deg;\n\n  @if ($orientation == up) {\n    bottom: 100%;\n    left: calc(50% - #{$size});\n  } @else if ($orientation == right) {\n    $rotation: rotate($rotation_right);\n  } @else if ($orientation == down) {\n    $rotation: rotate($rotation_down);\n  } @else if ($orientation == left) {\n    $rotation: rotate($rotation_left);\n  }\n\n  @if ($transform != '') {\n    transform: $transform $rotation;\n  } @else {\n    transform: $rotation;\n  }\n}\n\n@mixin circle($color, $size) {\n  content: '';\n  width: $size;\n  height: $size;\n  background: $color;\n  border-radius: 50%;\n}\n\n@mixin circle-bordered($color, $size, $border-width, $border-color) {\n  @include circle($color, $size);\n  border: $border-width solid $border-color;\n}\n\n@mixin iframe-play($color, $bg-color) {\n  &:before {\n    @include arrow($color, 1rem, right, true);\n    border-bottom-width: 2rem;\n    z-index: 1;\n  }\n\n  &:after {\n    @include circle-bordered($bg-color, 8rem, 1rem, transparentize($bg-color, 0.2));\n  }\n\n  &:before,\n  &:after {\n    cursor: pointer;\n    transition: all 0.25s linear;\n  }\n\n  &:hover,\n  &:focus {\n    &:before {\n      border-bottom: 2rem solid $bg-color;\n    }\n\n    &:after {\n      border-color: transparentize($color, 0.2);\n      background-color: $color;\n    }\n  }\n}\n\n@mixin close($size, $thickness, $color) {\n  & {\n    display: inline-block;\n    width: $size;\n    height: $size;\n  }\n\n  &:before,\n  &:after {\n    content: '';\n    display: block;\n    width: 140%;\n    height: $thickness;\n    background: $color;\n    border-radius: 0.1rem;\n  }\n\n  &:before {\n    transform: rotate(45deg);\n    transform-origin: 0 0;\n    margin: - calc($thickness / 4) 0 0 calc($thickness / 2);\n  }\n\n  &:after {\n    transform: rotate(-45deg);\n    transform-origin: 100% 0;\n    margin: -$thickness 0 0 -45%;\n  }\n}\n\n@mixin nav-icon($size, $color, $thickness: 5px, $translate: 12px) {\n  width: $size;\n\n  &:before,\n  &:after,\n  div {\n    background-color: $color;\n    border-radius: 3px;\n    content: '';\n    display: block;\n    height: $thickness;\n    margin: 7px 0;\n    transition: all 0.2s ease-in-out;\n  }\n\n  &:before {\n    margin: 0;\n  }\n\n  &:after {\n    width: 50%;\n    margin: 0 0 0 auto;\n  }\n\n  &.active {\n    &:before {\n      transform: translateY($translate) rotate(135deg);\n    }\n\n    &:after {\n      margin: 7px 0;\n      width: auto;\n      transform: translateY(-$translate) rotate(-135deg);\n    }\n\n    div {\n      transform: scale(0);\n    }\n  }\n}\n\n@mixin nav-icon-2($size, $color, $thickness: 5px, $translate: 12px) {\n  width: $size;\n\n  &:before,\n  &:after,\n  div {\n    background-color: $color;\n    border-radius: 1px;\n    content: '';\n    display: block;\n    height: $thickness;\n    margin: 4px 0;\n    transition: all 0.2s ease-in-out;\n    width: 100%;\n  }\n\n  &:before {\n    margin: 0;\n  }\n\n  &:after {\n    margin: 0 0 0 auto;\n  }\n\n  &.active {\n    &:before {\n      transform: translateY($translate) rotate(135deg);\n    }\n\n    &:after {\n      margin: 10px 0;\n      width: auto;\n      transform: translateY(-$translate) rotate(-135deg);\n    }\n\n    div {\n      transform: scale(0);\n    }\n  }\n}\n\n","$media-query-sizes: (\n  mobile-s: (\n    min: 320px,\n    max: 374px,\n  ),\n  mobile-m: (\n    min: 375px,\n    max: 424px,\n  ),\n  mobile: (\n    min: 425px,\n    max: 767px,\n  ),\n  tablet: (\n    min: 768px,\n    max: 991px,\n  ),\n  laptop: (\n    min: 992px,\n    max: 1199px,\n  ),\n  desktop: (\n    min: 1200px,\n  ),\n);\n\n// Get media query sizes\n$screen: 'only screen';\n@function media-query($media, $optional-media: '', $min: true) {\n  $media-label: '';\n\n  @if ($optional-media != '') {\n    $media-sizes-min: map-get($media-query-sizes, $media);\n    $media-sizes-max: map-get($media-query-sizes, $optional-media);\n    $media-label: $screen +\n      \" and (min-width:#{map-get($media-sizes-min, 'min')}) and (max-width:#{map-get($media-sizes-max, 'max')})\";\n  } @else {\n    $query: 'max';\n\n    @if ($min) {\n      $query: 'min';\n    }\n\n    $media-sizes: map-get($media-query-sizes, $media);\n    $media-label: $screen + ' and (#{$query}-width:#{map-get($media-sizes, $query)})';\n  }\n\n  @return $media-label;\n}\n\n// Min media query\n@mixin min($media) {\n  @media #{media-query($media)} {\n    @content;\n  }\n}\n\n// Max media query\n@mixin max($media) {\n  @media #{media-query($media, '', false)} {\n    @content;\n  }\n}\n\n// Min & max media query\n@mixin min-max($min, $max) {\n  @media #{media-query($min, $max)} {\n    @content;\n  }\n}\n\n// Use this ONLY if you need a media query that doesn't fit the $media-query-sizes breakpoints above\n// Pass number, for example @include custom-min(992)\n@mixin custom-min($min) {\n  @media #{$screen} and (min-width: #{$min}px) {\n    @content;\n  }\n}\n\n@mixin custom-max($max) {\n  @media #{$screen} and (max-width: #{$max}px) {\n    @content;\n  }\n}\n\n@mixin custom-min-max($min, $max) {\n  @media #{$screen} and (min-width: #{$min}px) and (max-width: #{$max}px) {\n    @content;\n  }\n}\n\n// Landscape\n// (If we find more use cases of this in the future, might want to refactor this and include it in the media-query function for $screen)\n// Pass number\n$landscape: 'screen and (orientation:landscape)';\n\n@mixin landscape-max($max) {\n  @media #{$landscape} and (max-width: #{$max}px) {\n    @content;\n  }\n}\n\n@mixin landscape-min($min) {\n  @media #{$landscape} and (min-width: #{$min}px) {\n    @content;\n  }\n}\n\n// Hover\n// that allows you only to apply styles on devices with hover capability\n@mixin hover-device() {\n  @media (hover: hover) {\n    &:hover {\n      @content;\n    }\n  }\n}\n"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={sellingPoint:"w+VAxfOX00vjUBAsnXPtYw==",tick:"EamexPE9zTDrr6gD-ssbMw=="},__webpack_exports__.Z=___CSS_LOADER_EXPORT___},"../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/molecules/star-rating/one-star.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,'.JoS6KxVHU7Kizie4Z1SJ4g\\=\\={display:flex;flex-direction:row;justify-content:center;background-color:#fff;min-width:6.5rem;min-height:2.1rem;line-height:2.1rem;border-radius:.4rem;border:1px solid var(--main-star-wrapper-color)}.JoS6KxVHU7Kizie4Z1SJ4g\\=\\=.QTwZN7qLPrXj69yYBiZtYw\\=\\= .HVgdYljusWXcaLbayUiciQ\\=\\={line-height:2.1rem;width:unset;font-weight:normal;display:inline-block;color:var(--empty-star-border-color);font-size:15px;position:relative;text-shadow:-1px 0 var(--empty-star-border-color),0 1px var(--empty-star-border-color),1px 0 var(--empty-star-border-color),0 -1px var(--empty-star-border-color)}.JoS6KxVHU7Kizie4Z1SJ4g\\=\\=.QTwZN7qLPrXj69yYBiZtYw\\=\\= .HVgdYljusWXcaLbayUiciQ\\=\\=:last-child{margin-right:0}.JoS6KxVHU7Kizie4Z1SJ4g\\=\\=.QTwZN7qLPrXj69yYBiZtYw\\=\\= .HVgdYljusWXcaLbayUiciQ\\=\\=:before{content:"★"}.HVgdYljusWXcaLbayUiciQ\\=\\={line-height:2.1rem;width:unset;font-weight:normal;display:inline-block;color:var(--full-star-border-color);font-size:15px;position:relative;text-shadow:-1px 0 var(--full-star-fill-color),0 1px var(--full-star-fill-color),1px 0 var(--full-star-fill-color),0 -1px var(--full-star-fill-color)}.HVgdYljusWXcaLbayUiciQ\\=\\=:last-child{margin-right:0}.HVgdYljusWXcaLbayUiciQ\\=\\=:before{content:"★"}.PTVF-Ql4UdHbgeKbYwTQhw\\=\\={color:#17182f;font-weight:700;font-size:1.3rem;margin:0 .33rem;line-height:2.1rem}',"",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/molecules/star-rating/one-star.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_mixins.scss"],names:[],mappings:"AAAA,4BAcA,YCPE,CAAA,kBDQwB,CAAA,sBACxB,CAAA,qBACA,CAAA,gBACA,CAAA,iBACA,CAAA,kBACA,CAAA,mBACA,CAAA,+CACA,CAAA,mFAGE,kBACuF,CAAA,WAAP,CAAA,kBCgElF,CAAA,oBACA,CAAA,oCDjEkD,CAAA,cCmElD,CAAA,iBACA,CAAA,iKACA,CAAA,8FAEA,cACE,CAAA,0FAEF,WACE,CAAA,4BDtEJ,kBACmF,CAAA,WAAP,CAAA,kBC0D1E,CAAA,oBACA,CAAA,mCD3D2C,CAAA,cC6D3C,CAAA,iBACA,CAAA,qJACA,CAAA,uCAEA,cACE,CAAA,mCAEF,WACE,CAAA,4BDlEJ,aACE,CAAA,eACA,CAAA,gBACA,CAAA,eACA,CAAA,kBACA",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.starRatingContainer {\n  @include flex-direction(row);\n  justify-content: center;\n  background-color: #ffffff;\n  min-width: 6.5rem;\n  min-height: 2.1rem;\n  line-height: 2.1rem;\n  border-radius: 0.4rem;\n  border: 1px solid var(--main-star-wrapper-color);\n  \n  &.inactive {\n    .fullStar {\n      @include star(var(--empty-star-border-color), var(--empty-star-border-color), unset, 2.1rem);\n    }\n  }\n}\n\n.fullStar {\n  @include star(var(--full-star-fill-color), var(--full-star-border-color), unset, 2.1rem);\n}\n\n.text {\n  color: #17182f;\n  font-weight: 700;\n  font-size: 1.3rem;\n  margin: 0 0.33rem;\n  line-height: 2.1rem;\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 1em 1em;\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"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={starRatingContainer:"JoS6KxVHU7Kizie4Z1SJ4g==",inactive:"QTwZN7qLPrXj69yYBiZtYw==",fullStar:"HVgdYljusWXcaLbayUiciQ==",text:"PTVF-Ql4UdHbgeKbYwTQhw=="},__webpack_exports__.Z=___CSS_LOADER_EXPORT___}}]);