gatsby-matrix-theme 49.0.0 → 49.0.2

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [49.0.2](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v49.0.1...v49.0.2) (2024-08-07)
+
+
+### Config
+
+* update theme ([72eae93](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/72eae937216a651586d7f2b0f5766a7b9f43e970))
+
+## [49.0.1](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v49.0.0...v49.0.1) (2024-08-06)
+
+
+### Config
+
+* update theme ([964ff97](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/964ff97d48843e5234a34850e6c0358a5702a039))
+
 # [49.0.0](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v48.0.11...v49.0.0) (2024-08-02)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-matrix-theme",
-  "version": "49.0.0",
+  "version": "49.0.2",
   "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": "35.1.1",
+    "gatsby-core-theme": "35.1.4",
     "gatsby-plugin-sharp": "^5.11.0",
     "gatsby-transformer-sharp": "^5.11.0",
     "prop-types": "15.7.2",

package/storybook/public/270.b4032d17.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkgatsby_matrix_theme=self.webpackChunkgatsby_matrix_theme||[]).push([[270],{"../node_modules/gatsby-core-theme/src/components/atoms/menu/items/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:()=>items});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"),items_item=__webpack_require__("../node_modules/gatsby-core-theme/src/components/atoms/menu/items/item/index.js"),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),items_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/menu/items/items.module.scss"),options={insert:"head",singleton:!1};injectStylesIntoStyleTag_default()(items_module.A,options);const items_items_module=items_module.A.locals||{};var helpers_menu=__webpack_require__("../node_modules/gatsby-core-theme/src/helpers/menu.js"),device_detect=__webpack_require__("../node_modules/gatsby-core-theme/src/helpers/device-detect.js"),Items=function(_ref){var link,menu,item=_ref.item,menuListRef=_ref.menuListRef,_ref$gtmClass=_ref.gtmClass,gtmClass=void 0===_ref$gtmClass?"":_ref$gtmClass,_ref$level=_ref.level,level=void 0===_ref$level?1:_ref$level,_ref$canOpenAllSubMen=_ref.canOpenAllSubMenus,canOpenAllSubMenus=void 0===_ref$canOpenAllSubMen||_ref$canOpenAllSubMen,parentMenuRef=(0,react.useRef)(null),subMenuListRef=(0,react.useRef)(null),onClick=function(e){var _target$getElementsBy,target=e.target;canOpenAllSubMenus||function(target){var _openSubmenus$getElem,_openSubmenus$getElem2,parentsWithOpenSubMenu=target.parentNode.getElementsByClassName(items_items_module.showSubMenu)[0],openSubmenus=null==parentsWithOpenSubMenu?void 0:parentsWithOpenSubMenu.getElementsByClassName(items_items_module.show)[0];parentsWithOpenSubMenu&&parentsWithOpenSubMenu!==target&&(parentsWithOpenSubMenu&&parentsWithOpenSubMenu.classList.remove(items_items_module.showSubMenu),openSubmenus&&openSubmenus.classList.remove(items_items_module.show),null===(_openSubmenus$getElem=openSubmenus.getElementsByClassName(items_items_module.showSubMenu)[0])||void 0===_openSubmenus$getElem||_openSubmenus$getElem.classList.remove(items_items_module.showSubMenu),null===(_openSubmenus$getElem2=openSubmenus.getElementsByClassName(items_items_module.show)[0])||void 0===_openSubmenus$getElem2||_openSubmenus$getElem2.classList.remove(items_items_module.show))}(target),target.classList.toggle(items_items_module.showSubMenu),null===(_target$getElementsBy=target.getElementsByTagName("UL")[0])||void 0===_target$getElementsBy||_target$getElementsBy.classList.toggle(items_items_module.show)};return item.children?(link=react.createElement(items_item.A,{item,gtmClass}),menu=react.createElement("ul",{ref:subMenuListRef,className:`${items_items_module.subMenuList||""} ${(0,helpers_menu.nj)(item)&&items_items_module.hasChildWithSubmenu||""}`},item.children.map((function(child){return react.createElement(Items,{key:(0,keygen.A)(),item:child,menuListRef,gtmClass,canOpenAllSubMenus,level:level+1})})))):link=react.createElement(items_item.A,{item,gtmClass}),react.createElement("li",{ref:parentMenuRef,className:`${items_items_module.menuItem||""} ${items_items_module[`level${level.toString()}`]||""} \n      ${void 0!==item.children&&items_items_module.hasChildren||""} \n      `,onFocus:function(e){return(0,helpers_menu.c7)(e.target,items_items_module)},onMouseOver:function(e){return(0,helpers_menu.c7)(e.target,items_items_module)},role:"menuitem",tabIndex:"0",onKeyDown:function(e){if((0,device_detect.Xb)()){if(e.defaultPrevented)return;e.preventDefault(),onClick(e)}},onClick:function(e){if((0,device_detect.Xb)()){if(e.defaultPrevented)return;e.preventDefault(),onClick(e)}}},link,menu)};Items.displayName="Items",Items.propTypes={item:prop_types_default().shape({title:prop_types_default().string,value:prop_types_default().string,children:prop_types_default().arrayOf(prop_types_default().shape({title:prop_types_default().string,value:prop_types_default().string}))}).isRequired,menuListRef:prop_types_default().oneOfType([prop_types_default().element,prop_types_default().any]),gtmClass:prop_types_default().string,level:prop_types_default().number,canOpenAllSubMenus:prop_types_default().bool},Items.__docgenInfo={description:"",methods:[],displayName:"Items",props:{gtmClass:{defaultValue:{value:"''",computed:!1},description:"",type:{name:"string"},required:!1},level:{defaultValue:{value:"1",computed:!1},description:"",type:{name:"number"},required:!1},canOpenAllSubMenus:{defaultValue:{value:"true",computed:!1},description:"",type:{name:"bool"},required:!1},item:{description:"",type:{name:"shape",value:{title:{name:"string",required:!1},value:{name:"string",required:!1},children:{name:"arrayOf",value:{name:"shape",value:{title:{name:"string",required:!1},value:{name:"string",required:!1}}},required:!1}}},required:!0},menuListRef:{description:"",type:{name:"union",value:[{name:"element"},{name:"any"}]},required:!1}}};const items=Items;"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/atoms/menu/items/index.js"]={name:"Items",docgenInfo:Items.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/atoms/menu/items/index.js"})},"../node_modules/gatsby-core-theme/src/components/atoms/menu/items/item/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>Item});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),hooks_link=__webpack_require__("../node_modules/gatsby-core-theme/src/hooks/link/index.js"),getters=__webpack_require__("../node_modules/gatsby-core-theme/src/helpers/getters.mjs"),navigationContext=__webpack_require__("../node_modules/gatsby-core-theme/src/components/organisms/navigation/navigationContext.js"),injectStylesIntoStyleTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),item_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/menu/items/item/item.module.scss"),options={insert:"head",singleton:!1};injectStylesIntoStyleTag_default()(item_module.A,options);const item_item_module=item_module.A.locals||{};function Item(_ref){var _item$value,_item$value2,item=_ref.item,_ref$gtmClass=_ref.gtmClass,gtmClass=void 0===_ref$gtmClass?"":_ref$gtmClass,setShowMenu=(0,react.useContext)(navigationContext._).setShowMenu,handleClose=function(){setShowMenu(!1)},ItemImage=function(){return item.image?react.createElement("img",{width:"32",height:"32",src:(0,getters.pv)(item.image,32,32),alt:item.title}):null};return react.createElement(react.Fragment,null,null!==(_item$value=item.value)&&void 0!==_item$value&&_item$value.includes("http")||null!==(_item$value2=item.value)&&void 0!==_item$value2&&_item$value2.includes("www")?react.createElement("a",{"aria-label":`${null==item?void 0:item.title} link`,href:item.value?item.value:"#",title:item.title,rel:"noreferrer "+(item.nofollow?"nofollow":""),target:"_blank",className:`${item_item_module.item||""} ${gtmClass||""}`,onClick:function(){return handleClose()}},react.createElement(ItemImage,null),item.title):null!==item.value?react.createElement(hooks_link.A,{disabled:null===item.value,to:item.value,title:item.title,rel:item.nofollow?"nofollow":"","aria-label":`${null==item?void 0:item.title} link`,className:`${item_item_module.item||""} ${gtmClass||""}`,onClick:function(){return handleClose()}},react.createElement(ItemImage,null),item.title):react.createElement("span",{className:`${item_item_module.item||""} ${gtmClass||""} ${item_item_module.inactiveLink}`},item.title))}Item.propTypes={item:prop_types_default().shape({title:prop_types_default().string,value:prop_types_default().string,nofollow:prop_types_default().bool,image:prop_types_default().string}).isRequired,gtmClass:prop_types_default().string},Item.__docgenInfo={description:"",methods:[],displayName:"Item",props:{gtmClass:{defaultValue:{value:"''",computed:!1},description:"",type:{name:"string"},required:!1},item:{description:"",type:{name:"shape",value:{title:{name:"string",required:!1},value:{name:"string",required:!1},nofollow:{name:"bool",required:!1},image:{name:"string",required:!1}}},required:!0}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../node_modules/gatsby-core-theme/src/components/atoms/menu/items/item/index.js"]={name:"Item",docgenInfo:Item.__docgenInfo,path:"../node_modules/gatsby-core-theme/src/components/atoms/menu/items/item/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]!../node_modules/gatsby-core-theme/src/components/atoms/menu/items/item/item.module.scss":(module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});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,".ZREb3PoT7ZdjXigiYE\\+uEA\\=\\={display:flex;gap:1rem;align-items:center;padding:1.45rem 1.6rem;font-size:1.6rem;font-weight:500;line-height:2.7rem;width:100%;padding-right:4.4rem}.ZREb3PoT7ZdjXigiYE\\+uEA\\=\\= img{width:3.2rem;max-height:3.2rem;border-radius:.4rem}@media only screen and (min-width:1200px){.ZREb3PoT7ZdjXigiYE\\+uEA\\=\\= img{display:none}}@media only screen and (max-width:991px){.p0RRINoXoFcYluprsRqDMA\\=\\={position:relative;pointer-events:none}}","",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/atoms/menu/items/item/item.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_media-queries.scss"],names:[],mappings:"AAcA,6BACE,YAAA,CACA,QAAA,CACA,kBAAA,CACA,sBAAA,CACA,gBAAA,CACA,eAAA,CACA,kBAAA,CACA,UAAA,CACA,oBAAA,CAEA,iCACE,YAAA,CACA,iBAAA,CACA,mBAAA,CCwBF,0CD3BA,iCAMI,YAAA,CAAA,CC4BJ,yCDvBF,4BAEI,iBAAA,CACA,mBAAA,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.item {\n  display: flex;\n  gap: 1rem;\n  align-items: center;\n  padding: 1.45rem 1.6rem;\n  font-size: 1.6rem;\n  font-weight: 500;\n  line-height: 2.7rem;\n  width: 100%;\n  padding-right: 4.4rem;\n\n  img {\n    width: 3.2rem;\n    max-height: 3.2rem;\n    border-radius: 0.4rem;\n\n    @include min(desktop) {\n      display: none;\n    }\n  }\n}\n\n.inactiveLink {\n  @include max(tablet) {\n    position: relative;\n    pointer-events: none;\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"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={item:"ZREb3PoT7ZdjXigiYE+uEA==",inactiveLink:"p0RRINoXoFcYluprsRqDMA=="};const __WEBPACK_DEFAULT_EXPORT__=___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/menu/items/items.module.scss":(module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});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,'.f6tMszGvmGYRyO0OLR1Skw\\=\\={position:relative;margin:0;border-bottom:1px solid var(--menu-border-color)}@media only screen and (min-width:1200px){.f6tMszGvmGYRyO0OLR1Skw\\=\\={cursor:pointer}.f6tMszGvmGYRyO0OLR1Skw\\=\\=:hover>.kGyxrOOGPnhd5Pi51fTFlQ\\=\\={display:block}.f6tMszGvmGYRyO0OLR1Skw\\=\\=:hover>.kGyxrOOGPnhd5Pi51fTFlQ\\=\\=:not(.UktWw8I\\+MP9sfYv575ZFOA\\=\\=){max-height:56rem;overflow-y:auto}}.kGyxrOOGPnhd5Pi51fTFlQ\\=\\={display:none;opacity:0;border-top:1px solid var(--menu-border-color)}.kGyxrOOGPnhd5Pi51fTFlQ\\=\\=.p8ErixYx3Z6VZC9oafj8vQ\\=\\={display:block;opacity:1}.kGyxrOOGPnhd5Pi51fTFlQ\\=\\=>li:last-of-type{border-color:rgba(0,0,0,0)}@media only screen and (min-width:1200px){.kGyxrOOGPnhd5Pi51fTFlQ\\=\\={min-width:22rem;background-color:var(--levelTwo-bg-color, var(--nav-background-color));position:absolute;top:calc(100% + 1px);left:0;width:100%;perspective:1000px;z-index:-1;transform-origin:top center;animation:SemcXKTZa7-UUdKkpKlcWw\\=\\= 300ms 60ms ease-in-out forwards;border-top:none}.kGyxrOOGPnhd5Pi51fTFlQ\\=\\=.p8ErixYx3Z6VZC9oafj8vQ\\=\\={display:none}.kGyxrOOGPnhd5Pi51fTFlQ\\=\\=>li:last-of-type{border-color:var(--menu-border-color)}.kGyxrOOGPnhd5Pi51fTFlQ\\=\\= .kGyxrOOGPnhd5Pi51fTFlQ\\=\\={top:0;left:100%;background-color:var(--levelThree-bg-color, var(--nav-background-color))}.kGyxrOOGPnhd5Pi51fTFlQ\\=\\= .kGyxrOOGPnhd5Pi51fTFlQ\\=\\=.wsYFWDRNeEg2VacOo\\+nHAg\\=\\={left:unset;right:100%}}._1QyaDPr-dIlsXgp\\+KL8\\+ng\\=\\={left:auto;right:0}.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\={display:flex;flex-direction:column;display:flex;align-items:stretch;justify-content:center;background-color:var(--levelOne-btn-bg-color, var(--levelOne-bg-color))}.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=._0nha-k5zcRcfJEskFy1cng\\=\\=:after{transition:.2s;content:"";border:solid var(--menu-text-color);border-width:0 .2333333333rem .2333333333rem 0;padding:.2333333333rem;transform:rotate(45deg);position:absolute;top:2.4rem;right:2.6rem}.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=>a,.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=>span{color:var(--levelOne-text-color, var(--menu-text-color));background-color:var(--levelOne-bg-color, var(--nav-background-color))}@media only screen and (min-width:1200px){.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\={border:none;border-top:3px solid rgba(0,0,0,0);border-bottom:3px solid rgba(0,0,0,0);background-color:var(--levelOne-desktop-bg-color, var(--levelOne-bg-color))}.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=._0nha-k5zcRcfJEskFy1cng\\=\\=:hover:after{transform:translateY(0) rotate(-135deg)}.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=._0nha-k5zcRcfJEskFy1cng\\=\\=:after{top:calc(50% - .3rem);right:2.2rem}.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=:hover{background-color:var(--levelOne-hover-bg-color, var(--nav-background-color))}.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=:hover>a,.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=:hover>span{color:var(--levelOne-hover-text-color, var(--menu-text-color));background-color:var(--levelOne-hover-bg-color, var(--nav-background-color))}.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=>a,.Fayg7pcj08ynyOU\\+12qF\\+g\\=\\=>span{background-color:var(--levelOne-desktop-bg-color, var(--nav-background-color))}}.pFSMeNw0oEYY57isWGv-mQ\\=\\={background-color:var(--levelTwo-btn-bg-color, var(--levelTwo-bg-color))}.pFSMeNw0oEYY57isWGv-mQ\\=\\=._0nha-k5zcRcfJEskFy1cng\\=\\=:after{transition:.2s;content:"";border:solid var(--menu-text-color);border-width:0 .2333333333rem .2333333333rem 0;padding:.2333333333rem;transform:rotate(-45deg);position:absolute;top:2.4rem;right:2.6rem}.pFSMeNw0oEYY57isWGv-mQ\\=\\=>a,.pFSMeNw0oEYY57isWGv-mQ\\=\\=>span{background-color:var(--levelTwo-bg-color, var(--nav-background-color));color:var(--levelTwo-text-color, var(--menu-text-color))}@media only screen and (min-width:1200px){.pFSMeNw0oEYY57isWGv-mQ\\=\\={background-color:var(--levelTwo-desktop-bg-color, var(--levelTwo-bg-color))}.pFSMeNw0oEYY57isWGv-mQ\\=\\=._0nha-k5zcRcfJEskFy1cng\\=\\=:after{top:calc(50% - .3rem);right:2.4rem}.pFSMeNw0oEYY57isWGv-mQ\\=\\=>a,.pFSMeNw0oEYY57isWGv-mQ\\=\\=>span{background-color:var(--levelTwo-desktop-bg-color, var(--levelTwo-bg-color))}.pFSMeNw0oEYY57isWGv-mQ\\=\\=:hover{background-color:var(--levelTwo-hover-bg-color, var(--nav-background-color))}.pFSMeNw0oEYY57isWGv-mQ\\=\\=:hover>a,.pFSMeNw0oEYY57isWGv-mQ\\=\\=:hover>span{background-color:var(--levelTwo-hover-bg-color, var(--nav-background-color));color:var(--levelTwo-hover-text-color, var(--menu-text-color))}}.Jb\\+V61ui1IdVagqpm5mZKw\\=\\={background-color:var(--levelThree-btn-bg-color, var(--levelThree-bg-color))}.Jb\\+V61ui1IdVagqpm5mZKw\\=\\=>a,.Jb\\+V61ui1IdVagqpm5mZKw\\=\\=>span{color:var(--levelThree-text-color, var(--menu-text-color));background-color:var(--levelThree-bg-color, var(--nav-background-color))}@media only screen and (min-width:1200px){.Jb\\+V61ui1IdVagqpm5mZKw\\=\\={background-color:var(--levelThree-desktop-bg-color, var(--levelThree-bg-color))}.Jb\\+V61ui1IdVagqpm5mZKw\\=\\=>a,.Jb\\+V61ui1IdVagqpm5mZKw\\=\\=>span{background-color:var(--primary-hover-color);background-color:var(--levelThree-desktop-bg-color, var(--levelThree-bg-color))}.Jb\\+V61ui1IdVagqpm5mZKw\\=\\=:hover{background-color:var(--levelThree-hover-bg-color, var(--nav-background-color))}.Jb\\+V61ui1IdVagqpm5mZKw\\=\\=:hover>a,.Jb\\+V61ui1IdVagqpm5mZKw\\=\\=:hover>span{color:var(--levelThree-hover-text-color, var(--menu-text-color));background-color:var(--levelThree-hover-bg-color, var(--nav-background-color))}}@media only screen and (min-width:320px)and (max-width:1199px){._0nha-k5zcRcfJEskFy1cng\\=\\=._1le5xj-O7sGx\\+vtNna07Jw\\=\\={padding-right:0}._0nha-k5zcRcfJEskFy1cng\\=\\=>a,._0nha-k5zcRcfJEskFy1cng\\=\\=>span{width:83%;min-width:calc(100% - 64px)}}@keyframes SemcXKTZa7-UUdKkpKlcWw\\=\\={0%{opacity:0;transform:rotateX(-90deg)}50%{transform:rotateX(-20deg)}100%{opacity:1;transform:rotateX(0deg)}}',"",{version:3,sources:["webpack://./../node_modules/gatsby-core-theme/src/components/atoms/menu/items/items.module.scss","webpack://./../node_modules/gatsby-core-theme/src/styles/utils/_media-queries.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/_animations.scss"],names:[],mappings:"AAcA,4BACE,iBAAA,CACA,QAAA,CACA,gDAAA,CCmCA,0CDtCF,4BAMI,cAAA,CAGE,8DACE,aAAA,CAEA,gGACE,gBAAA,CACA,eAAA,CAAA,CAOV,4BACE,YAAA,CACA,SAAA,CACA,6CAAA,CAEA,uDACE,aAAA,CACA,SAAA,CAGF,4CACE,0BAAA,CCMF,0CDjBF,4BAeI,eAAA,CACA,sEAAA,CACA,iBAAA,CACA,oBAAA,CACA,MAAA,CACA,UAAA,CACA,kBAAA,CACA,UAAA,CACA,2BAAA,CACA,oEAAA,CACA,eAAA,CAEA,uDACE,YAAA,CAGF,4CACE,qCAAA,CAGF,wDACE,KAAA,CACA,SAAA,CACA,wEAAA,CAEA,oFACE,UAAA,CACA,UAAA,CAAA,CAMR,+BACE,SAAA,CACA,OAAA,CAGF,8BEjFE,YAAA,CACA,qBFiFwB,CExFxB,YAAA,CACA,mBFwFoB,CEvFpB,sBFuF6B,CAC7B,uEAAA,CAGE,gEACE,cAAA,CG9FJ,UAAA,CAaE,mCAAA,CACA,8CAAA,CACA,sBAHQ,CAwBR,uBARW,CHoET,iBAAA,CACA,UAAA,CACA,YAAA,CAIJ,mEAEE,wDAAA,CACA,sEAAA,CCtDF,0CDoCF,8BAsBI,WAAA,CACA,kCAAA,CACA,qCAAA,CACA,2EAAA,CIzDF,sEACE,uCAAA,CJ+DE,gEACE,qBAAA,CACA,YAAA,CAIJ,oCACE,4EAAA,CAEA,+EAEE,8DAAA,CACA,4EAAA,CAIJ,mEAEE,8EAAA,CAAA,CAKN,4BACE,uEAAA,CAGE,8DACE,cAAA,CGnJJ,UAAA,CAaE,mCAAA,CACA,8CAAA,CACA,sBAHQ,CAwBR,wBAVW,CH2HT,iBAAA,CACA,UAAA,CACA,YAAA,CAIJ,+DAEE,sEAAA,CACA,wDAAA,CC3GF,0CD2FF,4BAoBI,2EAAA,CAGE,8DACE,qBAAA,CACA,YAAA,CAIJ,+DAEE,2EAAA,CAGF,kCACE,4EAAA,CAEA,2EAEE,4EAAA,CACA,8DAAA,CAAA,CAMR,6BACE,2EAAA,CAEA,iEAEE,0DAAA,CACA,wEAAA,CC/IF,0CDyIF,6BAUI,+EAAA,CAEA,iEAEE,2CAAA,CACA,+EAAA,CAGF,mCACE,8EAAA,CAEA,6EAEE,gEAAA,CACA,8EAAA,CAAA,CCnJN,+DD2JE,0DACE,eAAA,CAGF,iEAEE,SAAA,CACA,2BAAA,CAAA,CAKN,sCACE,GACE,SAAA,CACA,yBAAA,CAEF,IACE,yBAAA,CAEF,KACE,SAAA,CACA,uBAAA,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.menuItem {\n  position: relative;\n  margin: 0;\n  border-bottom: 1px solid var(--menu-border-color);\n\n  @include min(desktop) {\n    cursor: pointer;\n    \n    &:hover {\n      > .subMenuList {\n        display: block;\n\n        &:not(.hasChildWithSubmenu) {\n          max-height: 56rem;\n          overflow-y: auto;\n        }\n      }\n    }\n  }\n}\n\n.subMenuList {\n  display: none;\n  opacity: 0;\n  border-top: 1px solid var(--menu-border-color);\n  \n  &.show {\n    display: block;\n    opacity: 1;\n  }\n\n  > li:last-of-type {\n    border-color: transparent;\n  }\n\n  @include min(desktop) {\n    min-width: 22rem;\n    background-color: var(--levelTwo-bg-color, var(--nav-background-color));\n    position: absolute;\n    top: calc(100% + 1px);\n    left: 0;\n    width: 100%;\n    perspective: 1000px;\n    z-index: -1;\n    transform-origin: top center;\n    animation: rotateX 300ms 60ms ease-in-out forwards;\n    border-top: none;\n\n    &.show {\n      display: none;\n    }\n\n    > li:last-of-type {\n      border-color: var(--menu-border-color);\n    }\n  \n    .subMenuList {\n      top: 0;\n      left: 100%;\n      background-color: var(--levelThree-bg-color, var(--nav-background-color));\n\n      &.hoverLeft {\n        left: unset;\n        right: 100%;\n      }\n    }\n  }\n}\n\n.staticLeft {\n  left: auto;\n  right: 0;\n}\n\n.level1 {\n  @include flex-direction(column);\n  @include flex-align(stretch, center);\n  background-color: var(--levelOne-btn-bg-color, var(--levelOne-bg-color));\n  \n  &.hasChildren {\n    &:after {\n      transition: 0.2s;\n      @include arrow(var(--menu-text-color), 0.7rem, down, false);\n      position: absolute;\n      top: 2.4rem;\n      right: 2.6rem;\n    }\n  }\n\n  > a,\n  > span {\n    color: var(--levelOne-text-color, var(--menu-text-color));\n    background-color: var(--levelOne-bg-color, var(--nav-background-color));\n  }\n\n  @include min(desktop) {\n    border: none;\n    border-top: 3px solid transparent;\n    border-bottom: 3px solid transparent;\n    background-color: var(--levelOne-desktop-bg-color, var(--levelOne-bg-color));\n\n    &.hasChildren {\n      &:hover {\n        @include arrow-rotate(0);\n      }\n\n      &:after {\n        top: calc(50% - 0.3rem);\n        right: 2.2rem;\n      }\n    }\n  \n    &:hover {\n      background-color: var(--levelOne-hover-bg-color, var(--nav-background-color));\n  \n      > a,\n      > span {\n        color: var(--levelOne-hover-text-color, var(--menu-text-color));\n        background-color: var(--levelOne-hover-bg-color, var(--nav-background-color));\n      }\n    }\n\n    > a,\n    > span {\n      background-color: var(--levelOne-desktop-bg-color, var(--nav-background-color));\n    }\n  }\n}\n\n.level2 {  \n  background-color: var(--levelTwo-btn-bg-color, var(--levelTwo-bg-color));\n\n  &.hasChildren {\n    &:after {\n      transition: 0.2s;\n      @include arrow(var(--menu-text-color), 0.7rem, right, false);\n      position: absolute;\n      top: 2.4rem;\n      right: 2.6rem;\n    }\n  }\n\n  > a,\n  > span {\n    background-color: var(--levelTwo-bg-color, var(--nav-background-color));\n    color: var(--levelTwo-text-color, var(--menu-text-color));\n  }\n\n  @include min(desktop) {\n    background-color: var(--levelTwo-desktop-bg-color, var(--levelTwo-bg-color));\n\n    &.hasChildren {\n      &:after {\n        top: calc(50% - 0.3rem);\n        right: 2.4rem;\n      }\n    }\n\n    > a,\n    > span {\n      background-color: var(--levelTwo-desktop-bg-color, var(--levelTwo-bg-color));\n    }\n\n    &:hover {  \n      background-color: var(--levelTwo-hover-bg-color, var(--nav-background-color));\n\n      > a,\n      > span {\n        background-color: var(--levelTwo-hover-bg-color, var(--nav-background-color));\n        color: var(--levelTwo-hover-text-color, var(--menu-text-color));\n      }\n    }\n  }\n}\n\n.level3 {\n  background-color: var(--levelThree-btn-bg-color, var(--levelThree-bg-color));\n\n  > a,\n  > span {\n    color: var(--levelThree-text-color, var(--menu-text-color));\n    background-color: var(--levelThree-bg-color, var(--nav-background-color));\n  }\n  \n  @include min(desktop) {\n    background-color: var(--levelThree-desktop-bg-color, var(--levelThree-bg-color));\n\n    > a,\n    > span {\n      background-color: var(--primary-hover-color);\n      background-color: var(--levelThree-desktop-bg-color, var(--levelThree-bg-color));\n    }\n\n    &:hover {\n      background-color: var(--levelThree-hover-bg-color, var(--nav-background-color));\n  \n      > a,\n      > span {\n        color: var(--levelThree-hover-text-color, var(--menu-text-color));\n        background-color: var(--levelThree-hover-bg-color, var(--nav-background-color));\n      }\n    }\n  }\n}\n\n.hasChildren {\n  @include min-max(mobile-s, laptop) {  \n    &.showSubMenu {\n      padding-right: 0;\n    }\n\n    > a,\n    > span {\n      width: calc(83%);\n      min-width: calc(100% - 64px);\n    }\n  }\n}\n\n@keyframes rotateX {\n  0% {\n    opacity: 0;\n    transform: rotateX(-90deg);\n  }\n  50% {\n    transform: rotateX(-20deg);\n  }\n  100% {\n    opacity: 1;\n    transform: rotateX(0deg);\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","@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: var(--img-float-direction-right, 0 0 2.4rem 4.8rem);\n  } @else if $direction == left {\n    margin: var(--img-float-direction-left, 0 4.8rem 2.4rem 0);\n  } @else {\n    margin: 0 1em 1em 0;\n  }\n}\n\n@mixin content-img-align($direction: center, $spacing: var(--content-img-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@mixin border-gradient($color-1, $color-2, $bgcolor, $radius: 0.8rem, $border-width: 2px) {\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: $border-width 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 border-gradient-single($color-1, $bgcolor, $radius: 0.8rem, $border-width: 0.1rem) {\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: $border-width solid transparent;\n    background: $color-1 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: 0.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}\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","@mixin transition($args...) {\n  transition: $args;\n}\n\n@mixin visibility {\n  position: absolute;\n  opacity: 0;\n  transition: visibility 0s linear 0.33s, opacity 0.33s linear;\n  z-index: map-get($z-index, below-content);\n  &.show {\n    opacity: 1;\n    z-index: map-get($z-index, modal);\n    &.list {\n      z-index: map-get($z-index, --scroll-to-top-index);\n    }\n  }\n}\n\n@mixin slide($from, $position, $fromVal: -100%, $toVal: 0) {\n  position: $position;\n  @include transition(1.5s);\n  #{$from}: $fromVal;\n\n  &.show {\n    #{$from}: $toVal;\n  }\n}\n\n@mixin collapse($time: 0.15s, $maxHeight: 500px) {\n  max-height: 0;\n  // display: none;\n  @include transition(max-height $time ease-out);\n  overflow: hidden;\n\n  &.show,\n  &.active {\n    display: inherit;\n    max-height: $maxHeight;\n    @include transition(max-height $time ease-in);\n    overflow-y: auto;\n  }\n}\n\n@mixin collapse-full($time: 0.15s, $removeHeight: 0px) {\n  height: 0;\n  @include transition(height $time ease-out);\n  overflow: hidden;\n\n  &.show,\n  &.active {\n    height: calc(100vh - #{$removeHeight});\n    @include transition(height $time ease-in);\n  }\n}\n\n@mixin arrow-rotate($translate: 50%, $rotate: -135deg) {\n  &:after {\n    transform: translateY($translate) rotate($rotate);\n  }\n}\n"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={menuItem:"f6tMszGvmGYRyO0OLR1Skw==",subMenuList:"kGyxrOOGPnhd5Pi51fTFlQ==",hasChildWithSubmenu:"UktWw8I+MP9sfYv575ZFOA==",show:"p8ErixYx3Z6VZC9oafj8vQ==",rotateX:"SemcXKTZa7-UUdKkpKlcWw==",hoverLeft:"wsYFWDRNeEg2VacOo+nHAg==",staticLeft:"_1QyaDPr-dIlsXgp+KL8+ng==",level1:"Fayg7pcj08ynyOU+12qF+g==",hasChildren:"_0nha-k5zcRcfJEskFy1cng==",level2:"pFSMeNw0oEYY57isWGv-mQ==",level3:"Jb+V61ui1IdVagqpm5mZKw==",showSubMenu:"_1le5xj-O7sGx+vtNna07Jw=="};const __WEBPACK_DEFAULT_EXPORT__=___CSS_LOADER_EXPORT___}}]);