{"version":3,"sources":["fonts/Inkfree.ttf","fonts/Oswald.ttf","styles/abstract/variables.ts","styles/base/media-queries.ts","components/layouts/Header/StyledHeader.ts","styles/base/utilities.ts","api/agent.ts","components/layouts/Header/StyledHeaderLeftbox.ts","components/layouts/Header/HeaderLeftbox.tsx","components/layouts/Header/HeaderContent.tsx","components/layouts/Header/Header.tsx","components/common/HomeCardsPlaceholder/HomeCardsPlaceholder.tsx","models/TypeToName.ts","styles/abstract/mixins.ts","components/pages/HomePage/StyledHomePage.ts","styles/components/StyledCard.ts","components/pages/HomePage/HomePage.tsx","styles/components/StyledBreadcrumb.ts","components/pages/SubCategoryPage/StyledSubCategoryPage.ts","components/pages/SubCategoryPage/SubCategoryPage.tsx","components/common/Form/TextInput/TextInput.tsx","components/common/Form/TextAreaInput/TextAreaInput.tsx","components/layouts/LoadingComponent/StyledLoadingComponent.ts","components/layouts/LoadingComponent/LoadingComponent.tsx","services/DialogBox.ts","components/common/ContactUs/StyledContact.ts","styles/components/StyledGrid.ts","styles/components/StyledButton.ts","components/common/ContactUs/ContactUs.tsx","components/pages/MachineryPage/StyledMachineryPage.ts","components/common/MachineryPagePlaceholder/MachineryPagePlaceholder.tsx","services/SmoothScrollTo.ts","components/pages/MachineryPage/StyledMachineryPageDetails.ts","components/pages/MachineryPage/MachineryPageDetails.tsx","components/pages/MachineryPage/MachineryPage.tsx","components/layouts/NotFound/NotFound.tsx","components/layouts/Footer/StyledFooter.ts","components/layouts/Footer/Footer.tsx","components/common/ScrollToTop.tsx","components/pages/DisclaimerAndLegal/StyledDisclaimerAndLegal.ts","components/pages/DisclaimerAndLegal/DisclaimerAndLegal.tsx","components/layouts/App.tsx","serviceWorker.ts","styles/global/global-styles.ts","index.tsx"],"names":["module","exports","colors","grid","bp","customMediaQuery","maxWidth","media","custom","largest","large","ipad","medium","small","mobile","smallest","StyledHeader","styled","div","p","isHome","isOpenMenu","DisplayMobile","axios","defaults","baseURL","process","responseBody","response","data","requests","url","get","then","body","post","listAll","listBySubCategory","subcategoryId","machineryBySubCategory","machinery","name","sendEnquiry","enquiry","StyledHeaderLeftbox","HeaderLeftbox","className","src","alt","to","HeaderContent","Header","history","setIsOpenMenu","useState","setMachineyBySubcategory","loading","setLoading","isCollapse","setIsCollapse","useEffect","agent","catch","push","Loader","active","inverted","inline","size","onClick","aria-hidden","map","m","i","subCategory","replace","key","subCategoryImageUrl","HomeCardsPlaceholder","Grid","style","padding","columns","stackable","Column","Segment","minHeight","minWidth","raised","Placeholder","Line","Paragraph","Image","rectangular","typeToName","clearBothMixin","css","StyledHomePage","StyledCard","HomePage","brandName","toUpperCase","category","types","length","t","brandImage","StyledBreadcrumb","StyledSubCategoryPage","SubCategoryPage","match","machineries","setMachineries","slickIndex","setSlickIndex","slider","setSlider","subcategoryDescription","settingsSlider","slidesToShow","slidesToScroll","arrows","dots","autoplay","speed","autoplaySpeed","pauseOnHover","swipeToSlide","beforeChange","current","next","responsive","breakpoint","settings","params","subcategoryName","d","Icon","link","slickPrev","slickNext","ref","brand","fullName","imageUrl","title","TextInput","input","width","type","placeholder","meta","touched","error","Form","Field","TextAreaInput","rows","StyledLoadingComponent","LoadingComponent","dialogBox","message","callback","dialogBoxFunction","cancelText","acceptText","rootBody","document","getElementsByTagName","wrapper","createElement","container","header","footer","cancelBtn","acceptBtn","innerHTML","classList","add","appendChild","addEventListener","removeChild","StyledContact","StyledGrid","StyledButtonPrimay","validate","combineValidators","firstName","isRequired","lastName","emailAddress","contactNumber","companyName","state","hasRead","ContactUs","submitting","setSubmitting","isNotRobot","setIsNotRobot","fieldList","recaptchaRef","useRef","recaptchaCheckbox","recaptchaOnChange","a","executeAsync","id","initialValues","onSubmit","values","form","otherValues","submitValues","machineryType","machineryTitle","setTimeout","reset","field","resetFieldState","JSON","stringify","errors","console","log","render","handleSubmit","invalid","pristine","component","readOnly","value","undefined","target","rel","href","checked","disabled","onChange","sitekey","Button","content","StyledMachineryPage","MachineryPagePlaceholder","marginTop","marginBottom","fluid","image","supportsNativeSmoothScroll","documentElement","StyledMachineryPageDetails","MachineryPageDetails","nav1","setNav1","nav2","setNav2","videoCurrentUrl","setVideoCurrentUrl","activeButtonNumber","setActiveButtonNumber","additionalVideosUrls","additionalVideos","settingsSliderNav","additionalInfo","focusOnSelect","asNavFor","slider1","slider2","adaptiveHeight","featuresOne","featuresTwo","featuresTitles","f","textAlign","dangerouslySetInnerHTML","__html","specificationsTable","subTitle","descriptions","Group","additionalVideosTitles","index","icon","labelPosition","onAdditionalVideoLinkClick","videoUrl","frameBorder","allow","allowFullScreen","MachineryPage","setMachinery","contactRef","machineryName","toLowerCase","details","window","scrollTo","behavior","top","offsetTop","duration","element","scrollingElement","start","scrollTop","change","startDate","Date","animateScroll","b","c","currentTime","requestAnimationFrame","smoothScrollTo","location","hash","NotFound","backgroundColor","fontSize","Inline","as","Link","StyledFooter","Footer","getFullYear","withRouter","unlisten","listen","StyledDisclaimer","DisclaimerAndLegal","StyledApp","pathname","exact","path","Boolean","hostname","GlobalStyle","createGlobalStyle","InkFree","Oswald","ReactDOM","getElementById","navigator","serviceWorker","ready","registration","unregister"],"mappings":"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","file":"static/js/main.6cc0c83e.chunk.js","sourcesContent":["module.exports = __webpack_public_path__ + \"static/media/Inkfree.73428cd1.ttf\";","module.exports = __webpack_public_path__ + \"static/media/Oswald.e605f2f8.ttf\";","export const colors = {\r\n  white: \"#ffffff\",\r\n  black: \"#000000\",\r\n  blue1: \"#005a98\",\r\n  blue2: \"#054568\",\r\n  grey: \"#4d4d4d\",\r\n  grey1: \"#f1f1f1\",\r\n  grey2: \"#f2f2f2\",\r\n  grey3: \"#2b2b2b\",\r\n  grey4: \"#707070\",\r\n  red: \"#AE0721\",\r\n  orange: \"#f26f21\",\r\n};\r\n\r\nexport const grid = {\r\n  width: \"114rem\",\r\n  gutterVertical: \"2rem\",\r\n  gutterVerticalSmall: \"2rem\",\r\n  gutterHorizontal: \"2rem\",\r\n};\r\n\r\nexport const bp = {\r\n  largest: \"1600px\", // 100‬em\r\n  large: \"1400px\", // 100em\r\n  ipad: \"1100px\",\r\n  medium: \"1000px\", // 62.5em\r\n  small: \"855px\",\r\n  mobile: \"700px\",\r\n  smallest: \"600px\", // 600px\r\n  iphonese: \"370px\",\r\n};\r\n","const customMediaQuery = (maxWidth: number) => `@media (max-width: ${maxWidth}px)`;\r\n\r\nexport const media = {\r\n  custom: customMediaQuery,\r\n  largest: customMediaQuery(1600),\r\n  large: customMediaQuery(1400),\r\n  ipad: customMediaQuery(1100),\r\n  medium: customMediaQuery(1000),\r\n  small: customMediaQuery(855),\r\n  mobile: customMediaQuery(700),\r\n  smallest: customMediaQuery(600),\r\n};\r\n","import styled from \"styled-components\";\r\n\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\nimport { media } from \"../../../styles/base/media-queries\";\r\n\r\ninterface Props {\r\n  isHome: boolean;\r\n  isOpenMenu: boolean;\r\n}\r\n\r\nexport const StyledHeader = styled.div<Props>`\r\n  .header {\r\n    background-image: url(\"/images/header/Group2329.png\");\r\n    background-position: top;\r\n    background-repeat: no-repeat;\r\n    padding: 2.5rem 0;\r\n    height: ${(p) => (p.isHome ? \"75rem\" : \"35rem\")};\r\n\r\n    ${media.ipad} {\r\n      height: ${(p) => (p.isHome ? \"86rem\" : \"30rem\")};\r\n    }\r\n\r\n    ${media.mobile} {\r\n      position: ${(p) => (p.isHome ? \"fixed\" : \"inherit\")};\r\n      top: ${(p) => (p.isHome ? \"0\" : \"unset\")};\r\n      width: 100%;\r\n      z-index: -1;\r\n      height: ${(p) => (p.isHome ? \"80rem\" : \"10rem\")};\r\n      background-position: ${(p) => (p.isHome ? \"top\" : \"unset\")};\r\n      background-image: url(\"/images/header/header-mobile.png\");\r\n      background-size: cover;\r\n    }\r\n\r\n    &__logo {\r\n      display: block;\r\n\r\n      ${media.ipad} {\r\n        max-width: 30rem;\r\n        display: inline-block;\r\n      }\r\n\r\n      ${media.mobile} {\r\n        max-width: 25rem;\r\n      }\r\n    }\r\n\r\n    &__menu {\r\n      height: 100vh;\r\n      position: fixed;\r\n      overflow: auto;\r\n      width: 100vw;\r\n      right: -100vw;\r\n      top: 10rem;\r\n      z-index: 9999;\r\n      transform-origin: right;\r\n      transition: all 0.3s ease;\r\n      background-color: ${colors.white};\r\n      overflow-x: hidden;\r\n      right: ${(p) => (p.isOpenMenu ? \"0\" : \"-100vw\")};\r\n\r\n      &__close {\r\n        border: none;\r\n        background-color: transparent;\r\n        cursor: pointer;\r\n        height: 3.5rem;\r\n        outline: none;\r\n        position: absolute;\r\n        right: 2rem;\r\n        top: 3rem;\r\n        width: 3.5rem;\r\n\r\n        &::before,\r\n        &::after {\r\n          background-color: #fff;\r\n          content: \"\";\r\n          display: block;\r\n          height: 2px;\r\n          position: absolute;\r\n          top: 50%;\r\n          width: 100%;\r\n        }\r\n\r\n        &::before {\r\n          transform: rotate(45deg);\r\n        }\r\n\r\n        &::after {\r\n          transform: rotate(-45deg);\r\n        }\r\n      }\r\n\r\n      &__container {\r\n        padding: 1rem 2rem;\r\n        padding-bottom: 22rem;\r\n      }\r\n\r\n      &__list {\r\n        &--item {\r\n          display: block;\r\n          background-color: ${colors.grey2};\r\n          border-radius: 10px;\r\n          margin-bottom: 1rem;\r\n          font-size: 2rem;\r\n          font-weight: 600;\r\n          padding: 2rem;\r\n\r\n          .fa-angle-down {\r\n            right: 4rem;\r\n            font-size: 2.5rem;\r\n            color: ${colors.red};\r\n            position: absolute;\r\n            transition: all 0.2s;\r\n          }\r\n\r\n          &.active {\r\n            .fa-angle-down {\r\n              transform: rotate(180deg);\r\n            }\r\n          }\r\n        }\r\n\r\n        .line {\r\n          margin: 5px 0;\r\n          height: 1px;\r\n          background: repeating-linear-gradient(\r\n            to right,\r\n            ${colors.grey4} 0,\r\n            ${colors.grey4} 5px,\r\n            transparent 5px,\r\n            transparent 7px\r\n          );\r\n        }\r\n      }\r\n\r\n      &__products {\r\n        max-height: 1000px;\r\n        overflow: hidden;\r\n        transition: max-height 0.3s ease-in-out;\r\n\r\n        &.active {\r\n          max-height: 0;\r\n        }\r\n\r\n        &--item {\r\n          &--ALURangerOneR,\r\n          &--ALURangerVGroove {\r\n            height: 23rem;\r\n          }\r\n\r\n          &--OtherACMMachinery,\r\n          &--Edgebanders {\r\n            height: 22rem;\r\n          }\r\n\r\n          &--DustExtractors,\r\n          &--ALUBender {\r\n            height: 28rem;\r\n          }\r\n\r\n          &,\r\n          &:link,\r\n          &:visited {\r\n            text-decoration: none;\r\n            color: ${colors.grey};\r\n            border-bottom: 1px dashed ${colors.grey4};\r\n          }\r\n\r\n          &:nth-child(2n + 1) {\r\n            border-right: 1px dashed ${colors.grey4};\r\n          }\r\n\r\n          width: 49%;\r\n          display: inline-flex;\r\n          flex-direction: column;\r\n          justify-content: flex-start;\r\n          align-items: center;\r\n          position: relative;\r\n          padding: 1rem 3rem;\r\n\r\n          &__title {\r\n            font-size: 2.2rem;\r\n            font-weight: 500;\r\n            color: ${colors.red};\r\n            text-align: center;\r\n            margin-bottom: auto;\r\n          }\r\n\r\n          &__image {\r\n            width: 100%;\r\n            padding: 1rem 0;\r\n            margin: auto 0;\r\n            max-width: 20rem;\r\n\r\n            &--ALURangerOneR,\r\n            &--ALURangerVGroove {\r\n              height: 13rem;\r\n            }\r\n\r\n            &--Edgebanders {\r\n              margin-top: 3rem;\r\n              width: auto;\r\n            }\r\n\r\n            &--DustExtractors,\r\n            &--ALUBender {\r\n              height: auto;\r\n              max-height: 17rem;\r\n              width: auto;\r\n            }\r\n          }\r\n\r\n          &__footer {\r\n            font-size: 1.8rem;\r\n            font-weight: 400;\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    &__top {\r\n      align-items: center;\r\n      display: flex;\r\n      margin: 0 auto;\r\n      max-width: 136.6rem;\r\n      padding: 0 2.5rem;\r\n      font-weight: 800;\r\n\r\n      ${media.mobile} {\r\n        justify-content: space-between;\r\n        display: ${(p) => (p.isHome ? \"none\" : \"flex\")};\r\n      }\r\n\r\n      &__left-box {\r\n        img {\r\n          max-width: 22rem;\r\n        }\r\n      }\r\n\r\n      &__right-box {\r\n        color: ${colors.white};\r\n        font-size: 3.5rem;\r\n        font-weight: 100;\r\n      }\r\n    }\r\n\r\n    &__content {\r\n      max-width: 99rem;\r\n      margin: 0 auto;\r\n      padding: 0 2rem;\r\n      padding-top: 5rem;\r\n      color: ${colors.white};\r\n\r\n      ${media.ipad} {\r\n        max-width: 80rem;\r\n      }\r\n\r\n      ${media.mobile} {\r\n        max-width: 60rem;\r\n        width: 80%;\r\n        display: none;\r\n      }\r\n\r\n      &__sub {\r\n        font-size: 2.4rem;\r\n        font-weight: 300;\r\n\r\n        &--top {\r\n          text-align: start;\r\n        }\r\n\r\n        &--bottom {\r\n          text-align: right;\r\n\r\n          ${media.mobile} {\r\n            text-align: start;\r\n          }\r\n        }\r\n      }\r\n\r\n      &__main {\r\n        text-align: center;\r\n        font-size: 5.2rem;\r\n        margin: 3rem 0;\r\n        font-weight: 500;\r\n\r\n        ${media.ipad} {\r\n          font-size: 4.2rem;\r\n          margin: 2rem 0;\r\n        }\r\n\r\n        ${media.mobile} {\r\n          text-align: start;\r\n          line-height: 1.2;\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\n","import styled from \"styled-components\";\r\nimport { media } from \"./media-queries\";\r\n\r\nexport const DisplayIpad = styled.div`\r\n  .u-display-ipad {\r\n    display: none;\r\n\r\n    ${media.ipad} {\r\n      display: block;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const DisplayMobile = styled.div`\r\n  .u-display-mobile {\r\n    display: none;\r\n\r\n    ${media.mobile} {\r\n      display: block;\r\n    }\r\n  }\r\n`;\r\n","import axios, { AxiosResponse } from \"axios\";\r\nimport MachineryBySubCategory from \"../models/MachineryBySubCategory\";\r\nimport Machinery from \"../models/Machinery\";\r\nimport FormValues from \"../models/FormValues\";\r\n\r\naxios.defaults.baseURL = process.env.REACT_APP_API_URL;\r\n\r\nconst responseBody = (response: AxiosResponse) => response.data;\r\n\r\n// const sleep = (ms: number) => (response: AxiosResponse) =>\r\n//   new Promise<AxiosResponse>((resolve) => setTimeout(() => resolve(response), ms));\r\n\r\nconst requests = {\r\n  get: (url: string) => axios.get(url).then(responseBody),\r\n  post: (url: string, body: {}) => axios.post(url, body).then(responseBody),\r\n  put: (url: string, body: {}) => axios.put(url, body).then(responseBody),\r\n  delete: (url: string) => axios.delete(url).then(responseBody),\r\n};\r\n\r\nconst Machineries = {\r\n  listAll: () => requests.get(\"/machinery\"),\r\n  listBySubCategory: (subcategoryId: string): Promise<Machinery[]> =>\r\n    requests.get(`/machinery?subcategoryId=${subcategoryId}`),\r\n  machineryBySubCategory: (): Promise<MachineryBySubCategory[]> =>\r\n    requests.get(\"/machinery/machineryBySubCategory\"),\r\n  machinery: (name: string) => requests.get(`machinery/${name}`),\r\n};\r\n\r\nconst Enquiries = {\r\n  sendEnquiry: (enquiry: FormValues) => requests.post(\"/enquiry/SendEnquiry\", enquiry),\r\n};\r\n\r\nexport default {\r\n  Machineries,\r\n  Enquiries,\r\n};\r\n","import styled from \"styled-components\";\r\n\r\nexport const StyledHeaderLeftbox = styled.div`\r\n  img {\r\n    max-width: 34rem;\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { StyledHeaderLeftbox } from \"./StyledHeaderLeftbox\";\r\n\r\ninterface Props {\r\n  isHome: boolean;\r\n}\r\n\r\nexport const HeaderLeftbox: React.FC<Props> = ({ isHome }) => {\r\n  return (\r\n    <StyledHeaderLeftbox>\r\n      <div className=\"header__top__left-box\">\r\n        {isHome ? (\r\n          <img src=\"/images/logos/ausmach-logo-mobile.png\" alt=\"Ausmach Logo\" />\r\n        ) : (\r\n          <Link to=\"/\">\r\n            <img src=\"/images/logos/ausmach-logo-mobile.png\" alt=\"Ausmach Logo\" />\r\n          </Link>\r\n        )}\r\n      </div>\r\n    </StyledHeaderLeftbox>\r\n  );\r\n};\r\n","import React from \"react\";\r\n\r\nexport const HeaderContent = () => {\r\n  return (\r\n    <div className=\"header__content\">\r\n      <div className=\"header__content__sub header__content__sub--top\">The leading supplier of</div>\r\n      <div className=\"header__content__main\">Woodworking &amp; Composite Machinery</div>\r\n    </div>\r\n  );\r\n};\r\n","import React, { useState, useEffect, Fragment } from \"react\";\r\n\r\nimport * as H from \"history\";\r\nimport { StyledHeader } from \"./StyledHeader\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { DisplayMobile } from \"../../../styles/base/utilities\";\r\nimport MachineryBySubCategory from \"../../../models/MachineryBySubCategory\";\r\nimport agent from \"../../../api/agent\";\r\nimport { Loader } from \"semantic-ui-react\";\r\nimport { HeaderLeftbox } from \"./HeaderLeftbox\";\r\nimport { HeaderContent } from \"./HeaderContent\";\r\n\r\ninterface Props {\r\n  isHome: boolean;\r\n  history: H.History;\r\n  isOpenMenu: boolean;\r\n  setIsOpenMenu: React.Dispatch<React.SetStateAction<boolean>>;\r\n}\r\n\r\nexport const Header: React.FC<Props> = ({ isHome, history, isOpenMenu, setIsOpenMenu }) => {\r\n  const [machineryBySubCategory, setMachineyBySubcategory] = useState<MachineryBySubCategory[]>([]);\r\n  const [loading, setLoading] = useState(true);\r\n  const [isCollapse, setIsCollapse] = useState(false);\r\n\r\n  useEffect(() => {\r\n    setLoading(true);\r\n    agent.Machineries.machineryBySubCategory()\r\n      .then((response) => {\r\n        setMachineyBySubcategory(response);\r\n      })\r\n      .then(() => setLoading(false))\r\n      .catch(() => history.push(\"/notfound\"));\r\n  }, [history]);\r\n\r\n  return (\r\n    <StyledHeader isOpenMenu={isOpenMenu} isHome={isHome}>\r\n      <header className=\"header\">\r\n        <div className=\"header__top\">\r\n          <HeaderLeftbox isHome={isHome} />\r\n          <DisplayMobile>\r\n            <div className=\"u-display-mobile\">\r\n              {loading ? (\r\n                <Loader active inverted inline size=\"large\" />\r\n              ) : (\r\n                <Fragment>\r\n                  {isOpenMenu ? (\r\n                    <button\r\n                      className=\"header__menu__close\"\r\n                      onClick={() => setIsOpenMenu(false)}\r\n                    ></button>\r\n                  ) : (\r\n                    <div className=\"header__top__right-box\">\r\n                      <i\r\n                        onClick={() => setIsOpenMenu(true)}\r\n                        className=\"fa fa-bars\"\r\n                        aria-hidden=\"true\"\r\n                      ></i>\r\n                    </div>\r\n                  )}\r\n                  <div className=\"header__menu\">\r\n                    <div className=\"header__menu__container\">\r\n                      <div className=\"header__menu__list\">\r\n                        <Link\r\n                          onClick={() => setIsOpenMenu(false)}\r\n                          to={\"/\"}\r\n                          className=\"header__menu__list--item\"\r\n                        >\r\n                          Home\r\n                        </Link>\r\n                        <div className=\"line\"></div>\r\n                        <div className={`header__menu__list--item ${isCollapse ? \"active\" : \"\"}`}>\r\n                          Products\r\n                          <i\r\n                            onClick={() => setIsCollapse(!isCollapse)}\r\n                            className=\"fa fa-angle-down\"\r\n                            aria-hidden=\"true\"\r\n                          ></i>\r\n                        </div>\r\n                        <div className={`header__menu__products ${isCollapse ? \"active\" : \"\"}`}>\r\n                          {machineryBySubCategory.map((m, i) => (\r\n                            <Link\r\n                              to={`/machinery/${m.subCategory.replace(/\\s/g, \"\")}`}\r\n                              onClick={() => setIsOpenMenu(false)}\r\n                              key={i}\r\n                              className={`header__menu__products--item header__menu__products--item--${m.subCategory.replace(\r\n                                /\\s/g,\r\n                                \"\",\r\n                              )}`}\r\n                            >\r\n                              <div className=\"header__menu__products--item__title\">\r\n                                {m.subCategory}\r\n                              </div>\r\n                              <img\r\n                                src={m.subCategoryImageUrl}\r\n                                alt={m.subCategory}\r\n                                className={`header__menu__products--item__image header__menu__products--item__image--${m.subCategory.replace(\r\n                                  /\\s/g,\r\n                                  \"\",\r\n                                )}`}\r\n                              />\r\n                              <div className=\"header__menu__products--item__footer\">LEARN MORE</div>\r\n                            </Link>\r\n                          ))}\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </Fragment>\r\n              )}\r\n            </div>\r\n          </DisplayMobile>\r\n        </div>\r\n        <HeaderContent />\r\n      </header>\r\n    </StyledHeader>\r\n  );\r\n};\r\n","import React from \"react\";\r\nimport { Grid, Placeholder, Segment } from \"semantic-ui-react\";\r\n\r\nexport const HomeCardsPlaceholder = () => {\r\n  return (\r\n    <Grid style={{ padding: 30 }} columns={3} stackable>\r\n      <Grid.Column>\r\n        <Segment style={{ minHeight: 280, minWidth: 200 }} raised>\r\n          <Placeholder>\r\n            <Placeholder.Header>\r\n              <Placeholder.Line />\r\n              <Placeholder.Line />\r\n            </Placeholder.Header>\r\n            <Placeholder.Paragraph>\r\n              <Placeholder.Line />\r\n              <Placeholder.Image rectangular />\r\n            </Placeholder.Paragraph>\r\n            <Placeholder.Line />\r\n            <Placeholder.Line />\r\n          </Placeholder>\r\n        </Segment>\r\n      </Grid.Column>\r\n\r\n      <Grid.Column>\r\n        <Segment style={{ minHeight: 280, minWidth: 200 }} raised>\r\n          <Placeholder>\r\n            <Placeholder.Header>\r\n              <Placeholder.Line />\r\n              <Placeholder.Line />\r\n            </Placeholder.Header>\r\n            <Placeholder.Paragraph>\r\n              <Placeholder.Line />\r\n              <Placeholder.Image rectangular />\r\n            </Placeholder.Paragraph>\r\n            <Placeholder.Line />\r\n            <Placeholder.Line />\r\n          </Placeholder>\r\n        </Segment>\r\n      </Grid.Column>\r\n\r\n      <Grid.Column>\r\n        <Segment style={{ minHeight: 280, minWidth: 200 }} raised>\r\n          <Placeholder>\r\n            <Placeholder.Header>\r\n              <Placeholder.Line />\r\n              <Placeholder.Line />\r\n            </Placeholder.Header>\r\n            <Placeholder.Paragraph>\r\n              <Placeholder.Line />\r\n              <Placeholder.Image rectangular />\r\n            </Placeholder.Paragraph>\r\n            <Placeholder.Line />\r\n            <Placeholder.Line />\r\n          </Placeholder>\r\n        </Segment>\r\n      </Grid.Column>\r\n    </Grid>\r\n  );\r\n};\r\n","export const typeToName: { [key: string]: string } = {\r\n  \"4221 ONER\": \"ALURANGER4221ONER\",\r\n  \"6321 ONER\": \"ALURANGER6321ONER\",\r\n  \"4221 VG\": \"ALURANGER4221VGROOVE\",\r\n  \"6321 VG\": \"ALURANGER6321VGROOVE\",\r\n  \"10121 VG\": \"ALURANGER10121VGROOVE\",\r\n  \"ALU LOADER\": \"ALULOADER\",\r\n  \"ALU BENDER\": \"ALUBENDER\",\r\n  \"ALU EDGER\": \"ALUEDGER\",\r\n  \"E 450 PM\": \"E450PM\",\r\n  \"E 550\": \"E550\",\r\n  \"E 550 PM\": \"E550PM\",\r\n  \"E 550 CR\": \"E550CR\",\r\n  \"E 550 PMCR\": \"E550PMCR\",\r\n  \"160\": \"PUE160\",\r\n  \"200\": \"PUE200\",\r\n  \"250\": \"PUE250\",\r\n  \"350\": \"PUE350\",\r\n  \"350+\": \"PUE350plus\",\r\n  \"MOBIL 125\": \"MOBIL125\",\r\n};\r\n","import { css } from \"styled-components\";\r\n\r\nexport const clearBothMixin = css`\r\n  &::after {\r\n    content: \"\";\r\n    display: table;\r\n    clear: both;\r\n  }\r\n`;\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\nimport { clearBothMixin } from \"../../../styles/abstract/mixins\";\r\nimport { media } from \"../../../styles/base/media-queries\";\r\n\r\nexport const StyledHomePage = styled.div`\r\n  .home-page {\r\n    .header {\r\n      &__logo {\r\n        display: block;\r\n\r\n        ${media.mobile} {\r\n          max-width: 25rem;\r\n        }\r\n      }\r\n\r\n      &__top {\r\n        align-items: center;\r\n        display: flex;\r\n        margin: 0 auto;\r\n        max-width: 136.6rem;\r\n        padding: 2.5rem 2.5rem 0 2.5rem;\r\n        font-weight: 800;\r\n\r\n        ${media.mobile} {\r\n          justify-content: center;\r\n        }\r\n      }\r\n      &__content {\r\n        max-width: 99rem;\r\n        margin: 0 auto;\r\n        padding: 0 2rem;\r\n        padding-top: 5rem;\r\n        color: ${colors.white};\r\n\r\n        ${media.mobile} {\r\n          max-width: 60rem;\r\n          padding-top: 3rem;\r\n          width: 80%;\r\n        }\r\n\r\n        &__sub {\r\n          font-size: 2.4rem;\r\n          font-weight: 300;\r\n\r\n          &--top {\r\n            text-align: start;\r\n          }\r\n\r\n          &--bottom {\r\n            text-align: end;\r\n\r\n            ${media.mobile} {\r\n              text-align: start;\r\n            }\r\n          }\r\n        }\r\n\r\n        &__main {\r\n          margin: 2rem 0;\r\n          font-weight: 500;\r\n\r\n          ${media.mobile} {\r\n            text-align: start;\r\n            line-height: 1.2;\r\n            font-size: 4.2rem;\r\n          }\r\n        }\r\n      }\r\n    }\r\n    .cards {\r\n      max-width: 110rem;\r\n      margin: -49.5rem auto 6rem auto;\r\n      padding: 0 2rem;\r\n\r\n      ${clearBothMixin}\r\n\r\n      ${media.ipad} {\r\n        margin-top: -57.5rem;\r\n        max-width: 90rem;\r\n        padding-right: 0;\r\n      }\r\n\r\n      ${media.mobile} {\r\n        margin-top: 4rem;\r\n        padding-left: 0;\r\n      }\r\n\r\n      ${media.mobile} {\r\n        max-width: 80rem;\r\n\r\n        & > div {\r\n          display: flex;\r\n          flex-direction: column;\r\n          align-items: center;\r\n        }\r\n      }\r\n    }\r\n\r\n    .card {\r\n      min-height: 45rem;\r\n\r\n      ${media.ipad} {\r\n        min-height: 52.5rem;\r\n      }\r\n\r\n      ${media.mobile} {\r\n        min-height: 45rem;\r\n      }\r\n\r\n      &__link__image {\r\n        margin-top: auto;\r\n      }\r\n\r\n      &__image {\r\n        ${media.ipad} {\r\n          height: 25rem;\r\n        }\r\n\r\n        ${media.mobile} {\r\n          height: 20rem;\r\n        }\r\n\r\n        &--OtherACMMachinery {\r\n          width: 100%;\r\n          max-width: 30rem;\r\n\r\n          ${media.ipad} {\r\n            height: 20rem;\r\n            margin: 4.5rem 0;\r\n          }\r\n        }\r\n\r\n        &--Edgebanders {\r\n          height: 15rem;\r\n          margin: 2.5rem 0;\r\n\r\n          ${media.ipad} {\r\n            height: 19rem;\r\n            margin: 5rem 0;\r\n          }\r\n\r\n          ${media.mobile} {\r\n            margin: 0;\r\n          }\r\n        }\r\n\r\n        &--DustExtractors {\r\n          min-height: auto;\r\n          min-height: unset;\r\n          height: 20rem;\r\n\r\n          ${media.ipad} {\r\n            height: 30rem;\r\n          }\r\n        }\r\n\r\n        &--MobilDustExtractors {\r\n          min-height: auto;\r\n          min-height: unset;\r\n          height: 20.5rem;\r\n          width: 70%;\r\n          margin: 0 auto;\r\n          display: block;\r\n\r\n          ${media.ipad} {\r\n            height: 30.5rem;\r\n          }\r\n        }\r\n      }\r\n\r\n      &__types {\r\n        margin-bottom: 2rem;\r\n        margin-top: auto;\r\n      }\r\n\r\n      &__type {\r\n        font-size: 1.4rem;\r\n        transition: all 0.2s;\r\n        display: inline-block;\r\n        margin-top: 0.5rem;\r\n\r\n        &,\r\n        &:link,\r\n        &:visited {\r\n          text-decoration: none;\r\n          color: ${colors.grey3};\r\n\r\n          &:hover {\r\n            transform: translateY(-3px);\r\n          }\r\n        }\r\n\r\n        &:not(:last-child) {\r\n          &::after {\r\n            content: \"/\";\r\n            margin: 0 0.5rem;\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../abstract/variables\";\r\nimport { media } from \"../base/media-queries\";\r\n\r\nexport const StyledCard = styled.div`\r\n  .card {\r\n    background-color: ${colors.white};\r\n    display: inline-flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: center;\r\n    padding: 2.5rem 1.5rem;\r\n    min-height: 36rem;\r\n    box-shadow: 0rem 0.1rem 1rem 0rem rgba(0, 0, 0, 0.25);\r\n    width: calc((100% - 2 * 2.9rem) / 3);\r\n    margin: 0 0 2.9rem 2.8rem;\r\n    float: left;\r\n\r\n    ${media.ipad} {\r\n      width: calc((100% - 2 * 2.9rem) / 2);\r\n    }\r\n\r\n    ${media.mobile} {\r\n      width: 90%;\r\n      margin-left: 0;\r\n      max-width: 50rem;\r\n    }\r\n\r\n    &:nth-child(3n + 1) {\r\n      margin-left: 0;\r\n\r\n      ${media.ipad} {\r\n        margin-left: 2.9rem;\r\n      }\r\n\r\n      ${media.mobile} {\r\n        margin-left: 0;\r\n      }\r\n    }\r\n\r\n    &:first-child,\r\n    &:nth-child(2n + 1) {\r\n      ${media.ipad} {\r\n        margin-left: 0;\r\n      }\r\n    }\r\n\r\n    &__header {\r\n      color: ${colors.grey3};\r\n      font-size: 1.4rem;\r\n    }\r\n\r\n    &__title {\r\n      color: ${colors.red};\r\n      font-size: 2.6rem;\r\n      font-weight: 300;\r\n      margin: 0.5rem 0 2rem 0;\r\n      line-height: 1.2;\r\n    }\r\n\r\n    &__image {\r\n      width: auto;\r\n      height: 20rem;\r\n\r\n      &--DustExtractors {\r\n        min-height: 25rem;\r\n        margin: 0;\r\n      }\r\n\r\n      &--MobilDustExtractors {\r\n        min-height: 30rem;\r\n      }\r\n    }\r\n\r\n    &__types {\r\n      text-align: center;\r\n    }\r\n\r\n    &__logo {\r\n      height: 4rem;\r\n      margin: 0 auto;\r\n      margin-top: auto;\r\n\r\n      ${media.ipad} {\r\n        margin-top: 0;\r\n      }\r\n    }\r\n  }\r\n`;\r\n","import React, { useState, useEffect } from \"react\";\r\nimport MachineryBySubCategory from \"../../../models/MachineryBySubCategory\";\r\nimport agent from \"../../../api/agent\";\r\nimport { HomeCardsPlaceholder } from \"../../common/HomeCardsPlaceholder/HomeCardsPlaceholder\";\r\nimport { Link, RouteComponentProps } from \"react-router-dom\";\r\nimport { typeToName } from \"../../../models/TypeToName\";\r\nimport { StyledHomePage } from \"./StyledHomePage\";\r\nimport { StyledCard } from \"../../../styles/components/StyledCard\";\r\nimport { DisplayMobile } from \"../../../styles/base/utilities\";\r\nimport { HeaderLeftbox } from \"../../layouts/Header/HeaderLeftbox\";\r\nimport { HeaderContent } from \"../../layouts/Header/HeaderContent\";\r\n\r\nexport const HomePage: React.FC<RouteComponentProps> = ({ history }) => {\r\n  const [machineryBySubCategory, setMachineyBySubcategory] = useState<MachineryBySubCategory[]>([]);\r\n  const [loading, setLoading] = useState(true);\r\n\r\n  useEffect(() => {\r\n    setLoading(true);\r\n    agent.Machineries.machineryBySubCategory()\r\n      .then((response) => {\r\n        setMachineyBySubcategory(response);\r\n      })\r\n      .then(() => setLoading(false))\r\n      .catch(() => history.push(\"/notfound\"));\r\n  }, [history]);\r\n\r\n  return (\r\n    <StyledHomePage>\r\n      <div className=\"home-page\">\r\n        <DisplayMobile>\r\n          <div className=\"u-display-mobile\">\r\n            <div className=\"header\">\r\n              <div className=\"header__top\">\r\n                <HeaderLeftbox isHome={true} />\r\n              </div>\r\n              <HeaderContent />\r\n            </div>\r\n          </div>\r\n        </DisplayMobile>\r\n        <div className=\"cards\">\r\n          {loading ? (\r\n            <div>\r\n              <HomeCardsPlaceholder />\r\n              <HomeCardsPlaceholder />\r\n            </div>\r\n          ) : (\r\n            <StyledCard>\r\n              {machineryBySubCategory.map((machinery) => (\r\n                <div key={machinery.subCategory} className=\"card\">\r\n                  <div className=\"card__header\">\r\n                    {machinery.brandName.toUpperCase()} / {machinery.category.toUpperCase()}\r\n                  </div>\r\n                  <Link\r\n                    to={\r\n                      machinery.types.length > 1\r\n                        ? `machinery/${machinery.subCategory.replace(/\\s/g, \"\")}`\r\n                        : `machinery/${machinery.subCategory.replace(/\\s/g, \"\")}/${\r\n                            typeToName[machinery.types[0]]\r\n                          }`\r\n                    }\r\n                  >\r\n                    <div className=\"card__title\">{machinery.subCategory}</div>\r\n                  </Link>\r\n                  <Link\r\n                    className=\"card__link__image\"\r\n                    to={\r\n                      machinery.types.length > 1\r\n                        ? `machinery/${machinery.subCategory.replace(/\\s/g, \"\")}`\r\n                        : `machinery/${machinery.subCategory.replace(/\\s/g, \"\")}/${\r\n                            typeToName[machinery.types[0]]\r\n                          }`\r\n                    }\r\n                  >\r\n                    <img\r\n                      src={machinery.subCategoryImageUrl}\r\n                      alt={machinery.subCategory}\r\n                      className={`card__image card__image--${machinery.subCategory.replace(\r\n                        /\\s/g,\r\n                        \"\",\r\n                      )}`}\r\n                    />\r\n                  </Link>\r\n                  <div className=\"card__types\">\r\n                    {machinery.types.map((t) => (\r\n                      <Link\r\n                        key={t}\r\n                        to={`machinery/${machinery.subCategory.replace(/\\s/g, \"\")}/${\r\n                          typeToName[t]\r\n                        }`}\r\n                        className=\"card__type\"\r\n                      >\r\n                        {t}\r\n                      </Link>\r\n                    ))}\r\n                  </div>\r\n                  <img\r\n                    src={machinery.brandImage}\r\n                    alt={machinery.brandName}\r\n                    className=\"card__logo\"\r\n                  />\r\n                </div>\r\n              ))}\r\n            </StyledCard>\r\n          )}\r\n        </div>\r\n      </div>\r\n    </StyledHomePage>\r\n  );\r\n};\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../abstract/variables\";\r\nimport { media } from \"../base/media-queries\";\r\n\r\nexport const StyledBreadcrumb = styled.div`\r\n  .breadcrumb {\r\n    padding: 1rem 0;\r\n    margin-bottom: 2px;\r\n    box-shadow: 0 4px 2px -2px #c1caca;\r\n    background-color: ${colors.white};\r\n\r\n    ${media.mobile} {\r\n      padding: 1rem 2rem;\r\n    }\r\n\r\n    &__item {\r\n      color: ${colors.red};\r\n      font-weight: 500;\r\n      display: inline-block;\r\n\r\n      &.active {\r\n        color: ${colors.grey};\r\n      }\r\n\r\n      &:not(:last-child) {\r\n        &::after {\r\n          content: \"/\";\r\n          margin: 0 0.5rem;\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\nimport { clearBothMixin } from \"../../../styles/abstract/mixins\";\r\nimport { media } from \"../../../styles/base/media-queries\";\r\n\r\nexport const StyledSubCategoryPage = styled.div`\r\n  .subcategory-page {\r\n    background: ${colors.grey1};\r\n\r\n    &__container {\r\n      padding: 6rem 2rem;\r\n\r\n      ${media.ipad} {\r\n        max-width: 95rem;\r\n        padding-right: 0;\r\n      }\r\n\r\n      ${media.mobile} {\r\n        padding-right: 2rem;\r\n        padding-top: 6rem;\r\n      }\r\n    }\r\n\r\n    &__title {\r\n      text-align: center;\r\n      padding-bottom: 6rem;\r\n      font-size: 3.2rem;\r\n      color: ${colors.red};\r\n\r\n      ${media.mobile} {\r\n        display: none;\r\n      }\r\n    }\r\n\r\n    .cards {\r\n      text-align: center;\r\n\r\n      ${clearBothMixin}\r\n\r\n      ${media.mobile} {\r\n        max-width: 45rem;\r\n        margin: 0 auto;\r\n      }\r\n\r\n      &__count {\r\n        margin-bottom: 2rem;\r\n        color: ${colors.red};\r\n        font-size: 2.4rem;\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n\r\n        span {\r\n          margin: 0 1rem;\r\n        }\r\n      }\r\n\r\n      &__slick {\r\n        .slick {\r\n          &-prev,\r\n          &-next {\r\n            display: none;\r\n            top: -31px;\r\n            height: 4rem;\r\n\r\n            &:before {\r\n              display: none;\r\n              font-size: 4rem;\r\n              color: ${colors.red};\r\n              font-weight: 800;\r\n            }\r\n          }\r\n          &-next {\r\n            right: 30%;\r\n            &:before {\r\n              content: \"›\";\r\n            }\r\n          }\r\n\r\n          &-prev {\r\n            left: 30%;\r\n            &:before {\r\n              content: \"‹\";\r\n            }\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    .card {\r\n      ${media.mobile} {\r\n        max-width: auto;\r\n        max-width: unset;\r\n        width: 100%;\r\n        transform: scale(0.95);\r\n      }\r\n      &__image {\r\n        width: 100%;\r\n\r\n        ${media.ipad} {\r\n          width: auto;\r\n          margin: 0 auto;\r\n        }\r\n\r\n        &--Edgebanders {\r\n          height: 17rem;\r\n          margin: 0 auto;\r\n        }\r\n\r\n        &--ALURangerVGroove {\r\n          width: 100%;\r\n        }\r\n\r\n        &--DustExtractors {\r\n          width: auto;\r\n        }\r\n      }\r\n\r\n      &__logo {\r\n        margin-top: 2rem;\r\n      }\r\n    }\r\n\r\n    .u-display-mobile {\r\n      .title {\r\n        padding: 2rem 4rem;\r\n        background-position: center;\r\n        background-image: url(/images/header/no-red-small.png);\r\n        background-size: cover;\r\n\r\n        &__content {\r\n          font-size: 3.6rem;\r\n          color: ${colors.white};\r\n          font-weight: 400;\r\n          line-height: 1.4;\r\n          width: 65%;\r\n        }\r\n      }\r\n\r\n      .description {\r\n        background-color: ${colors.white};\r\n        padding: 4rem 2rem;\r\n\r\n        p {\r\n          font-size: 2.2rem;\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\n","/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport React, { useState, useEffect } from \"react\";\r\nimport Machinery from \"../../../models/Machinery\";\r\nimport agent from \"../../../api/agent\";\r\nimport { HomeCardsPlaceholder } from \"../../common/HomeCardsPlaceholder/HomeCardsPlaceholder\";\r\nimport { RouteComponentProps, Link } from \"react-router-dom\";\r\nimport { StyledBreadcrumb } from \"../../../styles/components/StyledBreadcrumb\";\r\nimport { StyledSubCategoryPage } from \"./StyledSubCategoryPage\";\r\nimport { StyledCard } from \"../../../styles/components/StyledCard\";\r\nimport { DisplayMobile } from \"../../../styles/base/utilities\";\r\nimport Slider from \"react-slick\";\r\nimport { Icon } from \"semantic-ui-react\";\r\n\r\ninterface Params {\r\n  subcategoryName: string;\r\n}\r\n\r\nexport const SubCategoryPage: React.FC<RouteComponentProps<Params>> = ({ match, history }) => {\r\n  const [machineries, setMachineries] = useState<Machinery[]>([]);\r\n  const [loading, setLoading] = useState(true);\r\n  const [slickIndex, setSlickIndex] = useState<number>(1);\r\n  const [slider, setSlider] = useState<any>();\r\n\r\n  const onSlickPrevClick = () => {\r\n    slider?.slickPrev();\r\n  };\r\n\r\n  const onSlickNextClick = () => {\r\n    slider?.slickNext();\r\n  };\r\n\r\n  let subcategoryId: string;\r\n  let subcategoryDescription: string[] = [];\r\n  const unslick: \"unslick\" = \"unslick\";\r\n  const settingsSlider = {\r\n    slidesToShow: 1,\r\n    slidesToScroll: 1,\r\n    arrows: false,\r\n    dots: false,\r\n    autoplay: true,\r\n    speed: 1000,\r\n    autoplaySpeed: 2000,\r\n    pauseOnHover: true,\r\n    swipeToSlide: true,\r\n    beforeChange: (current: number, next: number) => setSlickIndex(next + 1),\r\n    responsive: [\r\n      {\r\n        breakpoint: 700,\r\n        settings: {},\r\n      },\r\n      {\r\n        breakpoint: 10000,\r\n        settings: unslick,\r\n      },\r\n    ],\r\n  };\r\n\r\n  switch (match.params.subcategoryName) {\r\n    case \"ALURangerOneR\":\r\n      subcategoryId = \"1\";\r\n      subcategoryDescription = [\r\n        \"Our ACM Machinery offers a range of CNC machining centres and milling bending machines that are conceived to obtain optimum performances and productivity processing.\",\r\n        \"The range consists of Alu Ranger, an Alu Loader and an Alu Bender.\",\r\n      ];\r\n      break;\r\n    case \"ALURangerVGroove\":\r\n      subcategoryId = \"2\";\r\n      subcategoryDescription = [\r\n        \"Our ACM Machinery offers a range of CNC machining centres and milling bending machines that are conceived to obtain optimum performances and productivity processing.\",\r\n        \"The range consists of Alu Ranger, an Alu Loader and an Alu Bender.\",\r\n      ];\r\n      break;\r\n    case \"OtherACMMachinery\":\r\n      subcategoryId = \"3\";\r\n      subcategoryDescription = [\r\n        \"Our ACM Machinery offers a range of CNC machining centres and milling bending machines that are conceived to obtain optimum performances and productivity processing.\",\r\n        \"The range consists of Alu Ranger, an Alu Loader and an Alu Bender.\",\r\n      ];\r\n      break;\r\n    case \"Edgebanders\":\r\n      subcategoryId = \"4\";\r\n      subcategoryDescription = [\r\n        \"Our edgebanders have been selected with speed, versatility, and reliability in mind.\",\r\n        \"Whether you handle big production runs or need a compact solution, we have a machine to suit your needs.\",\r\n      ];\r\n      break;\r\n    case \"DustExtractors\":\r\n      subcategoryId = \"5\";\r\n      subcategoryDescription = [\r\n        \"We have carefully selected a range of dust extraction and collection machines designed to suit both and big small manufacturers across the woodworking and metal industries.\",\r\n      ];\r\n      break;\r\n    case \"ALUBender\":\r\n      subcategoryId = \"6\";\r\n      subcategoryDescription = [\r\n        \"Our ACM Machinery offers a range of CNC machining centres and milling bending machines that are conceived to obtain optimum performances and productivity processing.\",\r\n        \"The range consists of Alu Ranger, an Alu Loader and an Alu Bender.\",\r\n      ];\r\n      break;\r\n    default:\r\n      subcategoryId = \"100\";\r\n      break;\r\n  }\r\n\r\n  useEffect(() => {\r\n    setLoading(true);\r\n    agent.Machineries.listBySubCategory(subcategoryId)\r\n      .then((response) => {\r\n        setMachineries(response);\r\n      })\r\n      .then(() => setLoading(false))\r\n      .catch(() => history.push(\"/notfound\"));\r\n  }, [subcategoryId, history]);\r\n\r\n  return (\r\n    <StyledSubCategoryPage>\r\n      <div className=\"subcategory-page\">\r\n        {loading || !machineries ? (\r\n          <div className=\"container\">\r\n            <HomeCardsPlaceholder />\r\n          </div>\r\n        ) : (\r\n          <div>\r\n            <DisplayMobile>\r\n              <div className=\"u-display-mobile\">\r\n                <div className=\"title\">\r\n                  <div className=\"title__content\">{machineries[0].subCategory} series</div>\r\n                </div>\r\n              </div>\r\n            </DisplayMobile>\r\n            <StyledBreadcrumb>\r\n              <div className=\"breadcrumb\">\r\n                <div className=\"container\">\r\n                  <Link to={\"/\"} className=\"breadcrumb__item\">\r\n                    Home\r\n                  </Link>\r\n                  <div className=\"breadcrumb__item active\">{machineries[0].subCategory}</div>\r\n                </div>\r\n              </div>\r\n            </StyledBreadcrumb>\r\n            <DisplayMobile>\r\n              <div className=\"u-display-mobile\">\r\n                {subcategoryDescription && (\r\n                  <div className=\"description\">\r\n                    <div className=\"container\">\r\n                      {subcategoryDescription.map((d, i) => (\r\n                        <p key={i}>{d}</p>\r\n                      ))}\r\n                    </div>\r\n                  </div>\r\n                )}\r\n              </div>\r\n            </DisplayMobile>\r\n            <div className=\"container subcategory-page__container\">\r\n              <div className=\"subcategory-page__title\">{machineries[0].subCategory}</div>\r\n              <div className=\"cards\">\r\n                <DisplayMobile>\r\n                  <div className=\"u-display-mobile\">\r\n                    {machineries.length > 1 && (\r\n                      <div className=\"cards__count\">\r\n                        <Icon link onClick={onSlickPrevClick} size=\"large\" name=\"angle left\" />\r\n                        <span>\r\n                          {slickIndex} / {machineries.length}\r\n                        </span>\r\n                        <Icon link onClick={onSlickNextClick} size=\"large\" name=\"angle right\" />\r\n                      </div>\r\n                    )}\r\n                  </div>\r\n                </DisplayMobile>\r\n                <StyledCard>\r\n                  <Slider\r\n                    ref={(slider: any) => setSlider(slider)}\r\n                    className=\"cards__slick\"\r\n                    {...settingsSlider}\r\n                  >\r\n                    {machineries.map((machinery) => (\r\n                      <Link\r\n                        to={`/machinery/${machinery.subCategory.replace(/\\s/g, \"\")}/${\r\n                          machinery.name\r\n                        }`}\r\n                        key={machinery.name}\r\n                        className=\"card\"\r\n                      >\r\n                        <div className=\"card__header\">\r\n                          {machinery.brand.name.toUpperCase()} / {machinery.category.toUpperCase()}\r\n                        </div>\r\n                        <div className=\"card__title\">\r\n                          {machinery.fullName.replace(\"VGroove\", \"VG\")}\r\n                        </div>\r\n                        <img\r\n                          src={machinery.imageUrl}\r\n                          alt={machinery.title}\r\n                          className={`card__image card__image--${machinery.subCategory.replace(\r\n                            /\\s/g,\r\n                            \"\",\r\n                          )}`}\r\n                        />\r\n                        <img\r\n                          src={machinery.brand.imageUrl}\r\n                          alt={machinery.brand.name}\r\n                          className=\"card__logo\"\r\n                        />\r\n                      </Link>\r\n                    ))}\r\n                  </Slider>\r\n                </StyledCard>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        )}\r\n      </div>\r\n    </StyledSubCategoryPage>\r\n  );\r\n};\r\n","import React from \"react\";\r\nimport { FieldRenderProps } from \"react-final-form\";\r\nimport { FormFieldProps, Form } from \"semantic-ui-react\";\r\n\r\ninterface Props extends FieldRenderProps<string, HTMLInputElement>, FormFieldProps {}\r\n\r\nexport const TextInput: React.FC<Props> = ({\r\n  input,\r\n  width,\r\n  type,\r\n  placeholder,\r\n  meta: { touched, error },\r\n}) => {\r\n  return (\r\n    <Form.Field error={touched && !!error} type={type} width={width}>\r\n      <input {...input} placeholder={placeholder} />\r\n      {/* {touched && error && (\r\n        <Label basic color=\"red\">\r\n          {error}\r\n        </Label>\r\n      )} */}\r\n    </Form.Field>\r\n  );\r\n};\r\n","import React from \"react\";\r\nimport { FieldRenderProps } from \"react-final-form\";\r\nimport { FormFieldProps, Form } from \"semantic-ui-react\";\r\n\r\ninterface Props extends FieldRenderProps<string, HTMLTextAreaElement>, FormFieldProps {}\r\n\r\nexport const TextAreaInput: React.FC<Props> = ({\r\n  input,\r\n  width,\r\n  rows,\r\n  placeholder,\r\n  meta: { touched, error },\r\n}) => {\r\n  return (\r\n    <Form.Field error={touched && !!error} width={width}>\r\n      <textarea rows={rows} {...input} placeholder={placeholder} />\r\n      {/* {touched && error && (\r\n        <Label basic color=\"red\">\r\n          {error}\r\n        </Label>\r\n      )} */}\r\n    </Form.Field>\r\n  );\r\n};\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\n\r\nexport const StyledLoadingComponent = styled.div`\r\n  .loading-panel {\r\n    animation: fadeIn ease 0.5s;\r\n    align-items: center;\r\n    background-color: rgba(0, 0, 0, 0.4);\r\n    display: flex;\r\n    height: 100vh;\r\n    justify-content: center;\r\n    left: 0;\r\n    position: fixed;\r\n    top: 0;\r\n    width: 100vw;\r\n    z-index: 999;\r\n\r\n    &__container {\r\n      animation: sizeIn ease-out 0.7s;\r\n      background-color: ${colors.white};\r\n      border-radius: 2rem;\r\n      box-shadow: 0 0 1rem 0.5rem rgba(0, 0, 0, 0.5);\r\n      min-width: 30rem;\r\n      padding: 2rem;\r\n      text-align: center;\r\n      width: 20%;\r\n    }\r\n\r\n    &__spinner-box {\r\n      margin-bottom: 2rem;\r\n    }\r\n\r\n    &__text-box {\r\n      font-size: 3rem;\r\n    }\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { StyledLoadingComponent } from \"./StyledLoadingComponent\";\r\nimport { Loader } from \"semantic-ui-react\";\r\n\r\nexport const LoadingComponent = () => {\r\n  return (\r\n    <StyledLoadingComponent>\r\n      <div className=\"loading-panel\">\r\n        <div className=\"loading-panel__container\">\r\n          <div className=\"loading-panel__spinner-box\">\r\n            <Loader active inline=\"centered\" size=\"large\" />\r\n          </div>\r\n          <div className=\"loading-panel__text-box\">Loading</div>\r\n        </div>\r\n      </div>\r\n    </StyledLoadingComponent>\r\n  );\r\n};\r\n","/* eslint-disable @typescript-eslint/no-use-before-define */\r\n// type: string;\r\n// title: string;\r\n// response: any;\r\n// callback: () => void;\r\n// cancelText: string;\r\n// acceptText: string;\r\n\r\nexport const dialogBox = {\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  alert: (title: string, response: any, callback: () => void) => {\r\n    let message = response;\r\n\r\n    if (response.data) {\r\n      if (response.data.message) message = response.data.message;\r\n      else message = response.data;\r\n    }\r\n\r\n    dialogBoxFunction(\"alert\", title, message, callback, \"OK\", null);\r\n  },\r\n  info: (title: string, message: string, callback: () => void) => {\r\n    dialogBoxFunction(\"info\", title, message, callback, \"OK\", null);\r\n  },\r\n  confirm: (title: string, message: string, callback: () => void) => {\r\n    dialogBoxFunction(\"confirm\", title, message, callback, \"No\", \"Yes\");\r\n  },\r\n};\r\n\r\nfunction dialogBoxFunction(\r\n  type: string,\r\n  title: string,\r\n  message: string,\r\n  callback: (bool?: boolean) => void,\r\n  cancelText: string | null,\r\n  acceptText: string | null,\r\n) {\r\n  const rootBody = document.getElementsByTagName(\"body\")[0];\r\n  const wrapper = document.createElement(\"div\");\r\n  const container = document.createElement(\"div\");\r\n  const header = document.createElement(\"div\");\r\n  const body = document.createElement(\"div\");\r\n  const footer = document.createElement(\"div\");\r\n  const cancelBtn = document.createElement(\"button\");\r\n  const acceptBtn = document.createElement(\"button\");\r\n\r\n  header.innerHTML = title;\r\n  body.innerHTML = message;\r\n  cancelBtn.innerHTML = cancelText ? cancelText : \"\";\r\n  acceptBtn.innerHTML = acceptText ? acceptText : \"\";\r\n\r\n  wrapper.classList.add(\"dialog-box\");\r\n  wrapper.classList.add(`dialog-box--${type}`);\r\n  container.classList.add(\"dialog-box__container\");\r\n  header.classList.add(\"dialog-box__container__header\");\r\n  body.classList.add(\"dialog-box__container__body\");\r\n  footer.classList.add(\"dialog-box__container__footer\");\r\n  cancelBtn.classList.add(\"dialog-box__container__footer__btn-cancel\");\r\n  acceptBtn.classList.add(\"dialog-box__container__footer__btn-accept\");\r\n\r\n  rootBody.appendChild(wrapper);\r\n  wrapper.appendChild(container);\r\n  container.appendChild(header);\r\n  container.appendChild(body);\r\n  container.appendChild(footer);\r\n\r\n  if (acceptText) footer.appendChild(acceptBtn);\r\n\r\n  if (cancelText) footer.appendChild(cancelBtn);\r\n\r\n  acceptBtn.addEventListener(\"click\", function () {\r\n    if (callback) callback(true);\r\n\r\n    rootBody.removeChild(wrapper);\r\n  });\r\n\r\n  cancelBtn.addEventListener(\"click\", function () {\r\n    if (callback) callback(false);\r\n\r\n    rootBody.removeChild(wrapper);\r\n  });\r\n}\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\n\r\nexport const StyledContact = styled.div`\r\n  .contact__form {\r\n    background-color: #f3e3e3;\r\n    padding: 8rem 0;\r\n\r\n    .container {\r\n      max-width: 99rem;\r\n    }\r\n\r\n    a {\r\n      &,\r\n      &:link,\r\n      &:visited {\r\n        &:hover {\r\n          text-decoration: underline;\r\n        }\r\n      }\r\n    }\r\n\r\n    &__title {\r\n      color: ${colors.red};\r\n      text-align: center;\r\n      font-size: 3.6rem;\r\n      margin-bottom: 7rem;\r\n    }\r\n\r\n    &__info {\r\n      text-align: left;\r\n      font-size: 1.6rem;\r\n      font-weight: 300;\r\n      margin-bottom: 2rem;\r\n    }\r\n\r\n    &__checkboxes {\r\n      font-size: 1.6rem;\r\n      font-weight: 400;\r\n\r\n      .checkbox {\r\n        padding-top: 2.5rem;\r\n\r\n        &__label {\r\n          display: flex;\r\n          align-items: center;\r\n          position: relative;\r\n          cursor: pointer;\r\n\r\n          input[type=\"checkbox\"] {\r\n            left: -9999rem;\r\n            position: absolute;\r\n          }\r\n\r\n          input[type=\"checkbox\"]:checked ~ span::after {\r\n            color: ${colors.red};\r\n          }\r\n\r\n          span {\r\n            margin-left: 4rem;\r\n            text-align: left;\r\n\r\n            &::after {\r\n              align-items: center;\r\n              background-color: rgb(255, 255, 255);\r\n              content: \"\\f00c\";\r\n              color: transparent;\r\n              display: inline-flex;\r\n              font-family: FontAwesome;\r\n              height: 3rem;\r\n              justify-content: center;\r\n              left: 0px;\r\n              position: absolute;\r\n              top: 50%;\r\n              transform: translateY(-59%);\r\n              width: 3rem;\r\n            }\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    &__submit {\r\n      padding-top: 3rem;\r\n      display: flex;\r\n      justify-content: center;\r\n      font-size: 2.4rem;\r\n\r\n      .btn-primary {\r\n        font-weight: 300;\r\n      }\r\n    }\r\n\r\n    .field {\r\n      input,\r\n      textarea {\r\n        font-size: 1.6rem;\r\n        outline: none;\r\n        padding: 1.5rem 1.5rem;\r\n\r\n        &.contact__form__input--red {\r\n          color: ${colors.red};\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\n","import styled from \"styled-components\";\r\nimport { grid, bp } from \"../abstract/variables\";\r\n\r\nexport const StyledGrid = styled.div`\r\n  .row {\r\n    max-width: ${grid.width};\r\n    margin: 0 auto;\r\n\r\n    &:not(:last-child) {\r\n      margin-bottom: ${grid.gutterVertical};\r\n\r\n      @media (max-width: ${bp.mobile}) {\r\n        margin-bottom: 0;\r\n      }\r\n    }\r\n\r\n    &::after {\r\n      content: \"\";\r\n      display: table;\r\n      clear: both;\r\n    }\r\n\r\n    [class^=\"col-\"] {\r\n      float: left;\r\n\r\n      &:not(:last-child) {\r\n        margin-right: ${grid.gutterHorizontal};\r\n      }\r\n    }\r\n\r\n    .col-1-of-2 {\r\n      width: calc((100% - ${grid.gutterHorizontal}) / 2);\r\n      float: left;\r\n\r\n      &:not(:last-child) {\r\n        margin-right: ${grid.gutterHorizontal} - 0.1rem;\r\n      }\r\n\r\n      @media (max-width: ${bp.mobile}) {\r\n        width: 100% !important;\r\n        margin-bottom: 1.5rem;\r\n      }\r\n    }\r\n  }\r\n`;\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../abstract/variables\";\r\n\r\nexport const StyledButtonPrimay = styled.div`\r\n  .btn-primary,\r\n  .btn-primary:link,\r\n  .btn-primary:visited,\r\n  .ui.button.btn-primary,\r\n  .ui.button.btn-primary:link,\r\n  .ui.button.btn-primary:visited {\r\n    background-color: ${colors.red};\r\n    color: ${colors.white};\r\n    cursor: pointer;\r\n    border: none;\r\n    font-size: 1.8rem;\r\n    border-radius: 0.6rem;\r\n    display: inline-block;\r\n    font-size: inherit;\r\n    font-family: inherit;\r\n    padding: 1.5rem 2.5rem;\r\n    text-decoration: none;\r\n    transition: all 0.3s;\r\n    text-align: center;\r\n    font-weight: 300;\r\n\r\n    &:hover {\r\n      background-color: ${colors.red};\r\n      color: ${colors.white};\r\n    }\r\n  }\r\n`;\r\n","/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport React, { useState, useRef } from \"react\";\r\nimport { Form, Button } from \"semantic-ui-react\";\r\nimport Machinery from \"../../../models/Machinery\";\r\nimport FormValues from \"../../../models/FormValues\";\r\nimport { Form as FinalForm, Field } from \"react-final-form\";\r\nimport { TextInput } from \"../Form/TextInput/TextInput\";\r\nimport { TextAreaInput } from \"../Form/TextAreaInput/TextAreaInput\";\r\nimport agent from \"../../../api/agent\";\r\nimport { LoadingComponent } from \"../../layouts/LoadingComponent/LoadingComponent\";\r\nimport { dialogBox } from \"../../../services/DialogBox\";\r\nimport { FormApi } from \"final-form\";\r\nimport { combineValidators, isRequired } from \"revalidate\";\r\nimport ReCAPTCHA from \"react-google-recaptcha\";\r\nimport { StyledContact } from \"./StyledContact\";\r\nimport { StyledGrid } from \"../../../styles/components/StyledGrid\";\r\nimport { StyledButtonPrimay } from \"../../../styles/components/StyledButton\";\r\n\r\ninterface Props {\r\n  machinery: Machinery;\r\n}\r\n\r\ninterface Values {\r\n  machinery: Machinery;\r\n  machineryType: string;\r\n  machineryTitle: string;\r\n  firstName: string;\r\n  lastName: string;\r\n  emailAddress: string;\r\n  contactNumber: string;\r\n  companyName: string;\r\n  state: string;\r\n  message?: string;\r\n  hasRead: boolean;\r\n}\r\n\r\nconst validate = combineValidators({\r\n  firstName: isRequired({ message: \"First name is required\" }),\r\n  lastName: isRequired({ message: \"Last name is required\" }),\r\n  emailAddress: isRequired({ message: \"Email address is required\" }),\r\n  contactNumber: isRequired({ message: \"Contact number is required\" }),\r\n  companyName: isRequired({ message: \"Company name is required\" }),\r\n  state: isRequired({ message: \"State is required\" }),\r\n  hasRead: isRequired(\"Has read\"),\r\n});\r\n\r\nexport const ContactUs: React.FC<Props> = ({ machinery }) => {\r\n  const [submitting, setSubmitting] = useState(false);\r\n  const [isNotRobot, setIsNotRobot] = useState(false);\r\n\r\n  const fieldList: any = [\r\n    \"firstName\",\r\n    \"lastName\",\r\n    \"emailAddress\",\r\n    \"contactNumber\",\r\n    \"companyName\",\r\n    \"state\",\r\n    \"hasRead\",\r\n  ];\r\n\r\n  const recaptchaRef: any = useRef();\r\n  const recaptchaCheckbox: any = useRef();\r\n\r\n  const recaptchaOnChange = async () => {\r\n    const token = await recaptchaRef.current?.executeAsync();\r\n\r\n    if (token) {\r\n      setIsNotRobot(true);\r\n    }\r\n  };\r\n\r\n  const handleFinalFormSubmit = (values: Values, form: FormApi<Values, Partial<Values>>) => {\r\n    const { machinery, ...otherValues } = values;\r\n    const submitValues: FormValues = {\r\n      machineryType: `${machinery.brand.name} / ${machinery.category}`,\r\n      machineryTitle: machinery.fullName,\r\n      firstName: otherValues.firstName,\r\n      lastName: otherValues.lastName,\r\n      emailAddress: otherValues.emailAddress,\r\n      contactNumber: otherValues.contactNumber,\r\n      companyName: otherValues.companyName,\r\n      state: otherValues.state,\r\n      message: otherValues.message,\r\n      hasRead: otherValues.hasRead,\r\n    };\r\n\r\n    setSubmitting(true);\r\n    agent.Enquiries.sendEnquiry(submitValues)\r\n      .then(() => {\r\n        setSubmitting(false);\r\n        dialogBox.info(\r\n          \"Submit Complete\",\r\n          \"Your message has been sent successfully. We will contact you shortly.\",\r\n          () => {\r\n            setTimeout(form.reset);\r\n            for (let i = 0; i < fieldList.length; i++) {\r\n              const field = fieldList[i];\r\n              form.resetFieldState(field);\r\n            }\r\n            recaptchaRef.current.reset();\r\n            setIsNotRobot(false);\r\n          },\r\n        );\r\n      })\r\n      .catch((error) => {\r\n        setSubmitting(false);\r\n        dialogBox.info(\"Submit Faild\", JSON.stringify(error.response.data.errors), () => undefined);\r\n        console.log(error.response);\r\n      });\r\n  };\r\n\r\n  return (\r\n    <StyledContact>\r\n      {submitting && <LoadingComponent />}\r\n      <div id=\"contact-form\" className=\"contact__form\">\r\n        <div className=\"container\">\r\n          <div className=\"contact__form__title\">Contact Us</div>\r\n          <FinalForm\r\n            validate={validate}\r\n            initialValues={{ machinery }}\r\n            onSubmit={handleFinalFormSubmit}\r\n            render={({ handleSubmit, invalid, pristine }) => (\r\n              <Form onSubmit={handleSubmit}>\r\n                <StyledGrid>\r\n                  <div className=\"row\">\r\n                    <div className=\"col-1-of-2\">\r\n                      <Field name=\"machineryType\" component=\"input\">\r\n                        {() => (\r\n                          <Form.Field>\r\n                            <input\r\n                              className=\"contact__form__input--red\"\r\n                              placeholder=\"Machinery Type\"\r\n                              readOnly\r\n                              value={`${machinery.brand.name.toUpperCase()} / ${machinery.category.toUpperCase()}`}\r\n                            />\r\n                          </Form.Field>\r\n                        )}\r\n                      </Field>\r\n                    </div>\r\n                    <div className=\"col-1-of-2\">\r\n                      <Field name=\"machineryTitle\" component=\"input\">\r\n                        {() => (\r\n                          <Form.Field>\r\n                            <input\r\n                              className=\"contact__form__input--red\"\r\n                              placeholder=\"Machinery Title\"\r\n                              readOnly\r\n                              value={machinery.fullName.toUpperCase()}\r\n                            />\r\n                          </Form.Field>\r\n                        )}\r\n                      </Field>\r\n                    </div>\r\n                  </div>\r\n                  <div className=\"contact__form__info\">\r\n                    <span>Fields marked with * are mandatory.</span>\r\n                  </div>\r\n                  <div className=\"row\">\r\n                    <div className=\"col-1-of-2\">\r\n                      <Field name=\"firstName\" placeholder=\"First name*\" component={TextInput} />\r\n                    </div>\r\n                    <div className=\"col-1-of-2\">\r\n                      <Field name=\"lastName\" placeholder=\"Last name*\" component={TextInput} />\r\n                    </div>\r\n                  </div>\r\n                  <div className=\"row\">\r\n                    <div className=\"col-1-of-2\">\r\n                      <Field\r\n                        name=\"emailAddress\"\r\n                        placeholder=\"Email address*\"\r\n                        component={TextInput}\r\n                      />\r\n                    </div>\r\n                    <div className=\"col-1-of-2\">\r\n                      <Field\r\n                        name=\"contactNumber\"\r\n                        placeholder=\"Contact number*\"\r\n                        component={TextInput}\r\n                      />\r\n                    </div>\r\n                  </div>\r\n                  <div className=\"row\">\r\n                    <div className=\"col-1-of-2\">\r\n                      <Field name=\"companyName\" placeholder=\"Company name*\" component={TextInput} />\r\n                    </div>\r\n                    <div className=\"col-1-of-2\">\r\n                      <Field name=\"state\" placeholder=\"State*\" component={TextInput} />\r\n                    </div>\r\n                  </div>\r\n                  <Field name=\"message\" rows={3} placeholder=\"Message\" component={TextAreaInput} />\r\n                </StyledGrid>\r\n                <div className=\"contact__form__checkboxes\">\r\n                  <div className=\"checkbox\">\r\n                    <label className=\"checkbox__label\">\r\n                      <Field\r\n                        validate={(value) => (!value ? \"Please check\" : undefined)}\r\n                        name=\"hasRead\"\r\n                        component=\"input\"\r\n                        type=\"checkbox\"\r\n                      />\r\n                      <span>\r\n                        I have read and understand the{\" \"}\r\n                        <a\r\n                          target=\"_blank\"\r\n                          rel=\"noopener noreferrer\"\r\n                          href=\"http://leaseplusgroup.com.au/Privacy\"\r\n                        >\r\n                          privacy statement\r\n                        </a>{\" \"}\r\n                        and agree with its content.\r\n                      </span>\r\n                    </label>\r\n                  </div>\r\n                  <div className=\"checkbox\">\r\n                    <label className=\"checkbox__label\">\r\n                      <input\r\n                        type=\"checkbox\"\r\n                        checked={isNotRobot}\r\n                        disabled={isNotRobot}\r\n                        ref={recaptchaCheckbox}\r\n                        onChange={recaptchaOnChange}\r\n                      />\r\n                      <span>I am not a robot.</span>\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <ReCAPTCHA\r\n                  ref={recaptchaRef}\r\n                  size=\"invisible\"\r\n                  sitekey=\"6LfQt68ZAAAAABty6M2-uSJFFrDj3FQjDjmNpBIP\"\r\n                />\r\n                <div className=\"contact__form__submit\">\r\n                  <StyledButtonPrimay>\r\n                    <Button\r\n                      className=\"btn-primary\"\r\n                      disabled={submitting || invalid || pristine || !isNotRobot}\r\n                      type=\"submit\"\r\n                      content=\"Get a quote now\"\r\n                    />\r\n                  </StyledButtonPrimay>\r\n                </div>\r\n              </Form>\r\n            )}\r\n          />\r\n        </div>\r\n      </div>\r\n    </StyledContact>\r\n  );\r\n};\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\nimport { media } from \"../../../styles/base/media-queries\";\r\n\r\nexport const StyledMachineryPage = styled.div`\r\n  .machinery-page {\r\n    .breadcrumb {\r\n      ${media.mobile} {\r\n        display: none;\r\n      }\r\n    }\r\n\r\n    .u-display-mobile {\r\n      .back,\r\n      .back:link,\r\n      .back:visited {\r\n        display: block;\r\n        margin-top: 2rem;\r\n        margin-left: 4rem;\r\n        font-size: 1.8rem;\r\n        text-decoration: none;\r\n        color: ${colors.grey};\r\n      }\r\n\r\n      .fa-angle-left {\r\n        margin-right: 1rem;\r\n        font-weight: 800;\r\n      }\r\n\r\n      .title {\r\n        margin-left: 4rem;\r\n        color: ${colors.red};\r\n        max-width: 13ch;\r\n        overflow: hidden;\r\n        font-size: 3.6rem;\r\n        margin-top: 3rem;\r\n        line-height: 1.2;\r\n      }\r\n    }\r\n\r\n    .brand {\r\n      padding: 4rem;\r\n\r\n      ${media.mobile} {\r\n        padding: 4rem 2rem;\r\n      }\r\n\r\n      &__logo {\r\n        margin-bottom: 1.5rem;\r\n\r\n        img {\r\n          height: 4rem;\r\n        }\r\n      }\r\n\r\n      &__title {\r\n        margin-bottom: 1.5rem;\r\n      }\r\n    }\r\n\r\n    .description {\r\n      background-color: ${colors.grey2};\r\n      padding: 4rem 2rem;\r\n\r\n      &__quote {\r\n        font-size: 2.4rem;\r\n      }\r\n\r\n      &__details {\r\n        display: flex;\r\n        align-items: center;\r\n\r\n        ${media.ipad} {\r\n          flex-direction: column;\r\n        }\r\n\r\n        &__ipad {\r\n          display: none;\r\n\r\n          ${media.ipad} {\r\n            display: block;\r\n            margin-bottom: 1rem;\r\n          }\r\n\r\n          .subtitle,\r\n          .title {\r\n            font-size: 3.5rem;\r\n            font-weight: 500;\r\n\r\n            ${media.mobile} {\r\n              display: block;\r\n              margin-bottom: 2rem;\r\n              text-align: center;\r\n            }\r\n          }\r\n\r\n          .subtitle {\r\n            margin-right: 2rem;\r\n            color: ${colors.black};\r\n\r\n            ${media.mobile} {\r\n              margin-right: 0;\r\n            }\r\n          }\r\n\r\n          .title {\r\n            color: ${colors.red};\r\n          }\r\n        }\r\n      }\r\n\r\n      &__img {\r\n        display: inline-block;\r\n        width: 50%;\r\n        margin-right: 4rem;\r\n\r\n        ${media.ipad} {\r\n          width: 100%;\r\n          margin: 0 auto;\r\n          margin-bottom: 2rem;\r\n        }\r\n\r\n        &__img {\r\n          width: 100%;\r\n          object-fit: contain;\r\n          margin: 0 auto;\r\n          display: block;\r\n\r\n          ${media.mobile} {\r\n            width: 100%;\r\n          }\r\n        }\r\n      }\r\n\r\n      &__content {\r\n        display: flex;\r\n        flex-direction: column;\r\n        width: 50%;\r\n        align-items: flex-start;\r\n\r\n        ${media.ipad} {\r\n          width: auto;\r\n        }\r\n\r\n        &__subtitle {\r\n          font-weight: 500;\r\n          font-size: 2.4rem;\r\n\r\n          ${media.ipad} {\r\n            display: none;\r\n          }\r\n        }\r\n\r\n        &__title {\r\n          font-size: 3.6rem;\r\n          padding-top: 1.5rem;\r\n          padding-bottom: 4rem;\r\n          color: ${colors.red};\r\n\r\n          ${media.ipad} {\r\n            display: none;\r\n          }\r\n        }\r\n\r\n        &__details {\r\n          width: 100%;\r\n          padding-bottom: 4rem;\r\n        }\r\n\r\n        &__quote {\r\n          ${media.ipad} {\r\n            align-self: center;\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { Placeholder } from \"semantic-ui-react\";\r\n\r\nexport const MachineryPagePlaceholder = () => {\r\n  return (\r\n    <Placeholder style={{ minHeight: 600, marginTop: 60, marginBottom: 60 }} fluid>\r\n      <Placeholder.Header image />\r\n      <Placeholder.Paragraph>\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n      </Placeholder.Paragraph>\r\n      <Placeholder.Image />\r\n      <Placeholder.Paragraph>\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n        <Placeholder.Line />\r\n      </Placeholder.Paragraph>\r\n    </Placeholder>\r\n  );\r\n};\r\n","export const smoothScrollTo = (to: number, duration: number) => {\r\n  const element = document.scrollingElement || document.documentElement,\r\n    start = element.scrollTop,\r\n    change = to - start,\r\n    startDate = +new Date();\r\n\r\n  // t = current time\r\n  // b = start value\r\n  // c = change in value\r\n  // d = duration\r\n  const easeInOutQuad = (t: number, b: number, c: number, d: number) => {\r\n    t /= d / 2;\r\n    if (t < 1) return (c / 2) * t * t + b;\r\n    t--;\r\n    return (-c / 2) * (t * (t - 2) - 1) + b;\r\n  };\r\n\r\n  const animateScroll = () => {\r\n    const currentDate = +new Date();\r\n    const currentTime = currentDate - startDate;\r\n    element.scrollTop = easeInOutQuad(currentTime, start, change, duration);\r\n    if (currentTime < duration) {\r\n      requestAnimationFrame(animateScroll);\r\n    } else {\r\n      element.scrollTop = to;\r\n    }\r\n  };\r\n  animateScroll();\r\n};\r\n\r\nexport const supportsNativeSmoothScroll = \"scrollBehavior\" in document.documentElement.style;\r\n","import styled from \"styled-components\";\r\nimport { media } from \"../../../styles/base/media-queries\";\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\nimport \"slick-carousel/slick/slick.css\";\r\nimport \"slick-carousel/slick/slick-theme.css\";\r\n\r\nexport const StyledMachineryPageDetails = styled.div`\r\n  .details {\r\n    &__container {\r\n      padding: 0 2rem 4rem 2rem;\r\n\r\n      ${media.mobile} {\r\n        padding: 0 0 4rem 0;\r\n      }\r\n    }\r\n    &__slick {\r\n      &__nav {\r\n        padding: 2rem;\r\n        text-align: center;\r\n\r\n        ${media.mobile} {\r\n          padding: 2rem 0;\r\n          font-weight: 500;\r\n        }\r\n\r\n        .slick-current {\r\n          .details__slick__nav__item {\r\n            text-decoration: underline;\r\n          }\r\n        }\r\n\r\n        .slick-slide {\r\n          display: inline-block !important;\r\n          padding: 0 !important;\r\n          margin: auto !important;\r\n          width: auto !important;\r\n          float: none;\r\n\r\n          div:first-of-type {\r\n            display: inline-block;\r\n            width: auto;\r\n          }\r\n\r\n          &:after {\r\n            display: inline-block;\r\n            content: \"*\";\r\n          }\r\n\r\n          &:last-of-type:after {\r\n            display: none;\r\n          }\r\n        }\r\n        &__item {\r\n          font-size: 1.8rem;\r\n          cursor: pointer;\r\n          border: transparent;\r\n          text-transform: uppercase;\r\n          padding: 1rem 4rem;\r\n\r\n          &:focus {\r\n            outline: none;\r\n          }\r\n        }\r\n      }\r\n\r\n      &__content {\r\n        padding: 1rem;\r\n\r\n        .slick-list {\r\n          transition: all 0.2s;\r\n        }\r\n        &__item {\r\n          &:focus {\r\n            outline: none;\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    &__features {\r\n      &__title {\r\n        text-align: center;\r\n        text-transform: uppercase;\r\n        color: ${colors.red};\r\n        font-size: 3.2rem;\r\n        font-weight: 300;\r\n        margin: 4rem;\r\n      }\r\n      ul {\r\n        padding-left: 4rem;\r\n        list-style: none;\r\n\r\n        li {\r\n          margin-bottom: 1rem;\r\n          position: relative;\r\n\r\n          &::before {\r\n            content: \"*\";\r\n            position: absolute;\r\n            left: -1.5rem;\r\n            top: 3px;\r\n          }\r\n        }\r\n      }\r\n\r\n      &__items {\r\n        max-width: 99rem;\r\n        margin: 0 auto;\r\n      }\r\n\r\n      &__item {\r\n        &.col-1-of-2 {\r\n          ${media.mobile} {\r\n            margin-bottom: 0;\r\n          }\r\n        }\r\n\r\n        &__title {\r\n          font-size: 1.8rem;\r\n          font-weight: 500;\r\n          color: #6d6e70;\r\n          font-style: italic;\r\n          margin-bottom: 2rem;\r\n        }\r\n      }\r\n    }\r\n\r\n    &__addInfo {\r\n      &__title {\r\n        font-size: 2rem;\r\n        font-weight: 300;\r\n        font-style: italic;\r\n        color: #be1e2d;\r\n      }\r\n\r\n      &__subtitle {\r\n        font-size: 2rem;\r\n        font-weight: 300;\r\n        font-style: italic;\r\n        margin: 1rem 0;\r\n      }\r\n\r\n      &__descriptions {\r\n        margin-top: 0;\r\n        margin-bottom: 1rem;\r\n      }\r\n    }\r\n\r\n    &__videos {\r\n      display: flex;\r\n      justify-content: center;\r\n      align-items: center;\r\n      flex-direction: column;\r\n\r\n      iframe {\r\n        height: 50rem;\r\n        width: 100rem;\r\n\r\n        ${media.ipad} {\r\n          width: 80%;\r\n        }\r\n\r\n        ${media.mobile} {\r\n          width: 90%;\r\n        }\r\n      }\r\n\r\n      &__additional {\r\n        width: 80%;\r\n        max-width: 50rem;\r\n\r\n        &__links {\r\n          .buttons {\r\n            margin-bottom: 4rem;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: space-between;\r\n\r\n            ${media.mobile} {\r\n              flex-direction: column;\r\n            }\r\n          }\r\n\r\n          .ui.button {\r\n            background-color: ${colors.red};\r\n            color: ${colors.white};\r\n            display: block;\r\n\r\n            ${media.mobile} {\r\n              &:not(:last-child) {\r\n                margin-bottom: 1rem;\r\n              }\r\n            }\r\n\r\n            &:hover,\r\n            &.active {\r\n              color: ${colors.white};\r\n              background-color: #630312;\r\n            }\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    table {\r\n      background-color: #fafafa;\r\n      margin: 0 auto;\r\n      border-collapse: collapse;\r\n\r\n      th {\r\n        color: black;\r\n        font-weight: 500;\r\n        text-align: start;\r\n      }\r\n\r\n      tr {\r\n        padding: 1rem;\r\n\r\n        td {\r\n          padding: 0.5rem;\r\n          min-width: auto;\r\n          min-width: unset;\r\n          max-width: auto;\r\n          max-width: unset;\r\n          width: 50rem;\r\n          font-size: 1.5rem;\r\n\r\n          @media only screen and (max-width: 1000px) {\r\n            min-width: auto;\r\n            min-width: unset;\r\n          }\r\n\r\n          hr {\r\n            margin: 5px 0 7px 0;\r\n          }\r\n        }\r\n\r\n        th {\r\n          padding: 1rem;\r\n          font-size: 1.5em;\r\n        }\r\n      }\r\n\r\n      tr:nth-child(even) {\r\n        background-color: ${colors.grey2};\r\n\r\n        td {\r\n          color: black;\r\n\r\n          hr {\r\n            border-color: black;\r\n          }\r\n        }\r\n      }\r\n\r\n      tr:first-child {\r\n        background-color: white;\r\n      }\r\n\r\n      tr:last-child,\r\n      tr:first-child {\r\n        border-bottom: 3px solid #a6a6a6;\r\n        border-top: none;\r\n      }\r\n\r\n      td {\r\n        border-bottom: 1px solid #86888c;\r\n        border-top: none;\r\n      }\r\n\r\n      hr {\r\n        border-top: 1px solid black;\r\n      }\r\n    }\r\n\r\n    table td,\r\n    table th {\r\n      padding: 0.5rem;\r\n    }\r\n\r\n    table tr th {\r\n      padding: 0.5rem;\r\n      font-size: 1em;\r\n    }\r\n\r\n    .table-cnc {\r\n      tr td {\r\n        min-width: 32rem;\r\n\r\n        @media only screen and (max-width: 1000px) {\r\n          min-width: 20rem;\r\n        }\r\n\r\n        @media only screen and (max-width: 700px) {\r\n          min-width: auto;\r\n          min-width: unset;\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\n","/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport React, { useState } from \"react\";\r\nimport Machinery from \"../../../models/Machinery\";\r\nimport Slider from \"react-slick\";\r\nimport { StyledGrid } from \"../../../styles/components/StyledGrid\";\r\nimport { StyledMachineryPageDetails } from \"./StyledMachineryPageDetails\";\r\nimport { Button } from \"semantic-ui-react\";\r\n\r\ninterface Props {\r\n  machinery: Machinery;\r\n}\r\n\r\nexport const MachineryPageDetails: React.FC<Props> = ({ machinery }) => {\r\n  const [nav1, setNav1] = useState();\r\n  const [nav2, setNav2] = useState();\r\n  const [videoCurrentUrl, setVideoCurrentUrl] = useState<string>();\r\n  const [activeButtonNumber, setActiveButtonNumber] = useState<number>();\r\n\r\n  const additionalVideosUrls = machinery.additionalVideos;\r\n\r\n  const onAdditionalVideoLinkClick = (index: number) => {\r\n    setVideoCurrentUrl(additionalVideosUrls[index]);\r\n    setActiveButtonNumber(index);\r\n  };\r\n\r\n  const settingsSliderNav = {\r\n    slidesToShow: machinery.additionalInfo.title ? 4 : 3,\r\n    slidesToScroll: 1,\r\n    arrows: false,\r\n    focusOnSelect: true,\r\n  };\r\n\r\n  const settingsSliderContent = {\r\n    slidesToShow: 1,\r\n    slidesToScroll: 1,\r\n    arrows: false,\r\n    adaptiveHeight: true,\r\n  };\r\n\r\n  return (\r\n    <StyledMachineryPageDetails>\r\n      <section className=\"details\">\r\n        <div className=\"container\">\r\n          <Slider\r\n            {...settingsSliderNav}\r\n            asNavFor={nav2}\r\n            ref={(slider1: any) => setNav1(slider1)}\r\n            className=\"details__slick__nav\"\r\n          >\r\n            <div className=\"details__slick__nav__item\">Key features</div>\r\n            <div className=\"details__slick__nav__item\">Specifications</div>\r\n            {machinery.additionalInfo.title && (\r\n              <div className=\"details__slick__nav__item\">Additional Info</div>\r\n            )}\r\n            <div className=\"details__slick__nav__item\">Video</div>\r\n          </Slider>\r\n        </div>\r\n        <div className=\"details__container\">\r\n          <Slider\r\n            asNavFor={nav1}\r\n            ref={(slider2: any) => setNav2(slider2)}\r\n            className=\"details__slick__content\"\r\n            {...settingsSliderContent}\r\n          >\r\n            <div className=\"details__features details__slick__content__item\">\r\n              <div className=\"details__features__title\">Key Features</div>\r\n              {machinery.featuresOne.length > 1 || machinery.featuresTwo.length > 1 ? (\r\n                <StyledGrid>\r\n                  <div className=\"row\">\r\n                    <div className=\"details__features__items\">\r\n                      <div className=\"details__features__item col-1-of-2\">\r\n                        {machinery.featuresTitles[0] && (\r\n                          <div className=\"details__features__item__title\">\r\n                            {machinery.featuresTitles[0]}\r\n                          </div>\r\n                        )}\r\n                        <ul>\r\n                          {machinery.featuresOne.map((f, i) => (\r\n                            <li key={i}>{f}</li>\r\n                          ))}\r\n                        </ul>\r\n                      </div>\r\n                      <div className=\"details__features__item col-1-of-2\">\r\n                        {machinery.featuresTitles[0] && (\r\n                          <div className=\"details__features__item__title\">\r\n                            {machinery.featuresTitles[1]}\r\n                          </div>\r\n                        )}\r\n                        <ul>\r\n                          {machinery.featuresTwo.map((f, i) => (\r\n                            <li key={i}>{f}</li>\r\n                          ))}\r\n                        </ul>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </StyledGrid>\r\n              ) : (\r\n                <div style={{ textAlign: \"center\" }}>Coming soon!</div>\r\n              )}\r\n            </div>\r\n            <div className=\"details__tables details__slick__content__item\">\r\n              <div className=\"details__features__title\">Specifications</div>\r\n              <div className=\"container\">\r\n                <div dangerouslySetInnerHTML={{ __html: machinery.specificationsTable }}></div>\r\n              </div>\r\n            </div>\r\n            {machinery.additionalInfo.title && (\r\n              <div className=\"details__addInfo details__slick__content__item\">\r\n                <div className=\"container\">\r\n                  <div className=\"details__features__title\">Additional Info</div>\r\n\r\n                  <div className=\"details__addInfo__title\">{machinery.additionalInfo.title}</div>\r\n                  <div className=\"details__addInfo__subtitle\">\r\n                    {machinery.additionalInfo.subTitle}\r\n                  </div>\r\n                  <div className=\"details__addInfo__descriptions\">\r\n                    {machinery.additionalInfo.descriptions.map((d, i) => (\r\n                      <p key={i}>{d}</p>\r\n                    ))}\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            )}\r\n            <div className=\"details__slick__content__item\">\r\n              <div className=\"details__features__title\">Video</div>\r\n              <div className=\"details__videos\">\r\n                {machinery.additionalVideos.length > 0 && (\r\n                  <div className=\"details__videos__additional\">\r\n                    <div className=\"details__videos__additional__links\">\r\n                      <Button.Group size=\"large\">\r\n                        {machinery.additionalVideosTitles.map((t, index) => (\r\n                          <Button\r\n                            content={t}\r\n                            icon=\"play\"\r\n                            labelPosition=\"right\"\r\n                            onClick={() => onAdditionalVideoLinkClick(index)}\r\n                            key={index}\r\n                            active={index === activeButtonNumber}\r\n                            className=\"link\"\r\n                          ></Button>\r\n                        ))}\r\n                      </Button.Group>\r\n                    </div>\r\n                  </div>\r\n                )}\r\n                {machinery.videoUrl ? (\r\n                  <iframe\r\n                    title={machinery.fullName}\r\n                    src={videoCurrentUrl ? videoCurrentUrl : machinery.videoUrl}\r\n                    frameBorder=\"0\"\r\n                    allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\"\r\n                    allowFullScreen\r\n                  ></iframe>\r\n                ) : (\r\n                  <div style={{ textAlign: \"center\" }}>Coming soon!</div>\r\n                )}\r\n              </div>\r\n            </div>\r\n          </Slider>\r\n        </div>\r\n      </section>\r\n    </StyledMachineryPageDetails>\r\n  );\r\n};\r\n","import React, { useState, useEffect, Fragment, useRef } from \"react\";\r\nimport { RouteComponentProps, Link } from \"react-router-dom\";\r\nimport Machinery from \"../../../models/Machinery\";\r\nimport agent from \"../../../api/agent\";\r\nimport { ContactUs } from \"../../common/ContactUs/ContactUs\";\r\nimport { StyledBreadcrumb } from \"../../../styles/components/StyledBreadcrumb\";\r\nimport { StyledMachineryPage } from \"./StyledMachineryPage\";\r\nimport { StyledButtonPrimay } from \"../../../styles/components/StyledButton\";\r\nimport { MachineryPagePlaceholder } from \"../../common/MachineryPagePlaceholder/MachineryPagePlaceholder\";\r\nimport { DisplayMobile } from \"../../../styles/base/utilities\";\r\nimport { smoothScrollTo, supportsNativeSmoothScroll } from \"../../../services/SmoothScrollTo\";\r\nimport { MachineryPageDetails } from \"./MachineryPageDetails\";\r\n\r\ninterface Params {\r\n  machineryName: string;\r\n}\r\n\r\nexport const MachineryPage: React.FC<RouteComponentProps<Params>> = ({ match, history }) => {\r\n  const [machinery, setMachinery] = useState<Machinery>();\r\n  const [loading, setLoading] = useState(true);\r\n\r\n  const contactRef = useRef() as React.MutableRefObject<HTMLDivElement>;\r\n\r\n  const scrollToContact = () => {\r\n    if (supportsNativeSmoothScroll && contactRef.current) {\r\n      window.scrollTo({\r\n        behavior: \"smooth\",\r\n        top: contactRef.current.offsetTop,\r\n      });\r\n    } else if (contactRef) {\r\n      smoothScrollTo(contactRef.current.offsetTop, 200);\r\n    } else {\r\n      window.location.hash = \"#contact-form\";\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    setLoading(true);\r\n    agent.Machineries.machinery(match.params.machineryName)\r\n      .then((response) => {\r\n        setMachinery(response);\r\n      })\r\n      .then(() => setLoading(false))\r\n      .catch(() => history.push(\"/notfound\"));\r\n  }, [match, history]);\r\n\r\n  return (\r\n    <StyledMachineryPage>\r\n      <div className=\"machinery-page\">\r\n        {loading && !machinery ? (\r\n          <div className=\"container\">\r\n            <MachineryPagePlaceholder />\r\n          </div>\r\n        ) : (\r\n          machinery && (\r\n            <Fragment>\r\n              <StyledBreadcrumb>\r\n                <div className=\"breadcrumb\">\r\n                  <div className=\"container\">\r\n                    <Link to={\"/\"} className=\"breadcrumb__item\">\r\n                      Home\r\n                    </Link>\r\n                    {machinery.subCategory.toLowerCase() !== machinery.type.toLowerCase() && (\r\n                      <Link\r\n                        to={`/machinery/${machinery.subCategory.replace(/\\s/g, \"\")}`}\r\n                        className=\"breadcrumb__item\"\r\n                      >\r\n                        {machinery.subCategory}\r\n                      </Link>\r\n                    )}\r\n                    <div className=\"breadcrumb__item active\">{machinery.type}</div>\r\n                  </div>\r\n                </div>\r\n              </StyledBreadcrumb>\r\n\r\n              <DisplayMobile>\r\n                <div className=\"u-display-mobile\">\r\n                  <Link\r\n                    to={`/machinery/${machinery.subCategory.replace(/\\s/g, \"\")}`}\r\n                    className=\"back\"\r\n                  >\r\n                    <i className=\"fa fa-angle-left\" aria-hidden=\"true\"></i> Back\r\n                  </Link>\r\n                  <div className=\"title\">{machinery.fullName}</div>\r\n                </div>\r\n              </DisplayMobile>\r\n\r\n              <section className=\"brand\">\r\n                <div className=\"container\">\r\n                  <div className=\"brand__logo\">\r\n                    <img src={machinery.brand.imageUrl} alt={machinery.brand.name} />\r\n                  </div>\r\n                  <div className=\"brand__title\">\r\n                    {machinery.brand.name.toUpperCase()} / {machinery.category.toUpperCase()}\r\n                  </div>\r\n                  <div className=\"brand__description\">\r\n                    {machinery.brand.descriptions.map((d, i) => (\r\n                      <p key={i}>{d}</p>\r\n                    ))}\r\n                  </div>\r\n                </div>\r\n              </section>\r\n\r\n              <section className=\"description\">\r\n                <div className=\"container\">\r\n                  <div className=\"description__details\">\r\n                    <div className=\"description__details__ipad\">\r\n                      {machinery.subTitle && <span className=\"subtitle\">{machinery.subTitle}</span>}\r\n                      <span className=\"title\">{machinery.title}</span>\r\n                    </div>\r\n                    <div className=\"description__img\">\r\n                      <img\r\n                        className=\"description__img__img\"\r\n                        src={machinery.imageUrl}\r\n                        alt={machinery.fullName}\r\n                      />\r\n                    </div>\r\n                    <div className=\"description__content\">\r\n                      {machinery.subTitle && (\r\n                        <div className=\"description__content__subtitle\">{machinery.subTitle}</div>\r\n                      )}\r\n                      <div className=\"description__content__title\">{machinery.title}</div>\r\n                      <div className=\"description__content__details\">\r\n                        {machinery.details.map((d, i) => (\r\n                          <p key={i}>{d}</p>\r\n                        ))}\r\n                      </div>\r\n                      <div className=\"description__content__quote\">\r\n                        <StyledButtonPrimay onClick={scrollToContact}>\r\n                          <button className=\"btn-primary description__quote\">\r\n                            Get a quote now\r\n                          </button>\r\n                        </StyledButtonPrimay>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </section>\r\n\r\n              <MachineryPageDetails machinery={machinery}></MachineryPageDetails>\r\n\r\n              <section ref={contactRef} className=\"contact\">\r\n                <ContactUs machinery={machinery!} />\r\n              </section>\r\n            </Fragment>\r\n          )\r\n        )}\r\n      </div>\r\n    </StyledMachineryPage>\r\n  );\r\n};\r\n","import React from \"react\";\r\nimport { Segment, Button, Header, Icon } from \"semantic-ui-react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { StyledButtonPrimay } from \"../../../styles/components/StyledButton\";\r\n\r\nconst NotFound = () => {\r\n  return (\r\n    <Segment style={{ minHeight: 500, backgroundColor: \"white\", fontSize: 15 }} placeholder>\r\n      <Header icon>\r\n        <Icon name=\"search\" />\r\n        Oops - we&apos;ve looked everywhere but couldn&apos;t find this.\r\n      </Header>\r\n      <Segment.Inline>\r\n        <StyledButtonPrimay>\r\n          <Button className=\"btn-primary\" as={Link} to=\"/\">\r\n            Home page\r\n          </Button>\r\n        </StyledButtonPrimay>\r\n      </Segment.Inline>\r\n    </Segment>\r\n  );\r\n};\r\n\r\nexport default NotFound;\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\nimport { media } from \"../../../styles/base/media-queries\";\r\n\r\nexport const StyledFooter = styled.div`\r\n  .footer {\r\n    color: ${colors.white};\r\n    background-color: #2e2f31;\r\n    padding: 5rem 1rem;\r\n    font-size: 1.4rem;\r\n\r\n    ${media.ipad} {\r\n      position: relative;\r\n    }\r\n\r\n    ${media.mobile} {\r\n      padding-bottom: 8rem;\r\n    }\r\n\r\n    a {\r\n      color: ${colors.white};\r\n\r\n      &:hover {\r\n        color: ${colors.white};\r\n      }\r\n    }\r\n\r\n    &__items {\r\n      display: flex;\r\n      justify-content: space-between;\r\n      padding-bottom: 2rem;\r\n      border-bottom: 1px solid white;\r\n      align-items: flex-end;\r\n\r\n      ${media.mobile} {\r\n        flex-wrap: wrap;\r\n      }\r\n\r\n      img {\r\n        max-width: 4rem;\r\n      }\r\n    }\r\n\r\n    &__item {\r\n      ${media.mobile} {\r\n        margin: 0 1rem 1.5rem 1rem;\r\n      }\r\n      a,\r\n      b,\r\n      p {\r\n        display: block;\r\n        margin-bottom: 0.5rem;\r\n        span {\r\n          margin-bottom: 0.5rem;\r\n          display: block;\r\n        }\r\n      }\r\n      p {\r\n        b {\r\n          margin-right: 1rem;\r\n          margin-bottom: 0.5rem;\r\n        }\r\n      }\r\n\r\n      &__contact {\r\n        a,\r\n        b {\r\n          display: inline-block;\r\n        }\r\n      }\r\n    }\r\n\r\n    .social {\r\n      ${media.ipad} {\r\n        position: absolute;\r\n        right: 10rem;\r\n        bottom: 3rem;\r\n      }\r\n\r\n      ${media.medium} {\r\n        right: 6rem;\r\n      }\r\n\r\n      ${media.small} {\r\n        right: 3rem;\r\n      }\r\n\r\n      ${media.mobile} {\r\n        bottom: 0;\r\n        right: 50%;\r\n        transform: translateX(50%);\r\n      }\r\n\r\n      &__items {\r\n        display: flex;\r\n        align-items: flex-end;\r\n\r\n        a {\r\n          display: inline-block;\r\n          margin-left: 0.5rem;\r\n        }\r\n      }\r\n    }\r\n\r\n    &__copyright {\r\n      margin-top: 2rem;\r\n\r\n      ${media.mobile} {\r\n        text-align: center;\r\n      }\r\n\r\n      a {\r\n        display: inline-block;\r\n        &::before {\r\n          content: \"|\";\r\n          margin: 0 2rem;\r\n        }\r\n      }\r\n\r\n      .social {\r\n        ${media.ipad} {\r\n          display: block;\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { StyledFooter } from \"./StyledFooter\";\r\nimport { Link } from \"react-router-dom\";\r\n\r\nexport const Footer = () => {\r\n  return (\r\n    <StyledFooter>\r\n      <footer>\r\n        <div className=\"footer\">\r\n          <div className=\"container\">\r\n            <div className=\"footer__items\">\r\n              <div className=\"footer__item\">\r\n                <b>Showroom</b>\r\n                <p>\r\n                  <span>13 Beach Avenue</span>\r\n                  <span>Mordialloc, 3195, VIC</span>\r\n                </p>\r\n              </div>\r\n              <div className=\"footer__item\">\r\n                <b>Via Mail</b>\r\n                <p>\r\n                  <span>PO Box 7066 St Kilda Rd</span>\r\n                  <span>Melbourne Victoria 3004</span>\r\n                </p>\r\n              </div>\r\n              <div className=\"footer__item footer__item__contact\">\r\n                <p>\r\n                  <b>P</b>1300 072 403\r\n                  <br />\r\n                  <b>E</b>\r\n                  <a href=\"mailto:enquiries@ausmach.com.au\">enquiries@ausmach.com.au</a>\r\n                </p>\r\n              </div>\r\n              <div className=\"footer__item social\">\r\n                <div className=\"social__items\">\r\n                  <a\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    href=\"https://www.facebook.com/AUSMACH/\"\r\n                  >\r\n                    <img src=\"/images/icons/facebook-icon-new.png\" alt=\"fb icon\" />\r\n                  </a>\r\n                  <a\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    href=\"https://www.linkedin.com/company/16238823/\"\r\n                  >\r\n                    <img src=\"/images/icons/LinkedIn-icon-new.png\" alt=\"linkedin icon\" />\r\n                  </a>\r\n                  <a\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    href=\"https://twitter.com/AUSMACHAUS\"\r\n                  >\r\n                    <img src=\"/images/icons/Twitter-icon-new.png\" alt=\"twitter icon\" />\r\n                  </a>\r\n                  <a\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    href=\"https://www.instagram.com/ausmachaus/\"\r\n                  >\r\n                    <img src=\"/images/icons/Instagram-icon-new.png\" alt=\"ins icon\" />\r\n                  </a>\r\n                  <a\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    href=\"https://www.youtube.com/channel/UCWk-WO7yLl0Wk81746wdOwA\"\r\n                  >\r\n                    <img src=\"/images/icons/Youtube-icon-new.png\" alt=\"youtube icon\" />\r\n                  </a>\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            <div className=\"footer__copyright\">\r\n              <div className=\"footer__copyright__content\">\r\n                <span>&copy; {new Date().getFullYear()} AUSMACH</span>\r\n                <a\r\n                  target=\"_blank\"\r\n                  rel=\"noopener noreferrer\"\r\n                  href=\"http://blog.leaseplusgroup.com.au/careers/\"\r\n                >\r\n                  Careers\r\n                </a>\r\n                <a\r\n                  target=\"_blank\"\r\n                  rel=\"noopener noreferrer\"\r\n                  href=\"http://leaseplusgroup.com.au/Privacy\"\r\n                >\r\n                  Privacy Policy\r\n                </a>\r\n                <Link to=\"/DisclaimerAndLegal\">Disclaimer &amp; Legal</Link>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </footer>\r\n    </StyledFooter>\r\n  );\r\n};\r\n","import { useEffect } from \"react\";\r\nimport { withRouter, RouteComponentProps } from \"react-router-dom\";\r\n\r\nconst ScrollToTop = ({ history }: RouteComponentProps) => {\r\n  useEffect(() => {\r\n    const unlisten = history.listen(() => {\r\n      window.scrollTo(0, 0);\r\n    });\r\n    return () => {\r\n      unlisten();\r\n    };\r\n  }, [history]);\r\n\r\n  return null;\r\n};\r\n\r\nexport default withRouter(ScrollToTop);\r\n","import styled from \"styled-components\";\r\nimport { colors } from \"../../../styles/abstract/variables\";\r\n\r\nexport const StyledDisclaimer = styled.div`\r\n  .disclaimer {\r\n    padding-bottom: 8rem;\r\n\r\n    &__title {\r\n      margin-top: 8rem;\r\n      text-align: center;\r\n      font-size: 3.6rem;\r\n      font-weight: 400;\r\n      color: ${colors.red};\r\n    }\r\n\r\n    &__subtitle {\r\n      margin-top: 4rem;\r\n      margin-bottom: 2rem;\r\n      font-size: 2.4rem;\r\n      color: ${colors.red};\r\n      font-weight: 300;\r\n    }\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { StyledDisclaimer } from \"./StyledDisclaimerAndLegal\";\r\nimport { StyledBreadcrumb } from \"../../../styles/components/StyledBreadcrumb\";\r\nimport { Link } from \"react-router-dom\";\r\n\r\nexport const DisclaimerAndLegal = () => {\r\n  return (\r\n    <StyledDisclaimer>\r\n      <div className=\"disclaimer\">\r\n        <StyledBreadcrumb>\r\n          <div className=\"breadcrumb\">\r\n            <div className=\"container\">\r\n              <Link to={\"/\"} className=\"breadcrumb__item\">\r\n                Home\r\n              </Link>\r\n              <div className=\"breadcrumb__item active\">Disclaimer and Legal</div>\r\n            </div>\r\n          </div>\r\n        </StyledBreadcrumb>\r\n        <div className=\"container\">\r\n          <div className=\"disclaimer__title\">Disclaimer and Legal</div>\r\n          <div className=\"disclaimer__subtitle\">Website Disclaimer</div>\r\n          <div className=\"disclaimer__content\">\r\n            <p>\r\n              The information and materials on this Website (including but not limited to the\r\n              software, calculators, tools, logos and names) is derived from sources believed to be\r\n              accurate and current as of the date of posting to the Website.\r\n            </p>\r\n            <p>\r\n              LeasePLUS, and its officers, agents, employees and contractors do not (1) give any\r\n              representation or warranty as to the reliability, accuracy or completeness of the\r\n              information and materials on this Website; nor (2) warrant that your access to the\r\n              Website will be uninterrupted or error-free.\r\n            </p>\r\n            <p>\r\n              LeasePLUS nor its employees shall not be liable in any way for any loss or damage,\r\n              however arising, whether in negligence or otherwise, out of or in connection with the\r\n              information or omissions on the Website (including any linked site).\r\n            </p>\r\n          </div>\r\n          <div className=\"disclaimer__subtitle\">Indemnity</div>\r\n          <div className=\"disclaimer__content\">\r\n            <p>\r\n              You agree to indemnify and hold harmless LeasePLUS and its employees and keep them\r\n              indemnified, against all loss, actions, proceedings, costs, expenses (including legal\r\n              fees), claims and damages arising from: (1) any breach by you of the Terms and\r\n              Conditions of Use; or (2) reliance by you on any information obtained through this\r\n              Website; or (3) your access and or use of the Site or any information downloaded from\r\n              it; or (4) reliance upon, or use of, any information by any person accessing it\r\n              through your Website.\r\n            </p>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </StyledDisclaimer>\r\n  );\r\n};\r\n","import React, { useState } from \"react\";\r\nimport styled from \"styled-components\";\r\nimport { Header } from \"./Header/Header\";\r\nimport { Route, Switch, withRouter, RouteComponentProps } from \"react-router-dom\";\r\nimport { HomePage } from \"../pages/HomePage/HomePage\";\r\nimport { SubCategoryPage } from \"../pages/SubCategoryPage/SubCategoryPage\";\r\nimport { MachineryPage } from \"../pages/MachineryPage/MachineryPage\";\r\nimport NotFound from \"./NotFound/NotFound\";\r\nimport { Footer } from \"./Footer/Footer\";\r\nimport ScrollToTop from \"../common/ScrollToTop\";\r\nimport { DisclaimerAndLegal } from \"../pages/DisclaimerAndLegal/DisclaimerAndLegal\";\r\n\r\ninterface Props {\r\n  isOpenMenu?: boolean;\r\n}\r\n\r\nconst StyledApp = styled.div<Props>`\r\n  &.active {\r\n    position: fixed;\r\n    left: 0;\r\n    top: 0;\r\n    width: 100%;\r\n    overflow: hidden;\r\n  }\r\n`;\r\n\r\nconst App = ({ history }: RouteComponentProps) => {\r\n  const [isOpenMenu, setIsOpenMenu] = useState(false);\r\n\r\n  return (\r\n    <StyledApp isOpenMenu={isOpenMenu} className={isOpenMenu ? \"active\" : \"\"}>\r\n      <ScrollToTop />\r\n      {history.location.pathname !== \"/\" ? (\r\n        <Header\r\n          isHome={false}\r\n          history={history}\r\n          isOpenMenu={isOpenMenu}\r\n          setIsOpenMenu={setIsOpenMenu}\r\n        />\r\n      ) : (\r\n        <Header\r\n          isHome={true}\r\n          history={history}\r\n          isOpenMenu={isOpenMenu}\r\n          setIsOpenMenu={setIsOpenMenu}\r\n        />\r\n      )}\r\n      <Switch>\r\n        <Route exact path=\"/\" component={HomePage} />\r\n        <Route exact path=\"/DisclaimerAndLegal\" component={DisclaimerAndLegal} />\r\n        <Route exact path=\"/machinery/:subcategoryName\" component={SubCategoryPage} />\r\n        <Route exact path=\"/machinery/:subcategoryName/:machineryName\" component={MachineryPage} />\r\n        <Route component={NotFound} />\r\n      </Switch>\r\n      <Footer />\r\n    </StyledApp>\r\n  );\r\n};\r\n\r\nexport default withRouter(App);\r\n","// This optional code is used to register a service worker.\r\n// register() is not called by default.\r\n\r\n// This lets the app load faster on subsequent visits in production, and gives\r\n// it offline capabilities. However, it also means that developers (and users)\r\n// will only see deployed updates on subsequent visits to a page, after all the\r\n// existing tabs open on the page have been closed, since previously cached\r\n// resources are updated in the background.\r\n\r\n// To learn more about the benefits of this model and instructions on how to\r\n// opt-in, read https://bit.ly/CRA-PWA\r\n\r\nconst isLocalhost = Boolean(\r\n  window.location.hostname === \"localhost\" ||\r\n    // [::1] is the IPv6 localhost address.\r\n    window.location.hostname === \"[::1]\" ||\r\n    // 127.0.0.0/8 are considered localhost for IPv4.\r\n    window.location.hostname.match(/^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/),\r\n);\r\n\r\ntype Config = {\r\n  onSuccess?: (registration: ServiceWorkerRegistration) => void;\r\n  onUpdate?: (registration: ServiceWorkerRegistration) => void;\r\n};\r\n\r\nexport function register(config?: Config) {\r\n  if (process.env.NODE_ENV === \"production\" && \"serviceWorker\" in navigator) {\r\n    // The URL constructor is available in all browsers that support SW.\r\n    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\r\n    if (publicUrl.origin !== window.location.origin) {\r\n      // Our service worker won't work if PUBLIC_URL is on a different origin\r\n      // from what our page is served on. This might happen if a CDN is used to\r\n      // serve assets; see https://github.com/facebook/create-react-app/issues/2374\r\n      return;\r\n    }\r\n\r\n    window.addEventListener(\"load\", () => {\r\n      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\r\n\r\n      if (isLocalhost) {\r\n        // This is running on localhost. Let's check if a service worker still exists or not.\r\n        checkValidServiceWorker(swUrl, config);\r\n\r\n        // Add some additional logging to localhost, pointing developers to the\r\n        // service worker/PWA documentation.\r\n        navigator.serviceWorker.ready.then(() => {\r\n          console.log(\r\n            \"This web app is being served cache-first by a service \" +\r\n              \"worker. To learn more, visit https://bit.ly/CRA-PWA\",\r\n          );\r\n        });\r\n      } else {\r\n        // Is not localhost. Just register service worker\r\n        registerValidSW(swUrl, config);\r\n      }\r\n    });\r\n  }\r\n}\r\n\r\nfunction registerValidSW(swUrl: string, config?: Config) {\r\n  navigator.serviceWorker\r\n    .register(swUrl)\r\n    .then((registration) => {\r\n      registration.onupdatefound = () => {\r\n        const installingWorker = registration.installing;\r\n        if (installingWorker == null) {\r\n          return;\r\n        }\r\n        installingWorker.onstatechange = () => {\r\n          if (installingWorker.state === \"installed\") {\r\n            if (navigator.serviceWorker.controller) {\r\n              // At this point, the updated precached content has been fetched,\r\n              // but the previous service worker will still serve the older\r\n              // content until all client tabs are closed.\r\n              console.log(\r\n                \"New content is available and will be used when all \" +\r\n                  \"tabs for this page are closed. See https://bit.ly/CRA-PWA.\",\r\n              );\r\n\r\n              // Execute callback\r\n              if (config && config.onUpdate) {\r\n                config.onUpdate(registration);\r\n              }\r\n            } else {\r\n              // At this point, everything has been precached.\r\n              // It's the perfect time to display a\r\n              // \"Content is cached for offline use.\" message.\r\n              console.log(\"Content is cached for offline use.\");\r\n\r\n              // Execute callback\r\n              if (config && config.onSuccess) {\r\n                config.onSuccess(registration);\r\n              }\r\n            }\r\n          }\r\n        };\r\n      };\r\n    })\r\n    .catch((error) => {\r\n      console.error(\"Error during service worker registration:\", error);\r\n    });\r\n}\r\n\r\nfunction checkValidServiceWorker(swUrl: string, config?: Config) {\r\n  // Check if the service worker can be found. If it can't reload the page.\r\n  fetch(swUrl, {\r\n    headers: { \"Service-Worker\": \"script\" },\r\n  })\r\n    .then((response) => {\r\n      // Ensure service worker exists, and that we really are getting a JS file.\r\n      const contentType = response.headers.get(\"content-type\");\r\n      if (\r\n        response.status === 404 ||\r\n        (contentType != null && contentType.indexOf(\"javascript\") === -1)\r\n      ) {\r\n        // No service worker found. Probably a different app. Reload the page.\r\n        navigator.serviceWorker.ready.then((registration) => {\r\n          registration.unregister().then(() => {\r\n            window.location.reload();\r\n          });\r\n        });\r\n      } else {\r\n        // Service worker found. Proceed as normal.\r\n        registerValidSW(swUrl, config);\r\n      }\r\n    })\r\n    .catch(() => {\r\n      console.log(\"No internet connection found. App is running in offline mode.\");\r\n    });\r\n}\r\n\r\nexport function unregister() {\r\n  if (\"serviceWorker\" in navigator) {\r\n    navigator.serviceWorker.ready\r\n      .then((registration) => {\r\n        registration.unregister();\r\n      })\r\n      .catch((error) => {\r\n        console.error(error.message);\r\n      });\r\n  }\r\n}\r\n","import { createGlobalStyle } from \"styled-components\";\r\nimport { media } from \"../base/media-queries\";\r\nimport { colors } from \"../abstract/variables\";\r\n\r\nimport InkFree from \"../../fonts/Inkfree.ttf\";\r\nimport Oswald from \"../../fonts/Oswald.ttf\";\r\n\r\nexport const GlobalStyle = createGlobalStyle`\r\n    * {\r\n        margin: 0;\r\n        padding: 0;\r\n        box-sizing: inherit;\r\n        /* user-select: none; */\r\n    }\r\n\r\n    html {\r\n        font-size: 62.5%; // 1rem = 10px;\r\n        scroll-behavior: smooth;\r\n\r\n        ${media.ipad} {\r\n            font-size: 50%;\r\n        }\r\n    }\r\n\r\n    body {\r\n        box-sizing: border-box;\r\n        color: ${colors.grey};\r\n        font-size: 1.6rem;\r\n        font-family: Roboto, sans-serif;\r\n        font-weight: 400;\r\n        width: 100%;\r\n\r\n        ${media.ipad} {\r\n            font-size: 1.8rem;\r\n        }\r\n\r\n        select {\r\n            /* for Firefox */\r\n            -moz-appearance: none;\r\n            /* for Chrome */\r\n            -webkit-appearance: none;\r\n\r\n            &:-moz-ui-invalid {\r\n                box-shadow: none;\r\n            }\r\n\r\n            &::-ms-expand {\r\n                display: none;\r\n            }\r\n        }\r\n    }\r\n\r\n    @font-face {\r\n        font-family: \"Ink Free\";\r\n        src: url(${InkFree}) format(\"truetype\");\r\n        font-weight: normal;\r\n        font-style: normal;\r\n    }\r\n    \r\n    @font-face {\r\n        font-family: \"Oswald\";\r\n        src: url(${Oswald}) format(\"truetype\");\r\n        font-weight: normal;\r\n        font-style: normal;\r\n    }\r\n        \r\n    .container {\r\n        max-width: 114rem;\r\n        margin: 0 auto;\r\n        padding: 0 2rem;\r\n    }\r\n\r\n    a {\r\n        &,\r\n        &:link,\r\n        &:visited {\r\n            text-decoration: none;\r\n            color: ${colors.grey};\r\n            transition: all .2s;\r\n        }\r\n    }\r\n\r\n    .grecaptcha-badge {\r\n        visibility: hidden;\r\n    }\r\n\r\n    .dialog-box {\r\n        align-items: center;\r\n        animation: fadeIn ease-out .5s;\r\n        background-color: rgba(0,0,0, .4);\r\n        display: flex;\r\n        height: 100vh;\r\n        justify-content: center;\r\n        left: 0;\r\n        position: fixed;\r\n        top: 0;\r\n        width: 100vw;\r\n        z-index: 9999;\r\n\r\n        &__container {\r\n            animation: sizeIn ease-out .7s;\r\n            background-color: ${colors.white};\r\n            border-radius: 1rem;\r\n            box-shadow: 0 0 1rem .5rem rgba(0,0,0, .5);\r\n            max-width: 35rem;\r\n            overflow: hidden;\r\n            text-align: center;\r\n            width: 90%;\r\n\r\n            &__header {\r\n                color: ${colors.white};\r\n                font-weight: bold;\r\n                font-size: 1.6rem;\r\n                padding: .8rem 1rem;\r\n            }\r\n\r\n            &__body {\r\n                padding: 2rem;\r\n            }\r\n\r\n            &__footer {\r\n                padding: 0 1.5rem 2rem 1.5rem;\r\n\r\n                button {\r\n                    border: none;\r\n                    border-radius: .5rem;\r\n                    cursor: pointer;\r\n                    outline: none;\r\n                    padding: .7rem 1.5rem;\r\n                    transition: all ease-out .3s;\r\n\r\n                    &:not(:first-child) {\r\n                        margin-left: 2rem;\r\n                    }\r\n\r\n                    &:hover {\r\n                        transform: scale(1.2);\r\n                    }\r\n                }\r\n            }\r\n        }\r\n\r\n        &--alert &__container {\r\n            &__header {\r\n                background-color: ${colors.red};\r\n            }\r\n\r\n            &__footer {\r\n                &__btn-cancel {\r\n                    background-color: ${colors.red};\r\n                    color: ${colors.white};\r\n                }\r\n\r\n                &__btn-accept {\r\n                    display: none;\r\n                }\r\n            }\r\n        }\r\n\r\n        &--info &__container {\r\n            &__header {\r\n                background-color: ${colors.blue1};\r\n            }\r\n\r\n            &__footer {\r\n                &__btn-cancel {\r\n                    background-color: ${colors.blue1};\r\n                    color: ${colors.white};\r\n                }\r\n\r\n                &__btn-accept {\r\n                    display: none;\r\n                }\r\n            }\r\n        }\r\n\r\n        &--confirm &__container {\r\n            &__header {\r\n                background-color: ${colors.orange};\r\n            }\r\n\r\n            &__footer {\r\n                &__btn-cancel {\r\n                    color: ${colors.black};\r\n                }\r\n\r\n                &__btn-accept {\r\n                    background-color: ${colors.orange};\r\n                    color: ${colors.white};\r\n                }\r\n            }\r\n        }\r\n}\r\n\r\n`;\r\n","import \"react-app-polyfill/ie11\";\r\nimport \"react-app-polyfill/ie9\";\r\nimport \"react-app-polyfill/stable\";\r\nimport React from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport { BrowserRouter } from \"react-router-dom\";\r\nimport App from \"./components/layouts/App\";\r\nimport * as serviceWorker from \"./serviceWorker\";\r\nimport { GlobalStyle } from \"./styles/global/global-styles\";\r\n\r\nReactDOM.render(\r\n  <BrowserRouter>\r\n    <GlobalStyle />\r\n    <App />\r\n  </BrowserRouter>,\r\n  document.getElementById(\"root\"),\r\n);\r\n\r\n// If you want your app to work offline and load faster, you can change\r\n// unregister() to register() below. Note this comes with some pitfalls.\r\n// Learn more about service workers: https://bit.ly/CRA-PWA\r\nserviceWorker.unregister();\r\n"],"sourceRoot":""}