{"version":3,"sources":["webpack://grycode/./src/components/footer/call-to-action/index.js","webpack://grycode/./src/components/footer/call-to-action/call-to-action.module.scss","webpack://grycode/./src/components/products/products.module.scss","webpack://grycode/./src/components/products/index.js","webpack://grycode/./src/components/workflow/workflow.module.scss","webpack://grycode/./src/components/workflow/index.js","webpack://grycode/./src/pages/services/index.js","webpack://grycode/./src/pages/services/services.module.scss"],"names":["FooterCallToAction","className","headingLevel","to","product","more","Products","title","subTitle","description","highlight","StaticQuery","query","render","data","cn","Link","styles","G","image","frontend","sharp","gatsbyImageData","alt","ui","speed","service","Workflow","goal","style","width","mindmap","environment","board","contact","ServicesPage","footerChildren","siteStats"],"mappings":"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","file":"component---src-pages-services-index-js-3275270cd0f819aa03ef.js","sourcesContent":["import React from \"react\"\nimport Title from \"../../title\"\nimport Button from \"../../button\"\nimport * as styles from \"./call-to-action.module.scss\"\n\nexport default function FooterCallToAction() {\n  return (\n    <section className={styles.callToAction}>\n      <Title headingLevel=\"h4\">Frontend developers for hire</Title>\n      <Title headingLevel=\"h2\">Ready to go fast?</Title>\n      <Title headingLevel=\"p\">\n        Take your existing project to the next level. Or start a new one.\n      </Title>\n      <Button to=\"/start-project\">Start project</Button>\n    </section>\n  )\n}\n","// extracted by mini-css-extract-plugin\nexport var callToAction = \"call-to-action-module--callToAction--3D37f\";","// extracted by mini-css-extract-plugin\nexport var products = \"products-module--products--12lKk\";\nexport var highlight = \"products-module--highlight--3BQT0\";\nexport var header = \"products-module--header--yCP65\";\nexport var content = \"products-module--content--2DZwz\";\nexport var product = \"products-module--product--ZhvHe\";\nexport var description = \"products-module--description--1T4ac\";\nexport var more = \"products-module--more--2gB6G\";","import React from \"react\"\nimport { StaticQuery, graphql, Link } from \"gatsby\"\nimport Title from \"../title\"\nimport cn from \"classnames\"\nimport { GatsbyImage } from \"gatsby-plugin-image\"\nimport * as styles from \"./products.module.scss\"\n\nexport default function Products({\n  title,\n  subTitle,\n  description,\n  className,\n  highlight = false,\n}) {\n  return (\n    <StaticQuery\n      query={query}\n      render={data => (\n        <section\n          className={cn(\n            styles.products,\n            className,\n            highlight ? styles.highlight : null\n          )}\n        >\n          <header className={styles.header}>\n            {subTitle && <Title headingLevel=\"h4\">{subTitle}</Title>}\n            {title && <Title headingLevel=\"h2\">{title}</Title>}\n            {description && <Title headingLevel=\"p\">{description}</Title>}\n          </header>\n          <div className={styles.content}>\n            <Link\n              to=\"/services/frontend-development\"\n              className={styles.product}\n            >\n              <GatsbyImage image={data.frontend.sharp.gatsbyImageData} alt=\"\" />\n              <Title headingLevel=\"h3\">Frontend Development</Title>\n              <p className={styles.description}>\n                Using cutting-edge front-end development tools to produce\n                user-friendly, fully functioning, and high-performance front-end\n                solutions.\n              </p>\n              <span className={styles.more}>See more »</span>\n            </Link>\n            <Link\n              to=\"/services/user-interface-development\"\n              className={styles.product}\n            >\n              <GatsbyImage image={data.ui.sharp.gatsbyImageData} alt=\"\" />\n              <Title headingLevel=\"h3\">UI/UX Development</Title>\n              <p className={styles.description}>\n                Integrating UX/UI designs and wireframes into a user-friendly,\n                mobile-first, accessible, and intuitive interfaces\n              </p>\n              <span className={styles.more}>See more »</span>\n            </Link>\n            <Link to=\"/services/jamstack-website\" className={styles.product}>\n              <GatsbyImage image={data.speed.sharp.gatsbyImageData} alt=\"\" />\n              <Title headingLevel=\"h3\">JAMstack Websites</Title>\n              <p className={styles.description}>\n                Increase your chances of gaining new consumers by having a\n                blazing fast website with better SEO. We build them with proven\n                technologies: GatsbyJS, Next.js, Netlify, and many others.\n              </p>\n              <span className={styles.more}>See more »</span>\n            </Link>\n          </div>\n        </section>\n      )}\n    />\n  )\n}\n\nexport const query = graphql`\n  {\n    frontend: file(relativePath: { eq: \"frontend.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n\n    ui: file(relativePath: { eq: \"user-interface.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n\n    speed: file(relativePath: { eq: \"jamstack-speed.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n  }\n`\n","// extracted by mini-css-extract-plugin\nexport var workflow = \"workflow-module--workflow--1u64S\";\nexport var highlight = \"workflow-module--highlight--3J6rs\";\nexport var header = \"workflow-module--header--2wZyB\";\nexport var content = \"workflow-module--content--jjqMo\";\nexport var service = \"workflow-module--service--1IGp3\";","import React from \"react\"\nimport Title from \"../title\"\nimport { GatsbyImage } from \"gatsby-plugin-image\"\nimport { StaticQuery, graphql } from \"gatsby\"\nimport cn from \"classnames\"\nimport * as styles from \"./workflow.module.scss\"\n\nexport default function Workflow({ className, highlight = false }) {\n  return (\n    <StaticQuery\n      query={query}\n      render={data => (\n        <section\n          className={cn(\n            styles.workflow,\n            className,\n            highlight ? styles.highlight : null\n          )}\n        >\n          <header className={styles.header}>\n            <Title headingLevel=\"h4\">Workflow</Title>\n            <Title headingLevel=\"h2\">Get your project a pro service</Title>\n          </header>\n          <div className={styles.content}>\n            <div className={styles.service}>\n              <GatsbyImage\n                image={data.goal.sharp.gatsbyImageData}\n                style={{ width: 220 }}\n                alt=\"\"\n              />\n              <Title headingLevel=\"h3\">\n                Settling up for the project’s goals\n              </Title>\n              <p>\n                You want your web product to hit the highest performance scores?\n                Be as secure as it possibly can? Or you want to scale it to\n                multiple languages in a blink of an eye? We got your back! We’ll\n                get to know what’s most important for your success and have it\n                in mind when choosing the best tech set.\n              </p>\n            </div>\n\n            <div className={styles.service}>\n              <GatsbyImage\n                image={data.mindmap.sharp.gatsbyImageData}\n                style={{ width: 220 }}\n                alt=\"\"\n              />\n              <Title headingLevel=\"h3\">\n                Picking the right tools <br />\n                for the job\n              </Title>\n              <p>\n                Once we understand your project wants and needs it’s time to\n                swim through the sea of technologies and choose the best for\n                your project. We’ll propose you a couple of options with their\n                possible upsides and downsides. We leave the final decision to\n                you, but we’ll always be close to help with advice.\n              </p>\n            </div>\n\n            <div className={styles.service}>\n              <GatsbyImage\n                image={data.environment.sharp.gatsbyImageData}\n                style={{ width: 220 }}\n                alt=\"\"\n              />\n              <Title headingLevel=\"h3\">Setting up a work environment</Title>\n              <p>\n                When you give us the thumbs up, we’ll set up the project\n                management environment to keep you in the loop as we work on the\n                project. You’ll get an access to our Slack workspace, Asana,\n                Github repository, and all other tools used during the\n                development stage. You also get to choose how often you’d like\n                to receive project updates from us and in what form should they\n                be in.\n              </p>\n            </div>\n\n            <div className={styles.service}>\n              <GatsbyImage\n                image={data.board.sharp.gatsbyImageData}\n                style={{ width: 220 }}\n                alt=\"\"\n              />\n              <Title headingLevel=\"h3\">Transparent project management</Title>\n              <p>\n                Transparency is our core value and it mirrors in our practice.\n                Throughout the project you’ll be able to access the code\n                repository we’re working on and see what we’ve put together in\n                real time. You’ll also have access to our time tracking app for\n                your project to see how much time each task consumed.\n              </p>\n            </div>\n\n            <div className={styles.service}>\n              <GatsbyImage\n                image={data.contact.sharp.gatsbyImageData}\n                style={{ width: 220 }}\n                alt=\"\"\n              />\n              <Title headingLevel=\"h3\">No need to say goodbye</Title>\n              <p>\n                Rarely we see our work ending with the deployment. In most\n                cases, we stay with our clients for a long time after developing\n                the product. We handle their additional feature requests and\n                ongoing web architecture maintenance, so they could focus on\n                growing their business.\n              </p>\n            </div>\n          </div>\n        </section>\n      )}\n    />\n  )\n}\n\nexport const query = graphql`\n  {\n    goal: file(relativePath: { eq: \"goal.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n    mindmap: file(relativePath: { eq: \"mindmap.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n    environment: file(relativePath: { eq: \"environment.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n    board: file(relativePath: { eq: \"board.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n    contact: file(relativePath: { eq: \"contact.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n  }\n`\n","import React from \"react\"\nimport Seo from \"../../components/seo\"\nimport Layout from \"../../components/layout\"\nimport Title from \"../../components/title\"\nimport { graphql } from \"gatsby\"\nimport { GatsbyImage } from \"gatsby-plugin-image\"\nimport Button from \"../../components/button\"\nimport Products from \"../../components/products\"\nimport Workflow from \"../../components/workflow\"\nimport FooterCallToAction from \"../../components/footer/call-to-action\"\nimport * as styles from \"./services.module.scss\"\n\nexport default function ServicesPage({ data }) {\n  return (\n    <>\n      <Seo\n        title=\"What we do and how we do it at Grycode\"\n        description=\"Website performance is what makes or breaks businesses nowadays.\n              We can help you build a modern website, or PWA, that will bring\n              you customers and and stay on top of your competition.\"\n      />\n      <Layout footerChildren={<FooterCallToAction />}>\n        <section className={styles.services}>\n          <header>\n            <Title headingLevel=\"h4\">Services</Title>\n            <Title headingLevel=\"h1\">\n              We build fast sites & apps in London\n            </Title>\n            <Title headingLevel=\"p\">\n              Website performance is what makes or breaks businesses nowadays.\n              We can help you build a modern website, or PWA, that will bring\n              you customers and and stay on top of your competition.\n            </Title>\n            <Button to=\"/start-project\">Get in touch</Button>\n          </header>\n          <div className={styles.servicesHero}>\n            <GatsbyImage image={data.siteStats.sharp.gatsbyImageData} alt=\"\" />\n          </div>\n        </section>\n\n        <Products subTitle=\"Services\" title=\"What we do\" />\n\n        <Workflow highlight />\n      </Layout>\n    </>\n  )\n}\n\nexport const query = graphql`\n  {\n    siteStats: file(relativePath: { eq: \"site-stats.png\" }) {\n      sharp: childImageSharp {\n        gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH)\n      }\n    }\n  }\n`\n","// extracted by mini-css-extract-plugin\nexport var services = \"services-module--services--3oQCV\";\nexport var servicesHero = \"services-module--servicesHero--3kkmr\";"],"sourceRoot":""}