{"version":3,"sources":["webpack:///./src/pages/drinks/Drinks.css.ts","webpack:///./src/pages/drinks/Drinks.tsx"],"names":["MenuWrap","styled","div","SiteSubtitle","h2","HolderWrapMenu","MenuHolder","ul","li","theme","active","colors","grey2","mainBg","orange","withTranslation","data","pageContext","nodes","t","allMarkdownRemark","useState","colspan","setColspan","getValue","param","object","query","frontmatter","lang","Lang","LV","e","console","warn","useEffect","handleResize","window","innerWidth","addEventListener","removeEventListener","MainWrap","Header","title","map","index","key","id","name","MainTitle","responsiveTopNudge","menu","length","menuItem","MenuItem","item"],"mappings":"4LAEaA,EAAWC,IAAOC,IAAV,sEAAGD,CAAH,iFASRE,EAAeF,IAAOG,GAAV,0EAAGH,CAAH,0GASZI,EAAiBJ,IAAOC,IAAV,4EAAGD,CAAH,iHAUdK,EAAaL,IAAOC,IAAV,wEAAGD,CAAH,M,GAYAA,IAAOM,GAAV,qEAAGN,CAAH,wIAYGA,IAAOO,GAAV,qEAAGP,CAAH,6JAMJ,gBAAGQ,EAAH,EAAGA,MAAH,SAAUC,OACbD,EAAME,OAAOC,MAAQH,EAAME,OAAOE,UAIvBZ,IAAOC,IAAV,sEAAGD,CAAH,wLAYIA,IAAOM,GAAV,uEAAGN,CAAH,2DAOGA,IAAOO,GAAV,uEAAGP,CAAH,8RAEA,qBAAGQ,MAAkBE,OAAOG,UAoBnC,qBAAGL,MAAkBE,OAAOG,UAIjBb,IAAOO,GAAV,wEAAGP,CAAH,oOAgBCA,IAAOC,IAAV,uEAAGD,CAAH,M,uBC6BNc,yBA7H2B,SAAC,GAA6B,IAA3BC,EAA2B,EAA3BA,KAAMC,EAAqB,EAArBA,YAC3CC,GADgE,EAARC,EAChDH,EAAKI,kBAAkBF,OACrC,EAAoCG,mBAAS,GAC7C,GADA,UAC8BA,oBAAS,IAAhCC,EAAP,KAAgBC,EAAhB,KAEMC,EAAW,SAACC,EAAOC,QAAkB,IAAlBA,MAAS,MAChC,IAAMC,EAAQD,GAAUV,EAAKI,kBAAkBF,MAAM,GAAGU,YACxD,IACE,OAAOX,EAAYY,OAASC,IAAKC,GAAKJ,EAAMF,GAASE,EAASF,EAAJ,QAAmB,GAC7E,MAAOO,GAEP,OADAC,QAAQC,KAAKF,GACN,KAIXG,qBAAU,WACR,IAAMC,EAAe,WACnBb,EAAWc,OAAOC,WAAa,MAKjC,OAFAD,OAAOE,iBAAiB,SAAUH,GAE3B,WACLC,OAAOG,oBAAoB,SAAUJ,MAEtC,IAeH,OACE,gBAACK,EAAA,EAAD,KACE,gBAACC,EAAA,EAAD,CACEb,KAAMZ,EAAYY,KAClBc,MAAO,+BAET,gBAACtC,EAAD,KACGa,EAAM0B,KAAI,WAAkBC,GAAU,IAAzBjB,EAAyB,EAAzBA,YACZ,OACE,gBAAC5B,EAAD,CAAU8C,IAAKtB,EAAS,QAASI,GAAcmB,GAAE,QAAUF,GACzD,gBAAC,UAAD,CACEG,KAAI,QAAUH,EACdC,IAAKtB,EAAS,QAASI,IAEvB,gBAACqB,EAAA,EAAD,CAAWC,mBAA8B,IAAVL,EAAc,IAAM,IAChDrB,EAAS,QAASI,IAErB,gBAACzB,EAAD,KACGqB,EAAS,WAAYI,IAGvBA,EAAYuB,MAAQvB,EAAYuB,KAAKC,QACpC,gBAAC9C,EAAD,KACGsB,aADH,EACGA,EAAauB,KAAKP,KAAI,SAACS,EAAUR,GAChC,OACE,gBAACS,EAAA,EAAD,CACEhC,QAASA,EACTO,KAAMZ,EAAYY,KAClBiB,IAAKD,EACLU,KAAMF","file":"component---src-pages-drinks-drinks-tsx-c8d2a1438be82b8cfcd2.js","sourcesContent":["import styled from \"styled-components\"\n\nexport const MenuWrap = styled.div`\n  margin: 0 auto;\n  max-width: 100%;\n  padding: 0;\n  @media (max-width: 960px) {\n    padding: 0;\n  }\n`\n\nexport const SiteSubtitle = styled.h2`\n  text-align: center;\n  font-size: 18px;\n  line-height: 26px;\n  width:800px;\n  max-width:100%;\n  margin:-20px auto 30px;\n`\n\nexport const HolderWrapMenu = styled.div`\n  width: 1200px;\n  margin: 0 auto;\n  max-width: 100%;\n  padding: 0 300px 0 300px;\n\n  @media (max-width: 960px) {\n    padding: 0 10px;\n  }\n`\nexport const MenuHolder = styled.div`\n  //display: grid;\n  //grid-template-columns: repeat(2, 1fr);\n  //grid-template-rows: auto;\n  //position: relative;\n  //grid-column-gap: 40px;\n  //grid-row-gap: 40px;\n  //@media (max-width: 900px) {\n  //  flex-direction: column;\n  //  grid-template-columns: repeat(1, 1fr);\n  //}\n`\nexport const SideNav = styled.ul`\n  position: absolute;\n  top: 211px;\n  left: 23px;\n  width: 260px;\n  height: calc(100vh - 213px);\n  overflow: auto;\n  @media (max-width: 960px) {\n    display: none;\n  }\n`\n\nexport const NavItem = styled.li<{ active: boolean }>`\n  font-family: Font-Cond-Semibold;\n  font-size: 18px;\n  text-transform: uppercase;\n  margin-bottom: 5px;\n  cursor: pointer;\n  background: ${({ theme, active }) =>\n    active ? theme.colors.grey2 : theme.colors.mainBg};\n  padding: 5px 25px;\n  cursor: pointer;\n`\nexport const Alergies = styled.div`\n  margin: 0 auto;\n  width: 700px;\n  max-width: 100%;\n  border-top: 1px dashed white;\n  margin-top: 40px;\n  padding-top: 20px;\n  text-align: center;\n  font-size: 14px;\n  line-height: 18px;\n  font-family: Font-Semibold;\n`\nexport const FreeSouce = styled.ul`\n  display: flex;\n  @media (max-width: 960px) {\n    display: block;\n  }\n`\n\nexport const LeftSouce = styled.li`\n  display: flex;\n  border: 2px solid ${({ theme }) => theme.colors.orange};\n  flex-shrink: 0;\n  p {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex: 1;\n    padding: 0 20px;\n    text-align: center;\n  }\n  span {\n    font-family: Font-Black;\n    line-height: 20px;\n    font-size: 16px;\n    @media (max-width: 960px) {\n      width: 100%;\n    }\n\n    b {\n      font-family: Font-Black;\n      color: ${({ theme }) => theme.colors.orange};\n    }\n  }\n`\nexport const RightSouce = styled.li`\n  font-family: Font-Semibold;\n  font-size: 14px;\n  line-height: 18px;\n  margin-left: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: left;\n  @media (max-width: 960px) {\n    margin-left: 0px;\n    margin-top: 20px;\n    text-align: center;\n  }\n`\n\nexport const Toppings = styled.div``\n","import * as React from \"react\"\nimport { FunctionComponent, useEffect, useState } from \"react\"\nimport Header from \"../../components/header/Header\"\nimport { graphql } from \"gatsby\"\nimport MainWrap from \"../../components/main-wrap/MainWrap\"\nimport MainTitle from \"../../components/main-title/MainTitle\"\nimport { withTranslation, WithTranslation } from \"react-i18next\"\n\nimport {\n  Link,\n  DirectLink,\n  Element,\n  Events,\n} from \"react-scroll\"\nimport {\n  SiteSubtitle,\n  MenuWrap,\n  MenuHolder,\n  HolderWrapMenu,\n} from \"./Drinks.css\"\nimport MenuItem from \"../../components/menu-item/MenuItem\"\nimport { Title, Subtitle } from \"../../components/menu-item/MenuItem.css\"\nimport AlertIcon from \"../../assets/images/alert.png\"\nimport { Lang, PageContext } from \"../../constants\"\nexport type Props = {\n  data?: any\n  pageContext: PageContext\n}\nexport type Functions = {}\nexport type AllProps = Props & Functions & WithTranslation\nconst Menu: FunctionComponent<AllProps> = ({ data, pageContext, t }) => {\n  const nodes = data.allMarkdownRemark.nodes\n  const [activeMenu, setActiveMenu] = useState(0)\n  const [colspan, setColspan] = useState(false)\n\n  const getValue = (param, object = null) => {\n    const query = object || data.allMarkdownRemark.nodes[0].frontmatter\n    try {\n      return pageContext.lang === Lang.LV ? query[param] : query[`${param}_en`] || \"\"\n    } catch (e) {\n      console.warn(e)\n      return \"\"\n    }\n  }\n\n  useEffect(() => {\n    const handleResize = () => {\n      setColspan(window.innerWidth < 750)\n    }\n\n    window.addEventListener(\"resize\", handleResize)\n\n    return () => {\n      window.removeEventListener(\"resize\", handleResize)\n    }\n  }, [])\n\n  const isElementInViewport = el => {\n    try {\n      var rect = el.getBoundingClientRect()\n      const isInViewPort =\n        rect.bottom > 150 &&\n        rect.top + 100 <\n          (window.innerHeight || document.documentElement.clientHeight)\n      return isInViewPort\n    } catch (e) {\n      return false\n    }\n  }\n\n  return (\n    <MainWrap>\n      <Header\n        lang={pageContext.lang}\n        title={\"Delisnack dzērienu piegāde\"}\n      />\n      <HolderWrapMenu>\n        {nodes.map(({ frontmatter }, index) => {\n          return (\n            <MenuWrap key={getValue(\"title\", frontmatter)} id={`menu-${index}`}>\n              <Element\n                name={`menu-${index}`}\n                key={getValue(\"title\", frontmatter)}\n              >\n                <MainTitle responsiveTopNudge={index === 0 ? 100 : 60}>\n                  {getValue(\"title\", frontmatter)}\n                </MainTitle>\n                <SiteSubtitle>\n                  {getValue(\"subtitle\", frontmatter)}\n                </SiteSubtitle>\n\n                {frontmatter.menu && frontmatter.menu.length && (\n                  <MenuHolder>\n                    {frontmatter?.menu.map((menuItem, index) => {\n                      return (\n                        <MenuItem\n                          colspan={colspan}\n                          lang={pageContext.lang}\n                          key={index}\n                          item={menuItem}\n                        />\n                      )\n                    })}\n                  </MenuHolder>\n                )}\n              </Element>\n            </MenuWrap>\n          )\n        })}\n      </HolderWrapMenu>\n    </MainWrap>\n  )\n}\n\n//<Element name={`menu-${index}`} key={frontmatter.title}>\n\nexport const query = graphql`\n  {\n    allMarkdownRemark(\n      filter: { fields: { collection: { eq: \"drinkGroup\" } } }\n      sort: { fields: frontmatter___orderId, order: ASC }\n    ) {\n      nodes {\n        frontmatter {\n          orderId\n          title\n          title_en\n          subtitle\n          subtitle_en\n          menu {\n            title\n            title_en\n            subtitle\n            subtitle_en\n            price\n            image\n            extras {\n              price\n              title\n              title_en\n            }\n            sizes {\n              price\n              title\n              title_en\n            }\n            badge {\n              type\n            }\n          }\n        }\n      }\n    }\n  }\n`\nexport default withTranslation()(Menu)\n"],"sourceRoot":""}