gatsby-matrix-theme 15.0.1 → 16.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/package.json +1 -1
  3. package/src/components/atoms/footer/as-seen-on/index.js +2 -0
  4. package/src/components/atoms/footer/hotline/hotline.module.scss +3 -6
  5. package/src/components/atoms/footer/hotline/index.js +6 -2
  6. package/src/components/atoms/footer/license/index.js +2 -2
  7. package/src/components/molecules/footer/variants/template-three/index.js +6 -1
  8. package/src/gatsby-core-theme/components/molecules/header/index.js +2 -2
  9. package/storybook/public/427.cbe8926b.iframe.bundle.js +1 -0
  10. package/storybook/public/iframe.html +1 -1
  11. package/storybook/public/{main.3a1b3323.iframe.bundle.js → main.0f3b711c.iframe.bundle.js} +1 -1
  12. package/storybook/public/{runtime~main.36464b90.iframe.bundle.js → runtime~main.a56bb23f.iframe.bundle.js} +1 -1
  13. package/tests/factories/modules/footer.factory.js +2 -2
  14. package/storybook/public/427.f81530cd.iframe.bundle.js +0 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,28 @@
1
+ # [16.0.0](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v15.0.2...v16.0.0) (2023-03-15)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * fix for footer hotline when as seen on not available, added width and height for as seen on ([be5f217](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/be5f217ffc92d70be3c1e1c8faa03a3aa6512845))
7
+ * fix for footer logo on storybook ([5816a4b](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/5816a4b871345a366e2b2ddeb8352956ce310b35))
8
+
9
+
10
+ ### Code Refactoring
11
+
12
+ * fix footer resolution issue and footer logos 18+ image ([f2b15b2](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/f2b15b2341ab749b6a5dd9167e25693bd9b0f73f))
13
+
14
+
15
+ * Merge branch 'tm-3298-footer' into 'master' ([15ffec3](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/15ffec314bb8b17d5cb11fcd31800f0ace43aa6f))
16
+ * Merge branch 'master' into tm-3298-footer ([39e43a0](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/39e43a036bdd44fbd8a832d96947c21ea6cdc4d5))
17
+
18
+ ## [15.0.2](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v15.0.1...v15.0.2) (2023-03-13)
19
+
20
+
21
+ ### Bug Fixes
22
+
23
+ * header name ([c994bbe](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/c994bbee36bca5dbacf2ee30f3cfb65ec2b030e1))
24
+ * payment name ([2709954](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/27099543609307defc0e4be494e274285974c7ef))
25
+
1
26
  ## [15.0.1](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v15.0.0...v15.0.1) (2023-03-13)
2
27
 
3
28
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gatsby-matrix-theme",
3
- "version": "15.0.1",
3
+ "version": "16.0.0",
4
4
  "main": "index.js",
5
5
  "description": "Matrix Theme NPM Package",
6
6
  "author": "",
