{"version":3,"sources":["webpack:///./src/pages/jak-dziala-aplikacja.js","webpack:///./src/components/sublinks.js"],"names":["JakDziala","data","useStaticQuery","title","Tag","className","fluid","fotka","childImageSharp","backgroundColor","data-sal","data-sal-delay","data-sal-duration","data-sal-easing","customStyle","href","target","rel","step1","step2","step3","step4","step5","step6","step7","step8","step9","step10","Sublinks","to"],"mappings":"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","file":"component---src-pages-jak-dziala-aplikacja-js-9f02d74a90e32d866d62.js","sourcesContent":["import React from \"react\"\r\nimport { graphql, useStaticQuery } from \"gatsby\"\r\nimport Image from \"gatsby-image\"\r\nimport SEO from \"../components/seo\"\r\nimport Layout from \"../components/layout\"\r\nimport Sublinks from \"../components/sublinks\"\r\nimport Infolinia from \"../components/infolinia\"\r\nimport BackgroundImage from \"gatsby-background-image\"\r\n\r\nimport '../sass/main.scss'\r\n\r\nconst query = graphql`\r\n  {\r\n    step1: file(relativePath: { eq: \"steps/step1.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step2: file(relativePath: { eq: \"steps/step2.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step3: file(relativePath: { eq: \"steps/step3.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step4: file(relativePath: { eq: \"steps/step4.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step5: file(relativePath: { eq: \"steps/step5.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step6: file(relativePath: { eq: \"steps/step6.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step7: file(relativePath: { eq: \"steps/step7.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step8: file(relativePath: { eq: \"steps/step8.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step9: file(relativePath: { eq: \"steps/step9.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    step10: file(relativePath: { eq: \"steps/step10.png\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    fotka: file(relativePath: { eq: \"steps/app-bg.jpg\" }) {\r\n      childImageSharp {\r\n        fluid(quality: 90) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n  }\r\n`\r\n\r\nconst JakDziala = () => {\r\n    const data = useStaticQuery(query)\r\n\r\n  return (\r\n    <Layout>\r\n      <SEO title=\"ORLEN | Jak działa aplikacja ORLEN Charge\" />\r\n      <Sublinks />\r\n\r\n      <BackgroundImage\r\n        Tag=\"section\"\r\n        className={`sub-visual sub-visual-ladowarki mb-5`}\r\n        fluid={data.fotka.childImageSharp.fluid}\r\n        backgroundColor={`#000`}\r\n      >\r\n        <div className=\"bg-overlay\"></div>\r\n        <div\r\n          className=\"visual-content col-md-8 ie11animfix\"\r\n          data-sal=\"slide-up\"\r\n          data-sal-delay=\"500\"\r\n          data-sal-duration=\"600\"\r\n          data-sal-easing=\"ease\"\r\n        >\r\n          <div className=\"title text-center\">\r\n            Jak działa aplikacja ORLEN Charge\r\n          </div>\r\n        </div>\r\n        <Infolinia customStyle=\"d-none d-md-flex js-infolinia\" />\r\n      </BackgroundImage>\r\n      <div className=\"container\">\r\n        <div className=\"row\">\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">1</div>\r\n              <div className=\"step-desc\">\r\n                Ściągnij naszą Aplikację mobilną ORLEN Charge ze sklepów{\" \"}\r\n                <a\r\n                  href=\"https://apps.apple.com/us/app/orlen-charge/id1478111353\"\r\n                  target=\"_blank\"\r\n                  rel=\"noreferrer\"\r\n                  title=\"zainstaluj aplikację z App Store\"\r\n                >\r\n                  AppStore\r\n                </a>{\" \"}\r\n                lub&nbsp;\r\n                <a\r\n                  href=\"https://play.google.com/store/apps/details?id=pl.orlen.charge\"\r\n                  target=\"_blank\"\r\n                  rel=\"noreferrer\"\r\n                  title=\"zainstaluj aplikację z Google Play\"\r\n                >\r\n                  Google Play\r\n                </a>\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step1.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">2</div>\r\n              <div className=\"step-desc\">\r\n                Zarejestruj się w aplikacji podając swoje dane\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step2.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">3</div>\r\n              <div className=\"step-desc\">\r\n                W zakładce \"Mój samochód\" wprowadź dane na temat swojego pojazdu\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step3.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">4</div>\r\n              <div className=\"step-desc\">\r\n                Za pomocą filtrów znajdź stację ładowania odpowiednią dla\r\n                Twojego samochodu. Stację ładowania możesz wyszukać także\r\n                korzystając z mapy\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step4.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">5</div>\r\n              <div className=\"step-desc\">\r\n                Przed rozpoczęciem sesji ładowania, w zakładce „Płatność” dodaj\r\n                dane karty płatniczej i kliknij zapłać.\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step5.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">6</div>\r\n              <div className=\"step-desc\">\r\n                Wybierz odpowiednie złącze, sprawdź informacje o cenach i\r\n                rozpocznij sesję ładowania\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step6.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">7</div>\r\n              <div className=\"step-desc\">\r\n                Po rozpoczęciu sesji ładowania możesz sprawdzić jej status, moc\r\n                i ilość pobranej energii\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step7.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">8</div>\r\n              <div className=\"step-desc\">\r\n                W zakładce „Poprzednie ładowania” możesz sprawdzić zestawienie\r\n                poprzednich sesji\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step8.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">9</div>\r\n              <div className=\"step-desc\">\r\n                Przechodząc do zakładki „Faktury” sprawdź wydatki oraz pobierz\r\n                faktury za zrealizowane sesje ładowania.\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step9.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n          <div className=\"col-12 col-md-6 d-flex flex-column justify-content-between mb-3 mb-xl-5\">\r\n            <div className=\"d-flex flex-nowrap align-items-start\">\r\n              <div className=\"step-number\">10</div>\r\n              <div className=\"step-desc\">\r\n                W razie potrzeby możesz się z nami skontaktować dzwoniąc na\r\n                infolinię lub korzystając z formularza na stronie\r\n                opinie.orlen.pl\r\n              </div>\r\n            </div>\r\n            <div className=\"text-center\">\r\n              <Image\r\n                fluid={data.step10.childImageSharp.fluid}\r\n                className=\"step-fotka\"\r\n              />\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </Layout>\r\n  )\r\n}\r\nexport default JakDziala\r\n\r\n\r\n\r\n","import React from 'react'\r\nimport { Link } from \"gatsby\"\r\nimport { Container } from \"react-bootstrap\"\r\n\r\nfunction Sublinks() {\r\n  return (\r\n    <section className=\"sublinks\">\r\n      <Container>\r\n        <div className=\"row py-3\">\r\n          <div className=\"col-4 col-md-4 d-flex align-items-center justify-content-center\">\r\n            <Link\r\n              to=\"/ladowarki\"\r\n              title=\"Poznaj parametry techniczne ładowarek\">\r\n              <figure>\r\n                <span className=\"icon-icon-visual-1\"></span>\r\n              </figure>\r\n              <div className=\"title\">NASZE ŁADOWARKI</div>\r\n            </Link>\r\n          </div>\r\n\r\n          <div className=\"col-4 col-md-4 d-flex align-items-center justify-content-center\">\r\n            <Link\r\n              to=\"/instrukcja-ladowania\"\r\n              title=\"instrukcja-ladowania\">\r\n              <figure>\r\n                <span className=\"icon-icon-visual-2\"></span>\r\n              </figure>\r\n              <div className=\"title\">INSTRUKCJA ŁADOWANIA</div>\r\n            </Link>\r\n          </div>\r\n\r\n          <div className=\"col-4 col-md-4 d-flex align-items-center justify-content-center\">\r\n            <Link\r\n              to=\"/regulamin\"\r\n              title=\"Zapoznaj się z regulaminem usługi ładowania\">\r\n              <figure>\r\n                <span className=\"icon-icon-visual-3\"></span>\r\n              </figure>\r\n              <div className=\"title\">REGULAMIN USŁUG ŁADOWANIA</div>\r\n            </Link>\r\n          </div>\r\n\r\n        </div>\r\n      </Container>\r\n    </section>\r\n  )\r\n}\r\n\r\nexport default Sublinks\r\n"],"sourceRoot":""}