@iris.interactive/handcook 7.1.2-beta → 8.0.0-alpha.1

package/public/static/js/989.a4a97e0e.js.LICENSE.txt

@@ -0,0 +1,5 @@
+/**!
+* tippy.js v6.3.7
+* (c) 2017-2021 atomiks
+* MIT License
+*/

package/public/static/js/index.67977b9b.js

@@ -0,0 +1 @@
+(()=>{"use strict";var t={2826:function(t,e,i){var a=i("7412"),r=i("3315");i("3347");class o{}(0,a._)(o,"tooltip","[data-hc-tooltip], [data-hc-popover]"),(0,a._)(o,"popover","[data-hc-popover]"),(0,a._)(o,"scrollSmooth","[data-hc-smooth-scroll]"),(0,a._)(o,"modal","[data-hc-modal]"),(0,a._)(o,"modalClose","[data-hc-modal-close]"),(0,a._)(o,"lightboxAttr","data-hc-lightbox"),(0,a._)(o,"lightbox",`[${o.lightboxAttr}]`),(0,a._)(o,"dropdown","[data-hc-dropdown]"),(0,a._)(o,"collapse","[data-hc-collapse]"),(0,a._)(o,"collapseItem","[data-hc-collapse-item]"),(0,a._)(o,"popin","[data-hc-popin]"),(0,a._)(o,"tab","[data-hc-tab]"),(0,a._)(o,"toggle","[data-hc-toggle]"),(0,a._)(o,"slider","[data-hc-slider]"),(0,a._)(o,"scrollspy","[data-hc-scrollspy]"),(0,a._)(o,"scrollspyNav","[data-hc-scrollspy-nav]"),(0,a._)(o,"scrollspyNavItem","[data-hc-scrollspy-nav-item]"),(0,a._)(o,"scrollspyNavItemHref","[data-hc-scrollspy-nav-item-href]"),(0,a._)(o,"scrollReveal","[data-hc-scroll-reveal]"),(0,a._)(o,"scrollRevealDisable","[data-hc-noscroll-reveal]"),(0,a._)(o,"scrollRevealParent","[data-hc-scroll-reveal-parent]"),(0,a._)(o,"scrollRevealChildren",`${o.scrollRevealParent} > *:not(${o.scrollRevealDisable}):not(${o.scrollRevealParent}):not(${o.scrollReveal})`),(0,a._)(o,"overlay","[data-hc-overlay]");class s{}(0,a._)(s,"attrPopover","data-hc-popover"),(0,a._)(s,"attrContent","data-hc-tooltip-content"),(0,a._)(s,"attrPlacement","data-hc-tooltip-placement"),(0,a._)(s,"attrInteractive","data-hc-tooltip-interactive"),(0,a._)(s,"attrBackgroundColor","data-hc-tooltip-background-color"),(0,a._)(s,"attrColor","data-hc-tooltip-color"),(0,a._)(s,"attrFontSize","data-hc-tooltip-font-size");class l{createEvent(){this.showEvent=new Event("show.hc.tooltip"),this.shownEvent=new Event("shown.hc.tooltip"),this.hideEvent=new Event("hide.hc.tooltip"),this.hiddenEvent=new Event("hidden.hc.tooltip")}show(){this.instances.forEach(t=>{t.show()})}hide(){this.instances.forEach(t=>{t.hide()})}disable(){this.instances.forEach(t=>{t.disable()})}enable(){this.instances.forEach(t=>{t.enable()})}constructor(t=o.tooltip,e={}){(0,a._)(this,"showEvent",void 0),(0,a._)(this,"shownEvent",void 0),(0,a._)(this,"hideEvent",void 0),(0,a._)(this,"hiddenEvent",void 0),(0,a._)(this,"instances",[]),(0,a._)(this,"defaultOptions",{placement:"",content:"",trigger:"",interactive:!1,allowHTML:!0}),this.createEvent(),document.querySelectorAll(t).forEach(t=>{let i={};Object.assign(i,this.defaultOptions,e),i.trigger=""!=i.trigger?i.trigger:t.hasAttribute(s.attrPopover)?"click":"mouseenter",i.content=""!=i.content?i.content:t.hasAttribute(s.attrContent)?t.getAttribute(s.attrContent):"",i.placement=""!=i.placement?i.placement:t.hasAttribute(s.attrPlacement)?t.getAttribute(s.attrPlacement):"bottom",i.interactive=""!=i.interactive?i.interactive:!!t.hasAttribute(s.attrInteractive)&&t.getAttribute(s.attrInteractive);let a=t.hasAttribute(s.attrBackgroundColor)?t.getAttribute(s.attrBackgroundColor):"",o=t.hasAttribute(s.attrColor)?t.getAttribute(s.attrColor):"",l=t.hasAttribute(s.attrFontSize)?t.getAttribute(s.attrFontSize):"";"click"===i.trigger?t.addEventListener("click",t=>{t.preventDefault()}):i.touch=!1,i.onShow=t=>{a&&t.popper.querySelector(".tippy-box").style.setProperty("--iris--tooltip--background-color",a),o&&t.popper.querySelector(".tippy-box").style.setProperty("--iris--tooltip--color",o),l&&t.popper.querySelector(".tippy-box").style.setProperty("--iris--tooltip--font-size",l),t.reference.dispatchEvent(this.showEvent)},i.onShown=t=>{t.reference.dispatchEvent(this.shownEvent)},i.onHide=t=>{t.reference.dispatchEvent(this.hideEvent)},i.onHidden=t=>{t.reference.dispatchEvent(this.hiddenEvent)};let n=(0,r.ZP)(t,i);this.instances.push(n)})}}class n{}(0,a._)(n,"attrHref","data-hc-smooth-scroll-href"),(0,a._)(n,"attrShift","data-hc-smooth-scroll-shift");class c{easeInCubic(t){return t*t*t}scrollToElem(t,e,i,a,r){let o=e-t,s=o/i;s=Math.min(s,1);let l=this.easeInCubic(s);window.scroll(0,r+a*l),o<i&&requestAnimationFrame(e=>{let o=e||new Date().getTime();this.scrollToElem(t,o,i,a,r)})}constructor(t=o.scrollSmooth,e=1e3){document.querySelectorAll(t).forEach(t=>{t.addEventListener("click",t=>{t.preventDefault();let i=null!=t.currentTarget.getAttribute("href")?document.querySelector(t.currentTarget.getAttribute("href")):document.querySelector(t.currentTarget.dataset.hcSmoothScrollHref),a=null!==t.currentTarget.getAttribute(n.attrShift)?t.currentTarget.getAttribute(n.attrShift):0;requestAnimationFrame(t=>{let r=t||new Date().getTime(),o=window.pageYOffset,s=i.getBoundingClientRect().top-a;this.scrollToElem(r,r,e,s,o)})})})}}var d=i("2689");i("2055");class h{static show(t){d.KR.show([t])}static close(t){d.KR.close(t)}initOptions(){this.options={src:"",type:"inline",parentEl:null}}createEvent(){this.showEvent=new Event("show.hc.modal"),this.hideEvent=new Event("hide.hc.modal")}constructor(t=o.modal,e={}){(0,a._)(this,"showEvent",void 0),(0,a._)(this,"hideEvent",void 0),(0,a._)(this,"options",{}),this.createEvent(),document.querySelectorAll(t).forEach(t=>{this.initOptions(),Object.assign(this.options,e),this.options.src=""!=this.options.src?this.options.src:t.hasAttribute("href")?t.getAttribute("href"):t.hasAttribute("data-src")?t.dataset.src:"",this.options.parentEl=null!==this.options.parentEl?document.querySelector(this.options.parentEl):t.hasAttribute("data-hc-modal-parent")?document.querySelector(t.getAttribute("data-hc-modal-parent")):"",this.options.autoFocus=!!t.hasAttribute("data-hc-modal-autofocus");let i=`${o.modal}[${t.hasAttribute("data-src")?"data-src":"href"}="${this.options.src}"]`;d.KR.bind(i,Object.assign(this.options,{on:{done:()=>{document.dispatchEvent(this.showEvent)},closing:()=>{document.dispatchEvent(this.hideEvent)}}}))}),document.querySelectorAll(o.modalClose).forEach(t=>{t.addEventListener("click",t=>{t.preventDefault();let e=""===t.currentTarget.dataset.hcModalClose||t.currentTarget.dataset.hcModalClose;h.close(e)})})}}class u{attachEventToShowButton(){document.querySelectorAll("[data-hc-lightbox-show]").forEach(t=>{t.addEventListener("click",e=>{e.preventDefault(),document.querySelector(t.getAttribute("href")+" img").click()})})}getTranslation(){var t;let e=null===(t=document.querySelector("html"))||void 0===t?void 0:t.getAttribute("lang");return"string"==typeof e&&!1!==e.indexOf("fr-FR")?{CLOSE:"Fermer",NEXT:"Suivant",PREV:"Pr\xe9c\xe9dent",MODAL:"Vous pouvez fermer la modal avec la touche echap",ERROR:"Quelque chose c'est mal pass\xe9. Merci d'essayer plus tard\n",IMAGE_ERROR:"Image introuvable",ELEMENT_NOT_FOUND:"\xc9lement HTML introuvable",AJAX_NOT_FOUND:"Erreur de chargement AJAX : Introuvable",AJAX_FORBIDDEN:"Erreur de chargement AJAX : Interdit",IFRAME_ERROR:"Erreur du chargement de la page",TOGGLE_ZOOM:"Zoome/dezoome",TOGGLE_THUMBS:"Affiche/cache les miniatures",TOGGLE_SLIDESHOW:"Active/d\xe9sactive le d\xe9filement automatique",TOGGLE_FULLSCREEN:"Bascule le mode plein \xe9cran",DOWNLOAD:"T\xe9l\xe9charger"}:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",MODAL:"You can close this modal content with the ESC key",ERROR:"Something Went Wrong, Please Try Again Later",IMAGE_ERROR:"Image Not Found",ELEMENT_NOT_FOUND:"HTML Element Not Found",AJAX_NOT_FOUND:"Error Loading AJAX : Not Found",AJAX_FORBIDDEN:"Error Loading AJAX : Forbidden",IFRAME_ERROR:"Error Loading Page",TOGGLE_ZOOM:"Toggle zoom level",TOGGLE_THUMBS:"Toggle thumbnails",TOGGLE_SLIDESHOW:"Toggle slideshow",TOGGLE_FULLSCREEN:"Toggle full-screen mode",DOWNLOAD:"Download"}}constructor(t=o.lightbox,e={}){t===o.lightbox&&Object.assign(e,{groupAttr:o.lightboxAttr,l10n:this.getTranslation()}),d.KR.bind(t,e),this.attachEventToShowButton()}}class p{static hideAll(){void 0!==window.hc_dropdown&&window.hc_dropdown.forEach(t=>{t.hide()})}createEvent(){this.showEvent=new Event("show.hc.dropdown"),this.shownEvent=new Event("shown.hc.dropdown"),this.hideEvent=new Event("hide.hc.dropdown"),this.hiddenEvent=new Event("hidden.hc.dropdown")}constructor(t=o.dropdown){(0,a._)(this,"showEvent",void 0),(0,a._)(this,"shownEvent",void 0),(0,a._)(this,"hideEvent",void 0),(0,a._)(this,"hiddenEvent",void 0),window.hc_dropdown=window.hc_dropdown||[],this.createEvent(),document.querySelectorAll(t).forEach(t=>{let e=document.querySelector(t.dataset.hcDropdownMenu),i=(0,r.ZP)(t,{trigger:"click",allowHTML:!0,content:e.innerHTML,arrow:!1,placement:"bottom",theme:"dropdown",interactive:!0,onShow:t=>{t.reference.dispatchEvent(this.showEvent)},onShown:t=>{t.reference.dispatchEvent(this.shownEvent)},onHide:t=>{t.reference.dispatchEvent(this.hideEvent)},onHidden:t=>{t.reference.dispatchEvent(this.hiddenEvent)}});window.hc_dropdown.push(i)})}}var v=i("6029");class g{createEvent(){this.showEvent=new Event("show.hc.collapse"),this.shownEvent=new Event("shown.hc.collapse"),this.hideEvent=new Event("hide.hc.collapse"),this.hiddenEvent=new Event("hidden.hc.collapse")}constructor(t=o.collapse,e="collapse"){(0,a._)(this,"showEvent",void 0),(0,a._)(this,"shownEvent",void 0),(0,a._)(this,"hideEvent",void 0),(0,a._)(this,"hiddenEvent",void 0),this.createEvent(),[].slice.call(document.querySelectorAll(t)).map(function(t){let e=t.getAttribute("data-hc-collapse-parent"),i={toggle:!1};return null!==e&&(i.parent=e),new v.Z(t,i)}).map(function(t){document.querySelectorAll(`[data-hc-collapse-trigger="${t._element.getAttribute("data-hc-collapse")}"]`).forEach(e=>{e.addEventListener("click",function(e){e.preventDefault(),t.toggle()})})}),document.querySelectorAll("[data-hc-collapse]").forEach(t=>{let e=document.querySelectorAll(`[data-hc-collapse-trigger="${t.getAttribute("id")}"]`);t.addEventListener("hide.bs.collapse",i=>{e.forEach(t=>{t.classList.contains("active")&&t.classList.remove("active")}),t.dispatchEvent(this.hideEvent)}),t.addEventListener("hidden.bs.collapse",e=>{t.dispatchEvent(this.hiddenEvent)}),t.addEventListener("show.bs.collapse",i=>{e.forEach(t=>{!t.classList.contains("active")&&t.classList.add("active")}),t.dispatchEvent(this.showEvent)}),t.addEventListener("shown.bs.collapse",e=>{t.dispatchEvent(this.shownEvent)})})}}var E=i("2732"),m=i.n(E);class f{static getInstance(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return!f.instance&&(f.instance=new f(t)),f.instance.lazyLoadInstance}static update(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=f.getInstance(t);e&&"function"==typeof e.update&&e.update()}static loadAll(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=f.getInstance(t);e&&"function"==typeof e.loadAll&&e.loadAll()}constructor(t={}){t=Object.assign({elements_selector:"[data-hc-src], [data-hc-bg], [data-hc-bg-hidpi], [data-hc-srcset]",data_src:"hc-src",data_bg:"hc-bg",data_bg_hidpi:"hc-bg-hidpi",data_srcset:"hc-srcset"},t),this.lazyLoadInstance=new(m())(t)}}(0,a._)(f,"instance",void 0);var b=i("7233");class w{buildDOM(){document.querySelectorAll("[data-hc-tab-wrapper]").forEach(t=>{!t.classList.contains("nav")&&t.classList.add("nav")})}createEvent(){this.showEvent=new Event("show.hc.tab"),this.shownEvent=new Event("shown.hc.tab"),this.hideEvent=new Event("hide.hc.tab"),this.hiddenEvent=new Event("hidden.hc.tab")}static show(t){[].slice.call(document.querySelectorAll(t)).forEach(function(t){new b.Z(t).show()})}constructor(t=o.tab){(0,a._)(this,"showEvent",void 0),(0,a._)(this,"shownEvent",void 0),(0,a._)(this,"hideEvent",void 0),(0,a._)(this,"hiddenEvent",void 0),this.createEvent(),this.buildDOM(),[].slice.call(document.querySelectorAll(t)).forEach(function(t){let e=new b.Z(t);t.addEventListener("click",function(t){t.preventDefault(),e.show()})}),document.querySelectorAll(t).forEach(t=>{t.addEventListener("hide.bs.tab",e=>{t.dispatchEvent(this.hideEvent)}),t.addEventListener("show.bs.tab",e=>{t.dispatchEvent(this.showEvent)}),t.addEventListener("shown.bs.tab",e=>{t.dispatchEvent(this.shownEvent)}),t.addEventListener("hidden.bs.tab",e=>{t.dispatchEvent(this.hiddenEvent)})})}}class y{constructor(t=o.toggle){document.querySelectorAll(t).forEach(t=>{t.addEventListener("click",t=>{t.preventDefault();let e=t.currentTarget.dataset.hcToggleAttribute,i=t.currentTarget.dataset.hcToggleValue,a=t.currentTarget.getAttribute("href")?t.currentTarget.getAttribute("href"):t.currentTarget.dataset.hcToggleTarget;document.querySelectorAll(a).forEach(t=>{null!==t.getAttribute(e)&&-1!==t.getAttribute(e).indexOf(i)?"class"===e?t.classList.remove(i):t.removeAttribute(e):"class"===e?t.classList.add(i):t.setAttribute(e,i)})})})}}var A=i("1460");i("1374"),i("5311");class _{setOptions(){let t=this.slider.getAttribute("data-hc-slider-autoplay");null!==t&&(this.options.autoplay={delay:t});let e={},i=[{hcKey:"gap",libKey:"spaceBetween",callback:"parseFloat"},{hcKey:"slides-per-view",libKey:"slidesPerView",callback:"parseFloat"},{hcKey:"no-swipe",libKey:"allowTouchMove",callback:"parseReverseBool"}];if(i.map(t=>{let e=this.slider.getAttribute(`data-hc-slider-${t.hcKey}`);null!==e&&("parseReverseBool"===t.callback&&(e="true"!==e),"parseBool"===t.callback&&(e="true"===e),"parseFloat"===t.callback&&(e=parseFloat(e)),this.options[t.libKey]=e)}),this.breakpoints.forEach(t=>{let a={};i.map(e=>{let i=this.slider.getAttribute(`data-hc-slider-${e.hcKey}-${t.name}`);null!==i&&("parseReverseBool"===e.callback&&(i="true"!==i),"parseBool"===e.callback&&(i="true"===i),"parseFloat"===e.callback&&(i=parseFloat(i)),a[e.libKey]=i)}),Object.getOwnPropertyNames(a).length>0&&(e[t.value]=a)}),this.options.breakpoints=e,null!==this.slider.getAttribute("data-hc-slider-free-mode")&&(this.options.freeMode={enabled:!0}),this.slider.hasAttribute("data-hc-slider-pagination")&&(this.options.pagination={el:".hc-slider-pagination",type:"bullets",clickable:!0,dynamicBullets:!1,bulletClass:"hc-slider-pagination-bullet",clickableClass:"hc-slider-pagination-clickable",currentClass:"hc-slider-pagination-current",bulletActiveClass:"hc-slider-pagination-bullet-active"}),this.slider.hasAttribute("data-hc-slider-arrows")){let t=this.slider.getAttribute("data-hc-slider-arrows"),e=this.slider.hasAttribute("data-hc-slider-arrows-wrapper")?".hc-slider-buttons":null,i=this.slider.hasAttribute("data-hc-slider-arrow-prev")?this.slider.getAttribute("data-hc-slider-arrow-prev"):`.hc-slider-button-prev${t}`,a=this.slider.hasAttribute("data-hc-slider-arrow-next")?this.slider.getAttribute("data-hc-slider-arrow-next"):`.hc-slider-button-next${t}`;this.options.navigation={prevEl:i,nextEl:a,wrapperEl:e,disabledClass:`hc-slider-button-disabled${t}`,hiddenClass:`hc-slider-button-hidden${t}`}}this.slider.hasAttribute("data-hc-slider-fade-effect")&&(this.options.effect="fade",this.options.fadeEffect={crossFade:!0}),this.slider.hasAttribute("data-hc-slider-infinite")&&(this.options.loop=!0),this.slider.hasAttribute("data-hc-slider-disable-mousewheel")&&(this.options.mousewheel=!1),this.slider.hasAttribute("data-hc-slider-lazy")&&(this.options.lazy={enabled:!0,checkInView:!0,loadPrevNext:!0,elementClass:"hc-slider-lazy",loadedClass:"hc-slider-lazy-loaded",loadingClass:"hc-slider-lazy-loading",preloaderClass:"hc-slider-lazy-preloader"}),this.options.watchOverflow=!0}buildDom(){if(0===this.slider.querySelectorAll(".swiper-wrapper").length){let t=[].slice.call(this.slider.children);t.forEach(t=>{t.classList.add("swiper-slide")});let e=document.createElement("div");if(e.classList.add("swiper-wrapper"),t.forEach(t=>{e.appendChild(t)}),this.slider.appendChild(e),!1!==this.options.pagination&&0===this.slider.querySelectorAll(this.options.pagination.el).length){let t=document.createElement("div");t.classList.add(this.options.pagination.el.substr(1)),this.slider.appendChild(t)}if(!1!==this.options.navigation){let t=this.slider.querySelectorAll(this.options.navigation.prevEl),e=this.slider.querySelectorAll(this.options.navigation.nextEl);if(this.slider.hasAttribute("data-hc-slider-arrows-wrapper")&&0===t.length&&0===e.length){let t=document.createElement("div"),e=document.createElement("div"),i=document.createElement("div");e.classList.add(this.options.navigation.prevEl.substr(1)),i.classList.add(this.options.navigation.nextEl.substr(1)),t.classList.add(this.options.navigation.wrapperEl.substr(1)),t.appendChild(e),t.appendChild(i),this.slider.appendChild(t)}else{if(!this.slider.hasAttribute("data-hc-slider-arrow-prev")&&0===t.length){let t=document.createElement("div");t.classList.add(this.options.navigation.prevEl.substr(1)),this.slider.appendChild(t)}if(!this.slider.hasAttribute("data-hc-slider-arrow-next")&&0===e.length){let t=document.createElement("div");t.classList.add(this.options.navigation.nextEl.substr(1)),this.slider.appendChild(t)}}}}}initOptions(){this.options={slidesPerView:"auto",pagination:!1,navigation:!1,mousewheel:{forceToAxis:!0},grabCursor:!0,loop:!1,watchSlidesProgress:!0,on:{init:t=>{t.$el.find(".swiper-wrapper").addClass("hc-slider-wrapper"),t.$el.addClass("hc-slider-initialized"),t.$el.find(".swiper-slide").addClass("hc-slider-slide"),t.$el.find(".swiper-slide-active").addClass("hc-slider-slide-active"),t.$el.find(".swiper-slide-next").addClass("hc-slider-slide-next"),t.$el.find(".swiper-slide-prev").addClass("hc-slider-slide-prev"),t.isLocked&&t.$el.addClass("hc-slider-lock"),this.slider.dispatchEvent(this.initEvent)},slideChangeTransitionEnd:t=>{t.$el.find(".swiper-slide").removeClass("hc-slider-slide-active").removeClass("hc-slider-slide-next").removeClass("hc-slider-slide-prev"),t.$el.find(".swiper-slide-active").addClass("hc-slider-slide-active"),t.$el.find(".swiper-slide-next").addClass("hc-slider-slide-next"),t.$el.find(".swiper-slide-prev").addClass("hc-slider-slide-prev")}},breakpoints:{}}}constructor(t=o.slider){(0,a._)(this,"slider",void 0),(0,a._)(this,"instances",[]),(0,a._)(this,"breakpoints",[{name:"medium",value:651},{name:"large",value:1001},{name:"xlarge",value:1454}]),(0,a._)(this,"options",{}),(0,a._)(this,"initEvent",void 0),document.querySelectorAll(t).forEach(t=>{this.initEvent=new Event("init.hc.slider"),this.initOptions(),this.slider=t,this.setOptions(),this.buildDom();let e=new A.Z(t,this.options);this.instances.push(e)})}}class L{getPartsConfig(t,e){let i=[];return t.querySelectorAll(e).forEach(t=>{let e=null!==t.getAttribute("href")?{id:t.getAttribute("href"),value:0,attribute:"href"}:{id:t.getAttribute(o.scrollspyNavItemHref),value:0,attribute:o.scrollspyNavItemHref};null!==document.querySelector(e.id)&&(e.value=this.getOffset(document.querySelector(e.id)).top,i=[...i,e])}),i}activeItem(t,e){let i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:0,a=t.querySelector(`${e}:first-child`);window.addEventListener("scroll",()=>{let r=this.getPartsConfig(t,e),o=window.scrollY;if(r.forEach(e=>{o>e.value-(i+50)&&(a=t.querySelector("["+e.attribute+'="'+e.id+'"]'))}),t.querySelectorAll(e).forEach(e=>{if(e!==a){let i=new CustomEvent("deactive.hc.scrollspy",{detail:{nav:t,item:a}});document.dispatchEvent(i),e.classList.contains("active")&&e.classList.remove("active")}}),!a.classList.contains("active")){let e=new CustomEvent("active.hc.scrollspy",{detail:{nav:t,item:a}});document.dispatchEvent(e),a.classList.add("active")}})}getOffset(t){let e=0,i=0;for(;t&&!isNaN(t.offsetLeft)&&!isNaN(t.offsetTop);)e+=t.offsetLeft-t.scrollLeft,i+=t.offsetTop-t.scrollTop,t=t.offsetParent;return{top:i,left:e}}constructor(t=o.scrollspy){(0,a._)(this,"activeEvent",void 0),document.querySelectorAll(t).forEach(t=>{let e=document.querySelector(t.dataset.hcScrollspy),i=null!==t.getAttribute("data-hc-scrollspy-shift")?parseInt(t.getAttribute("data-hc-scrollspy-shift")):0;null!==e&&this.activeItem(e,o.scrollspyNavItem,i)})}}class S{show(t){t.classList.add("hc-popin-show");let e=t.parentNode;e.hasAttribute("data-hc-popin-overlay-background")&&e.classList.add("hc-popin-overlay-show"),document.dispatchEvent(this.showEvent)}close(t){t.classList.remove("hc-popin-show");let e=t.parentNode;e.hasAttribute("data-hc-popin-overlay-background")&&e.classList.remove("hc-popin-overlay-show"),document.dispatchEvent(this.hideEvent)}createEvent(t){this.showEvent=new CustomEvent("show.hc.popin",{detail:{element:t}}),this.hideEvent=new CustomEvent("hide.hc.popin",{detail:{element:t}})}constructor(t=o.popin){(0,a._)(this,"showEvent",void 0),(0,a._)(this,"hideEvent",void 0),document.querySelectorAll(t).forEach(t=>{this.createEvent(t);let e=document.createElement("button");if(e.setAttribute("data-hc-popin-close",""),e.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" tabindex="-1"><path d="M20 20L4 4m16 0L4 20"></path></svg>',t.prepend(e),t.hasAttribute("data-hc-popin-overlay")){let e=document.createElement("div");e.setAttribute("data-hc-popin-overlay-background",""),t.prepend(e),t.parentNode.insertBefore(e,t),e.appendChild(t),document.querySelectorAll("[data-hc-popin-overlay-background]")[0].addEventListener("click",e=>{!e.composedPath().includes(t)&&this.close(t)})}t.hasAttribute("data-hc-popin-position-top")&&(t.style.top=t.getAttribute("data-hc-popin-position-top")),t.hasAttribute("data-hc-popin-position-bottom")&&(t.style.bottom=t.getAttribute("data-hc-popin-position-bottom")),t.hasAttribute("data-hc-popin-position-left")&&(t.style.left=t.getAttribute("data-hc-popin-position-left")),t.hasAttribute("data-hc-popin-position-right")&&(t.style.right=t.getAttribute("data-hc-popin-position-right")),!t.hasAttribute("data-hc-popin-position-top")&&!t.hasAttribute("data-hc-popin-position-top")&&(t.style.bottom="20px"),!t.hasAttribute("data-hc-popin-position-left")&&!t.hasAttribute("data-hc-popin-position-right")&&(t.style.right="20px"),t.hasAttribute("data-hc-popin-mode")&&"trigger"===t.getAttribute("data-hc-popin-mode")?document.querySelectorAll("[data-hc-popin-trigger]").forEach(t=>{t.addEventListener("click",t=>{let e=t.currentTarget.getAttribute("href");this.show(document.getElementById(e.substring(1)))})}):t.hasAttribute("data-hc-popin-delay")?setTimeout(()=>{this.show(t)},t.getAttribute("data-hc-popin-delay")):this.show(t),t.querySelectorAll("[data-hc-popin-close]")[0].addEventListener("click",e=>{e.preventDefault(),this.close(t)})})}}class C{static init(t){let e=0,i=1,a=new IntersectionObserver(t=>{t.forEach(t=>{t.isIntersecting?t.target.classList.contains("hc-sr")&&t.target.classList.add("hc-sr--show"):t.target.classList.add("hc-sr")})},{root:null,rootMargin:"-20px 0px -20px 0px",threshold:0});t.forEach(t=>{let r;let o=!1;if(t.hasAttribute("data-hc-scroll-reveal-parent")||t.hasAttribute("data-hc-scroll-reveal")||t.hasAttribute("data-hc-noscroll-reveal"))r=C.getOptions(t);else{let e=t.parentElement;o=!0,r=C.getOptions(e)}if(r.distance!==C.distanceDefault&&""!==r.distance&&t.style.setProperty("--hc-scroll-reveal-distance",r.distance),r.delay!==C.delayDefault&&null!==r.delay&&t.style.setProperty("--hc-scroll-reveal-delay",r.delay),r.duration!==C.durationDefault&&null!==r.duration&&t.style.setProperty("--hc-scroll-reveal-duration",r.duration),r.timing!==C.timingFunctionDefault&&null!==r.timing&&t.style.setProperty("--hc-scroll-reveal-timing-function",r.timing),null!==r.interval&&null!==r.delay&&o){if(e==t.offsetTop){let t=parseInt(r.delay.replace("ms",""))+parseInt(r.interval.replace("ms",""))*i;r.delay=t+"ms",i++}else e=t.offsetTop,i=1;t.style.setProperty("--hc-scroll-reveal-delay",r.delay)}""!==r.origin&&(t.style.setProperty("--hc-scroll-reveal-origin",r.origin),"top"==r.origin?t.style.setProperty("--hc-scroll-reveal-translate","translateY(calc(var(--hc-scroll-reveal-distance) * -1))"):"left"==r.origin?t.style.setProperty("--hc-scroll-reveal-translate","translateX(calc(var(--hc-scroll-reveal-distance) * -1))"):"right"==r.origin?t.style.setProperty("--hc-scroll-reveal-translate","translateX(var(--hc-scroll-reveal-distance))"):t.style.setProperty("--hc-scroll-reveal-translate","translateY(var(--hc-scroll-reveal-distance))")),a.observe(t)})}static getOptions(t){let e={distance:C.distanceDefault,delay:C.delayDefault,duration:C.durationDefault,interval:C.intervalDefault,origin:C.originDefault,timing:C.timingFunctionDefault};return t.hasAttribute("data-hc-scroll-reveal-distance")&&(e.distance=t.getAttribute("data-hc-scroll-reveal-distance")),t.hasAttribute("data-hc-scroll-reveal-delay")&&(e.delay=t.getAttribute("data-hc-scroll-reveal-delay")+"ms"),t.hasAttribute("data-hc-scroll-reveal-duration")&&(e.duration=t.getAttribute("data-hc-scroll-reveal-duration")+"ms"),t.hasAttribute("data-hc-scroll-reveal-interval")&&(e.interval=t.getAttribute("data-hc-scroll-reveal-interval")+"ms"),t.hasAttribute("data-hc-scroll-reveal-origin")&&(e.origin=t.getAttribute("data-hc-scroll-reveal-origin")),t.hasAttribute("data-hc-scroll-reveal-timing-function")&&(e.timing=t.getAttribute("data-hc-scroll-reveal-timing-function")),e}constructor(){let t=Array.prototype.slice.call(document.querySelectorAll(o.scrollReveal)).concat(Array.prototype.slice.call(document.querySelectorAll(o.scrollRevealChildren)));C.init(t)}}(0,a._)(C,"distanceDefault",getComputedStyle(document.documentElement).getPropertyValue("--hc-scroll-reveal-distance")),(0,a._)(C,"delayDefault",getComputedStyle(document.documentElement).getPropertyValue("--hc-scroll-reveal-delay")),(0,a._)(C,"durationDefault",getComputedStyle(document.documentElement).getPropertyValue("--hc-scroll-reveal-duration")),(0,a._)(C,"intervalDefault",getComputedStyle(document.documentElement).getPropertyValue("--hc-scroll-reveal-interval")),(0,a._)(C,"originDefault",getComputedStyle(document.documentElement).getPropertyValue("--hc-scroll-reveal-origin")),(0,a._)(C,"timingFunctionDefault",getComputedStyle(document.documentElement).getPropertyValue("--hc-scroll-reveal-timing-function"));class O{show(t){t.classList.add("hc-overlay-show"),document.body.classList.add("hc-overlay-lock"),document.dispatchEvent(this.showEvent)}close(t){t.classList.remove("hc-overlay-show"),document.body.classList.remove("hc-overlay-lock"),document.dispatchEvent(this.hideEvent)}createEvent(t){this.showEvent=new CustomEvent("show.hc.overlay",{detail:{element:t}}),this.hideEvent=new CustomEvent("hide.hc.overlay",{detail:{element:t}})}constructor(t=o.overlay){(0,a._)(this,"showEvent",void 0),(0,a._)(this,"hideEvent",void 0);let e=this;document.querySelectorAll(t).forEach(t=>{e.createEvent(t),t.classList.add("hc-overlay-init"),document.querySelectorAll("[data-hc-overlay-trigger]").forEach(t=>{t.addEventListener("click",t=>{let i=t.currentTarget.getAttribute("data-hc-overlay-trigger")?t.currentTarget.getAttribute("data-hc-overlay-trigger"):t.currentTarget.getAttribute("href")?t.currentTarget.getAttribute("href").substring(1):null;e.show(document.getElementById(i))})}),document.querySelectorAll("[data-hc-overlay-close]").forEach(t=>{t.addEventListener("click",t=>{t.preventDefault();let i=t.currentTarget.getAttribute("data-hc-overlay-close");i&&e.close(document.getElementById(i))})}),document.querySelectorAll("[data-hc-overlay-background]").forEach(t=>{t.addEventListener("click",t=>{console.log("click"),t.preventDefault(),document.querySelectorAll(o.overlay).forEach(t=>{e.close(t)})})}),document.onkeyup=function(t){"Escape"===t.key&&document.querySelectorAll(o.overlay).forEach(t=>{e.close(t)})}})}}var T=i("6481");class k{static async initialize(){try{window.natsConnection=await (0,T.wsconnect)({servers:this.server,name:"IrisNatsSender",user:"irisinteractive",pass:"2G4cF4**#*72zBe5%HAmPc89"})}catch(t){console.log(`error connecting to ${JSON.stringify(t)}`)}}async publishMessage(t,e){try{void 0===window.natsConnection&&await k.initialize();let i={lat:window.IRISCollectionTheme.coordinates.latitude,long:window.IRISCollectionTheme.coordinates.longitude,blogName:window.IRISCollectionTheme.blogInfos.blogName,blogUrl:window.IRISCollectionTheme.blogInfos.blogUrl,content:e};window.natsConnection.publish(t,JSON.stringify(i))}catch(t){console.log(`error messaging to ${JSON.stringify(t)}`)}}constructor(){}}(0,a._)(k,"server","wss://nats.iris-interactive.fr:443");let q=function(t,e){return new l(t,e)},D=function(t,e){new c(t,e)},I=function(t,e){return new h(t,e)},R=function(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:o.lightbox,e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return new u(t,e)},P=function(t){return new p(t)},x=function(t){return new g(t)},N=function(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return f.getInstance(t)},F=function(t){return new w(t)},M=function(t){return new y(t)},$=function(t){return new _(t)},B=function(t){return new L(t)},z=function(t){new S(t)},H=function(){return new C},G=function(t){return new O(t)};document.addEventListener("DOMContentLoaded",function(){let t=q("#test",{trigger:"click",content:"Custom tooltip",placement:"right"});q(),setTimeout(function(){t.show()},1e3),setTimeout(function(){t.hide()},2e3),B(),D(),I(),I("#custom-trigger-modal"),R(),P(),x(),N(),F(),M(),$(),z(),H(),G(),document.addEventListener("show.hc.collapse",()=>{console.log("show hc collapse event dispatched")}),document.addEventListener("show.hc.overlay",()=>{console.log("show overlay")}),document.addEventListener("hide.hc.overlay",()=>{console.log("hide overlay")})})},1826:function(){}},e={};function i(a){var r=e[a];if(void 0!==r)return r.exports;var o=e[a]={exports:{}};return t[a].call(o.exports,o,o.exports,i),o.exports}i.m=t,i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,{a:e}),e},i.d=function(t,e){for(var a in e)i.o(e,a)&&!i.o(t,a)&&Object.defineProperty(t,a,{enumerable:!0,get:e[a]})},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},(()=>{var t=[];i.O=function(e,a,r,o){if(a){o=o||0;for(var s=t.length;s>0&&t[s-1][2]>o;s--)t[s]=t[s-1];t[s]=[a,r,o];return}for(var l=1/0,s=0;s<t.length;s++){for(var a=t[s][0],r=t[s][1],o=t[s][2],n=!0,c=0;c<a.length;c++)(!1&o||l>=o)&&Object.keys(i.O).every(function(t){return i.O[t](a[c])})?a.splice(c--,1):(n=!1,o<l&&(l=o));if(n){t.splice(s--,1);var d=r();void 0!==d&&(e=d)}}return e}})(),i.rv=function(){return"1.1.8"},(()=>{var t={980:0};i.O.j=function(e){return 0===t[e]};var e=function(e,a){var r=a[0],o=a[1],s=a[2],l,n,c=0;if(r.some(function(e){return 0!==t[e]})){for(l in o)i.o(o,l)&&(i.m[l]=o[l]);if(s)var d=s(i)}for(e&&e(a);c<r.length;c++)n=r[c],i.o(t,n)&&t[n]&&t[n][0](),t[n]=0;return i.O(d)},a=self.webpackChunk_iris_interactive_handcook=self.webpackChunk_iris_interactive_handcook||[];a.forEach(e.bind(null,0)),a.push=e.bind(null,a.push.bind(a))})(),i.ruid="bundler=rspack@1.1.8";var a=i.O(void 0,["989"],function(){return i("2826")});a=i.O(a)})();

package/public/styles/scss/_utils.scss

@@ -1,3 +1,7 @@
+@use "mixins/mixin-layout";
+@use "mixins/mixin-style";
+@use "variables";
+
 /*
   * Created by IRIS Interactive
   * User : IRIS Interactive
@@ -6,7 +10,7 @@
 /* Utils classes
 /* ============================================= */
 .stretched-link {
-    @include stretched-link;
+    @include mixin-style.stretched-link;
 }
 
 
@@ -76,13 +80,13 @@
 .hover-item {
 
     img {
-        @include transition;
+        @include mixin-style.transition;
         will-change: transform;
     }
 
     &:hover {
         img {
-            @include animate;
+            @include mixin-style.animate;
         }
     }
 }
@@ -90,15 +94,15 @@
 /* Opening
 /* ============================================= */
 .is-open {
-    color: $c-success;
+    color: variables.$c-success;
 }
 
 .soon-close {
-    color: $c-warning;
+    color: variables.$c-warning;
 }
 
 .is-close {
-    color: $c-error;
+    color: variables.$c-error;
 }
 
 /* Font
@@ -111,34 +115,34 @@
 /* Sizes
 /* ============================================= */
 .font-size-xsmall {
-    font-size: $font-size-xsmall--rem;
+    font-size: variables.$font-size-xsmall--rem;
 }
 
 .font-size-small {
-    font-size: $font-size-small--rem;
+    font-size: variables.$font-size-small--rem;
 }
 
 .font-size-regular {
-    font-size: $font-size-regular--rem;
+    font-size: variables.$font-size-regular--rem;
 
-    @include breakpoint(small) {
-        font-size: $font-size-regular--small--rem;
+    @include mixin-layout.breakpoint(small) {
+        font-size: variables.$font-size-regular--small--rem;
     }
 }
 
 .font-size-large {
-    font-size: $font-size-large--rem;
+    font-size: variables.$font-size-large--rem;
 
-    @include breakpoint(small) {
-        font-size: $font-size-large--small--rem;
+    @include mixin-layout.breakpoint(small) {
+        font-size: variables.$font-size-large--small--rem;
     }
 }
 
 .font-size-xlarge {
-    font-size: $font-size-extra-large--rem;
+    font-size: variables.$font-size-extra-large--rem;
 
-    @include breakpoint(small) {
-        font-size: $font-size-extra-large--small--rem;
+    @include mixin-layout.breakpoint(small) {
+        font-size: variables.$font-size-extra-large--small--rem;
     }
 }
 

package/public/styles/scss/_variables.scss

@@ -608,8 +608,3 @@ $c-medium: #1f70e3;
 $c-intermediate: #ff890e;
 $c-hard: #ef5350;
 $c-veryhard: #000;
-
-/* Gray
-/ ================================================== */
-$c-gray: #757575;
-$c-lightgray: #ddd;

package/public/styles/scss/handcook.scss

@@ -13,8 +13,8 @@
  * @copyright   Copyright (c) 2002-2022 IRIS Interactive, Inc. (http://www.iris-interactive.fr)
  */
 
-@import "variables";
-@import "mixins/mixin-font";
-@import "mixins/mixin-layout";
-@import "mixins/mixin-style";
-@import "utils";
+@use "variables";
+@use "mixins/mixin-font";
+@use "mixins/mixin-layout";
+@use "mixins/mixin-style";
+@use "utils";

package/public/styles/scss/mixins/_mixin-font.scss

@@ -1,3 +1,5 @@
+@use "../variables";
+
 /*!
  * IRIS Interactive
  *
@@ -16,9 +18,9 @@
 
 /* Font icon
 /* ============================================= */
-@mixin fi($name) {
+@mixin fi($name, $font: 'customer-font') {
     content: var(--font-icon--#{$name});
-    font-family: "collection-font";
+    font-family: #{$font};
     font-style: initial;
     text-transform: none;
     font-weight: 400;
@@ -33,7 +35,7 @@
 }
 
 @function vw-size( $size ) {
-    $ceil-size: ($container / 1px) / (1 - ($margin-xlarge / 100%) * 2);
+    $ceil-size: (variables.$container / 1px) / (1 - (variables.$margin-xlarge / 100%) * 2);
     @return calc(#{$size} * 100 / #{$ceil-size} * 1vw);
 }
 
@@ -59,13 +61,13 @@
     }
 
     @if $format == 'meta' {
-        font-size: #{$meta-font-size--rem};
+        font-size: #{variables.$meta-font-size--rem};
         line-height: 1.2;
     }
 
     @if $icon != '' {
         &:#{$icon-position} {
-            color: #{$icon-color};
+            color: #{variables.$icon-color};
             @include fi(#{$icon});
         }
     }
@@ -74,4 +76,4 @@
     @if $alignment != '' {
         align-items: flex-#{$alignment};
     }
-}
+}

package/public/styles/scss/mixins/_mixin-layout.scss

@@ -1,3 +1,6 @@
+@use "sass:map";
+@use "../variables";
+
 /*
   * Created by IRIS Interactive
   * User : IRIS Interactive
@@ -7,7 +10,7 @@
 /* Main gutter
 / ================================================== */
 @function viewport-border($index) {
-    @return map_get($viewport-borders, $index);
+    @return map.get(variables.$viewport-borders, $index);
 }
 
 
@@ -16,27 +19,27 @@
 @mixin breakpoint($point) {
 
     @if $point == "xlarge" {
-        @media screen and (min-width: #{$breakpoint-xlarge}) {
+        @media screen and (min-width: #{variables.$breakpoint-xlarge}) {
             @content;
         }
     } @else if $point == "desktop" {
-        @media screen and (min-width: #{$breakpoint-desktop}) {
+        @media screen and (min-width: #{variables.$breakpoint-desktop}) {
             @content;
         }
     } @else if $point == "large" {
-        @media screen and (max-width: #{$breakpoint-large}) {
+        @media screen and (max-width: #{variables.$breakpoint-large}) {
             @content;
         }
     } @else if $point == "medium" {
-        @media screen and (max-width: #{$breakpoint-medium}) {
+        @media screen and (max-width: #{variables.$breakpoint-medium}) {
             @content;
         }
     } @else if $point == "small" {
-        @media screen and (max-width: #{$breakpoint-small}) {
+        @media screen and (max-width: #{variables.$breakpoint-small}) {
             @content;
         }
     } @else if $point == "xsmall" {
-        @media screen and (max-width: #{$breakpoint-xsmall}) {
+        @media screen and (max-width: #{variables.$breakpoint-xsmall}) {
             @content;
         }
     } @else {
@@ -58,15 +61,15 @@
 /* Hover
 /* ============================================= */
 @mixin hover {
-    body.iris-hover & {
+    @media (hover: hover) and (pointer: fine) {
         &:hover {
             @content;
         }
     }
 }
 
-@mixin hover-focus() {
-    body.iris-hover & {
+@mixin hover-focus {
+    @media (hover: hover) and (pointer: fine) {
         &:hover,
         &:focus {
             @content;
@@ -74,8 +77,8 @@
     }
 }
 
-@mixin hover-focus-active() {
-    body.iris-hover & {
+@mixin hover-focus-active {
+    @media (hover: hover) and (pointer: fine) {
         &:hover,
         &:focus,
         &:active {
@@ -84,8 +87,8 @@
     }
 }
 
-@mixin hover-focus-visited() {
-    body.iris-hover & {
+@mixin hover-focus-visited {
+    @media (hover: hover) and (pointer: fine) {
         &:hover,
         &:focus,
         &:visited {

package/public/styles/scss/mixins/_mixin-style.scss

@@ -1,3 +1,6 @@
+@use "../variables";
+@use "mixin-layout";
+
 /*
   * Created by IRIS Interactive
   * User : IRIS Interactive
@@ -36,19 +39,19 @@
         padding-bottom: $padding;
 
         @if $padding-medium != 0 {
-            @include breakpoint(medium) {
+            @include mixin-layout.breakpoint(medium) {
                 padding-bottom: $padding-medium;
             }
         }
 
         @if $padding-small != 0 {
-            @include breakpoint(small) {
+            @include mixin-layout.breakpoint(small) {
                 padding-bottom: $padding-small;
             }
         }
 
         @if $padding-small != 0 {
-            @include breakpoint(xsmall) {
+            @include mixin-layout.breakpoint(xsmall) {
                 padding-bottom: $padding-xsmall;
             }
         }
@@ -141,51 +144,53 @@
     line-height: 1.4;
     cursor: pointer;
     border: none;
-    font-weight: $button-font-weight;
-    font-family: $button-font-family;
-    text-transform: $button-text-transform;
-    letter-spacing: $button-letter-spacing;
-    padding: $button-padding-y $button-padding-x;
-    border-radius: $button-border-radius;
-    font-size: $button-font-size--rem;
-    color: $button-color;
-    background-color: $button-background-color;
-    background-image: $button-background-image;
-    background-size: $button-gradient-background-image-size;
-    background-position: $button-gradient-background-image-position;
-    border: $button-border;
+    font-weight: variables.$button-font-weight;
+    font-family: variables.$button-font-family;
+    text-transform: variables.$button-text-transform;
+    letter-spacing: variables.$button-letter-spacing;
+    padding: variables.$button-padding-y variables.$button-padding-x;
+    border-radius: variables.$button-border-radius;
+    font-size: variables.$button-font-size--rem;
+    color: variables.$button-color;
+    background-color: variables.$button-background-color;
+    background-image: variables.$button-background-image;
+    background-size: variables.$button-gradient-background-image-size;
+    background-position: variables.$button-gradient-background-image-position;
+    border: variables.$button-border;
     word-break: normal;
     @include transition;
 
-    @include breakpoint(small) {
-        padding: $button-padding-y-small $button-padding-x-small;
-        font-size: $button-font-size-small--rem;
+    @include mixin-layout.breakpoint(small) {
+        padding: variables.$button-padding-y-small variables.$button-padding-x-small;
+        font-size: variables.$button-font-size-small--rem;
     }
 
     &:before,
     &.fi:before,
     .fi:before {
-        color: $button-color;
+        color: variables.$button-color;
         @include transition;
     }
 
-    &:visited {
-        color: $button-color;
-        background-color: $button-background-color;
-        background-image: $button-background-image;
-        background-size: $button-gradient-background-image-size;
-        background-position: $button-gradient-background-image-position;
-        border: $button-border;
+    &:visited,
+    &:focus,
+    &:focus-within {
+        color: variables.$button-color;
+        background-color: variables.$button-background-color;
+        background-image: variables.$button-background-image;
+        background-size: variables.$button-gradient-background-image-size;
+        background-position: variables.$button-gradient-background-image-position;
+        border: variables.$button-border;
     }
 
-    @include hover-focus {
-        color: $button-color-hover;
-        background-color: $button-background-color-hover;
-        border: $button-border-hover;
-        background-position: $button-gradient-background-image-position-hover;
+    @include mixin-layout.hover {
+        color: variables.$button-color-hover;
+        background-color: variables.$button-background-color-hover;
+        border: variables.$button-border-hover;
+        background-position: variables.$button-gradient-background-image-position-hover;
 
         &:before {
-            color: $button-color-hover;
+            color: variables.$button-color-hover;
         }
     }
 }
@@ -198,51 +203,53 @@
     line-height: 1.4;
     cursor: pointer;
     border: none;
-    font-weight: $secondary-button-font-weight;
-    font-family: $secondary-button-font-family;
-    text-transform: $secondary-button-text-transform;
-    letter-spacing: $secondary-button-letter-spacing;
-    padding: $secondary-button-padding-y $secondary-button-padding-x;
-    border-radius: $secondary-button-border-radius;
-    font-size: $secondary-button-font-size--rem;
-    color: $secondary-button-color;
-    background-color: $secondary-button-background-color;
-    background-image: $secondary-button-background-image;
-    background-size: $secondary-button-gradient-background-image-size;
-    background-position: $secondary-button-gradient-background-image-position;
-    border: $secondary-button-border;
+    font-weight: variables.$secondary-button-font-weight;
+    font-family: variables.$secondary-button-font-family;
+    text-transform: variables.$secondary-button-text-transform;
+    letter-spacing: variables.$secondary-button-letter-spacing;
+    padding: variables.$secondary-button-padding-y variables.$secondary-button-padding-x;
+    border-radius: variables.$secondary-button-border-radius;
+    font-size: variables.$secondary-button-font-size--rem;
+    color: variables.$secondary-button-color;
+    background-color: variables.$secondary-button-background-color;
+    background-image: variables.$secondary-button-background-image;
+    background-size: variables.$secondary-button-gradient-background-image-size;
+    background-position: variables.$secondary-button-gradient-background-image-position;
+    border: variables.$secondary-button-border;
     word-break: normal;
     @include transition;
 
-    @include breakpoint(small) {
-        padding: $secondary-button-padding-y-small $secondary-button-padding-x-small;
-        font-size: $secondary-button-font-size-small--rem;
+    @include mixin-layout.breakpoint(small) {
+        padding: variables.$secondary-button-padding-y-small variables.$secondary-button-padding-x-small;
+        font-size: variables.$secondary-button-font-size-small--rem;
     }
 
     &:before,
     &.fi:before,
     .fi:before {
-        color: $secondary-button-color;
+        color: variables.$secondary-button-color;
         @include transition;
     }
 
-    &:visited {
-        color: $secondary-button-color;
-        background-color: $secondary-button-background-color;
-        background-image: $secondary-button-background-image;
-        background-size: $secondary-button-gradient-background-image-size;
-        background-position: $secondary-button-gradient-background-image-position;
-        border: $secondary-button-border;
+    &:visited,
+    &:focus,
+    &:focus-within {
+        color: variables.$secondary-button-color;
+        background-color: variables.$secondary-button-background-color;
+        background-image: variables.$secondary-button-background-image;
+        background-size: variables.$secondary-button-gradient-background-image-size;
+        background-position: variables.$secondary-button-gradient-background-image-position;
+        border: variables.$secondary-button-border;
     }
 
-    @include hover-focus {
-        color: $secondary-button-color-hover;
-        background-color: $secondary-button-background-color-hover;
-        border: $secondary-button-border-hover;
-        background-position: $secondary-button-gradient-background-image-position-hover;
+    @include mixin-layout.hover {
+        color: variables.$secondary-button-color-hover;
+        background-color: variables.$secondary-button-background-color-hover;
+        border: variables.$secondary-button-border-hover;
+        background-position: variables.$secondary-button-gradient-background-image-position-hover;
 
         &:before {
-            color: $secondary-button-color-hover;
+            color: variables.$secondary-button-color-hover;
         }
     }
 }