package/src/components/atoms/footer/as-seen-on/index.js CHANGED
@@ -11,6 +11,8 @@ const AsSeenOn = ({ asSeenOn, template }) => (
11
11
  imageOnly
12
12
  singleList
13
13
  lists={asSeenOn}
14
+ width={130}
15
+ height={140}
14
16
  gtmClass="mobile-menu-gtm logo-cta"
15
17
  />
16
18
  </div>
package/src/components/atoms/footer/hotline/hotline.module.scss CHANGED
@@ -47,13 +47,9 @@
47
47
  .templateTwo {
48
48
  @include flex-direction(column);
49
49
  padding-bottom: 5rem;
50
+ }
50
51
 
51
- > div {
52
- @include min(laptop) {
53
- flex: 0 1 491px;
54
- }
55
- }
56
-
52
+ .hasAsSeenOn {
57
53
  @include min(tablet) {
58
54
  .helpText {
59
55
  text-align: left;
@@ -65,6 +61,7 @@
65
61
  justify-content: space-between;
66
62
 
67
63
  > div {
64
+ flex: 0 1 491px;
68
65
  @include flex-align(flex-start, flex-start);
69
66
  }
70
67
 
package/src/components/atoms/footer/hotline/index.js CHANGED
@@ -5,11 +5,15 @@ import loadable from '@loadable/component';
5
5
  import { MdPhoneInTalk } from '@react-icons/all-files/md/MdPhoneInTalk';
6
6
  import styles from './hotline.module.scss';
7
7
 
8
- const FooterHotline = ({ showAsSeen, asSeenOn, helpText, phoneNum, template }) => {
8
+ const FooterHotline = ({ showAsSeen = false, asSeenOn, helpText, phoneNum, template }) => {
9
9
  const AsSeenOn = showAsSeen ? loadable(() => import('../as-seen-on')) : null;
10
10
 
11
11
  return (
12
- <div className={`${styles.footerHotline} ${styles[template] ? styles[template] : ''}`}>
12
+ <div
13
+ className={`${styles.footerHotline} ${styles[template] ? styles[template] : ''} ${
14
+ showAsSeen && styles.hasAsSeenOn ? styles.hasAsSeenOn : ''
15
+ }`}
16
+ >
13
17
  <div className={styles.helpContainer}>
14
18
  <div
15
19
  className={styles.helpText}
package/src/components/atoms/footer/license/index.js CHANGED
@@ -38,8 +38,8 @@ const FooterLicense = ({
38
38
  {socialIcons && (
39
39
  <div className={styles.socialIcons}>
40
40
  <LinkList
41
- width="14"
42
- height="14"
41
+ width={40}
42
+ height={40}
43
43
  singleList
44
44
  imageOnly
45
45
  lists={socialIcons}
package/src/components/molecules/footer/variants/template-three/index.js CHANGED
@@ -65,7 +65,12 @@ const TemplateThree = ({
65
65
  )}
66
66
 
67
67
  {(helpText || phoneNum) && (
68
- <FooterHotline helpText={helpText} phoneNum={phoneNum} template="templateThree" />
68
+ <FooterHotline
69
+ showAsSeen={false}
70
+ helpText={helpText}
71
+ phoneNum={phoneNum}
72
+ template="templateThree"
73
+ />
69
74
  )}
70
75
 
71
76
  <div className={styles.bottomPart}>
package/src/gatsby-core-theme/components/molecules/header/index.js CHANGED
@@ -19,7 +19,7 @@ export const relationContent = (section, numOfStarsRating) => {
19
19
  template: section?.page?.page_styles?.short_name,
20
20
  pageTemplate: section?.page?.template,
21
21
  sections: section?.page?.sections,
22
- name: section?.page?.relation?.name,
22
+ name: section?.page?.title || section?.page?.relation?.name,
23
23
  ribbons: section?.page?.relation?.ribbons || [],
24
24
  image:
25
25
  section?.page?.relation?.standardised_logo_filename_object ||
@@ -72,7 +72,7 @@ export const relationContent = (section, numOfStarsRating) => {
72
72
  template: section?.page?.page_styles?.short_name,
73
73
  pageTemplate: section?.page?.template,
74
74
  relation: section?.page?.relation || {},
75
- name: section.page.title || section?.page?.relation?.name,
75
+ name: section?.page?.title || section?.page?.relation?.name,
76
76
  ribbons: section?.page?.relation?.ribbons || [],
77
77
  image:
78
78
  section?.page?.relation?.standardised_logo_url_object ||
package/storybook/public/427.cbe8926b.iframe.bundle.js ADDED
@@ -0,0 +1 @@
1
+ "use strict";(self.webpackChunkgatsby_matrix_theme=self.webpackChunkgatsby_matrix_theme||[]).push([[427],{"./src/components/atoms/footer/as-seen-on/index.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:function(){return as_seen_on}});__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/prop-types/index.js"),prop_types_default=__webpack_require__.n(prop_types),link_list=__webpack_require__("../node_modules/gatsby-core-theme/src/components/molecules/link-list/index.js"),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),as_seen_on_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]!./src/components/atoms/footer/as-seen-on/as-seen-on.module.scss"),options={insert:"head",singleton:!1},as_seen_on_as_seen_on_module=(injectStylesIntoStyleTag_default()(as_seen_on_module.Z,options),as_seen_on_module.Z.locals||{}),AsSeenOn=function AsSeenOn(_ref){var asSeenOn=_ref.asSeenOn,template=_ref.template;return react.createElement("div",{className:"".concat(as_seen_on_as_seen_on_module.asSeenOn," ").concat(template&&as_seen_on_as_seen_on_module[template]?as_seen_on_as_seen_on_module[template]:"")},react.createElement("h5",null,"As Seen On:"),react.createElement(link_list.Z,{showListTitle:!1,imageOnly:!0,singleList:!0,lists:asSeenOn,width:130,height:140,gtmClass:"mobile-menu-gtm logo-cta"}))};AsSeenOn.displayName="AsSeenOn",AsSeenOn.__docgenInfo={description:"",methods:[],displayName:"AsSeenOn",props:{asSeenOn:{type:{name:"shape",value:{}},required:!1,description:""},template:{type:{name:"string"},required:!1,description:""}}};var as_seen_on=AsSeenOn;AsSeenOn.propTypes={asSeenOn:prop_types_default().shape({}),template:prop_types_default().string},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/atoms/footer/as-seen-on/index.js"]={name:"AsSeenOn",docgenInfo:AsSeenOn.__docgenInfo,path:"src/components/atoms/footer/as-seen-on/index.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]!./src/components/atoms/footer/as-seen-on/as-seen-on.module.scss":function(module,__webpack_exports__,__webpack_require__){var _node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../node_modules/css-loader/dist/runtime/cssWithMappingToString.js"),_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__),_node_modules_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(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,"._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\={background:var(--footer-asSeenOn-background-color);border-bottom:var(--footer-asSeenOn-border);display:flex;align-items:flex-start;justify-content:center;flex-direction:column;gap:1.6rem;padding:3.2rem 1.6rem}@media only screen and (min-width:768px){._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\={display:flex;align-items:center;justify-content:center;padding:48px 0px}}@media only screen and (min-width:768px){._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>h5,._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>ul{margin:0 auto;max-width:calc(var(--main-container-max) + var(--side-container))}}._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>h5{margin-top:0;margin-bottom:0;color:var(--footer-asSeenOn-text-color, var(--color-49))}._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>ul{display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap}._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>ul li{padding-right:1rem;padding-bottom:1rem}@media only screen and (min-width:768px){._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>ul li{padding-bottom:2rem;padding-right:2.5rem}}@media only screen and (min-width:992px){._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>ul li{padding-bottom:0}}._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>ul li img{max-width:9.5rem}@media only screen and (min-width:768px){._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>ul li img{max-width:13rem}}@media only screen and (min-width:768px){._3U8D\\+7KKbpc4r24eiqCE9Q\\=\\=>ul{display:flex;align-items:center;justify-content:center}}.OAJN-FHYRGrx0P6jem3chA\\=\\={border:none;display:flex;align-items:flex-start;justify-content:flex-start;padding:0}.OAJN-FHYRGrx0P6jem3chA\\=\\=>h5,.OAJN-FHYRGrx0P6jem3chA\\=\\=>ul{margin:0}@media only screen and (min-width:768px){.OAJN-FHYRGrx0P6jem3chA\\=\\=>ul{display:flex;align-items:flex-start;justify-content:flex-start}}","",{version:3,sources:["webpack://./src/components/atoms/footer/as-seen-on/as-seen-on.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_mixins.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_media-queries.scss"],names:[],mappings:"AAeA,8BACE,kDAAA,CACA,2CAAA,CChBA,YAAA,CACA,sBDgBoB,CCfpB,sBDegC,CAChC,qBAAA,CACA,UAAA,CACA,qBAAA,CE+BA,yCFrCF,8BCdE,YAAA,CACA,kBDsBsB,CCrBtB,sBDqB8B,CAC5B,gBAAA,CAAA,CE2BF,yCFxBA,kEAGI,aAAA,CACA,iEAAA,CAAA,CAIJ,iCACE,YAAA,CACA,eAAA,CACA,wDAAA,CAGF,iCCzCA,YAAA,CACA,sBDyCsB,CCxCtB,0BDwCkC,CAChC,cAAA,CAEA,oCACE,kBAAA,CACA,mBAAA,CEIJ,yCFNE,oCAKI,mBAAA,CACA,oBAAA,CAAA,CAAA,yCANJ,oCAUI,gBAAA,CAAA,CAGF,wCACE,gBAAA,CERN,yCFOI,wCAII,eAAA,CAAA,CEXR,yCFVA,iCCzCA,YAAA,CACA,kBDmEwB,CClExB,sBDkEgC,CAAA,CAKlC,4BACE,WAAA,CC1EA,YAAA,CACA,sBD0EoB,CCzEpB,0BDyEgC,CAChC,SAAA,CAEA,8DAEE,QAAA,CE7BF,yCFgCA,+BCnFA,YAAA,CACA,sBDoFwB,CCnFxB,0BDmFoC,CAAA",sourcesContent:["// Global styles extended in each theme\n\n// Utils\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/variables/typography';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/variables/layout';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/variables/stack-order';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/media-queries';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/icons';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/tooltip';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/loader';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/mixins';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/scrollbar';\n@import '../../../../../../node_modules/gatsby-core-theme/src/styles/utils/animations';\n\n\n.asSeenOn {\n background: var(--footer-asSeenOn-background-color);\n border-bottom: var(--footer-asSeenOn-border);\n @include flex-align(flex-start, center);\n flex-direction: column;\n gap: 1.6rem;\n padding: 3.2rem 1.6rem;\n\n @include min(tablet) {\n @include flex-align(center, center);\n padding: 48px 0px;\n }\n\n > h5,\n > ul {\n @include min(tablet) {\n margin: 0 auto;\n max-width: calc(var(--main-container-max) + var(--side-container));\n }\n }\n\n > h5 {\n margin-top: 0;\n margin-bottom: 0;\n color: var(--footer-asSeenOn-text-color, var(--color-49));\n }\n\n > ul {\n @include flex-align(flex-start, flex-start);\n flex-wrap: wrap;\n\n li {\n padding-right: 1rem;\n padding-bottom: 1rem;\n\n @include min(tablet) {\n padding-bottom: 2rem;\n padding-right: 2.5rem;\n }\n\n @include min(laptop) {\n padding-bottom: 0;\n }\n\n img {\n max-width: 9.5rem;\n\n @include min(tablet) {\n max-width: 13rem;\n }\n }\n }\n\n @include min(tablet) {\n @include flex-align(center, center);\n }\n }\n}\n\n.templateTwo {\n border: none;\n @include flex-align(flex-start, flex-start);\n padding: 0;\n\n > h5,\n > ul {\n margin: 0;\n }\n\n > ul {\n @include min(tablet) {\n @include flex-align(flex-start, flex-start);\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","$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={asSeenOn:"_3U8D+7KKbpc4r24eiqCE9Q==",templateTwo:"OAJN-FHYRGrx0P6jem3chA=="},__webpack_exports__.Z=___CSS_LOADER_EXPORT___}}]);
package/storybook/public/iframe.html CHANGED
@@ -345,4 +345,4 @@
345
345
 
346
346
 
347
347
 
348
- window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"}];</script><script src="runtime~main.36464b90.iframe.bundle.js"></script><script src="870.0bd8dbe5.iframe.bundle.js"></script><script src="main.3a1b3323.iframe.bundle.js"></script></body></html>
348
+ window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"},{"titlePrefix":"","directory":"./src","files":"**/**/**/**/**/*.stories.js","importPathMatcher":"^\\.[\\\\/](?:src(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.js)$"}];</script><script src="runtime~main.a56bb23f.iframe.bundle.js"></script><script src="870.0bd8dbe5.iframe.bundle.js"></script><script src="main.0f3b711c.iframe.bundle.js"></script></body></html>