{"version":3,"sources":["webpack:///./src/components/sections/askus.js","webpack:///./src/pages/howto/index.js","webpack:///./src/static/how-to/Ranger - How to Create a New Report.pdf","webpack:///./src/static/how-to/Ranger - How to Update a Report.pdf","webpack:///./src/static/how-to/Ranger - How to Connect a Read-Only Report.pdf","webpack:///./src/static/how-to/Ranger - How to Switch Report Versions.pdf","webpack:///./src/static/how-to/Ranger - How to Connect an Edit Only Report.pdf","webpack:///./src/static/how-to/Ranger - How to Create a New Report Version.pdf"],"names":["AskUs","StyledSection","AskUsContainer","AskUsTitle","href","style","textDecoration","TryItButton","styled","Section","props","theme","color","background","light","Container","h3","button","secondary","screen","md","sm","span","font_size","xxsmall","primary","DocLinks","docs","link","howToNewReport","text","howToNewVersion","howToNewUpdate","howToConnectReadOnly","howToConnectEditOnly","howToSwitchVersion","DocLinksContainer","map","doc","key","HeaderWrapper","header","HeaderTextGroup","h5","accent","div","regular","Flex","ImageWrapper","StyledImage","Img","HowToPage","data","useStaticQuery","title","description","id","fluid","file","childImageSharp","module","exports"],"mappings":"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","file":"component---src-pages-howto-index-js-38470e7acb128cd68b66.js","sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\nimport { Container, Section } from \"../global\";\n\n\nconst AskUs = () => (\n  <StyledSection>\n    <AskUsContainer>\n      <AskUsTitle>Questions?</AskUsTitle>\n      <a href=\"mailto:support@getranger.co\" style={{ textDecoration: \"none\" }}>\n        <TryItButton>Ask Us</TryItButton>\n      </a>\n    </AskUsContainer>\n  </StyledSection>\n);\n\nexport default AskUs;\n\nconst StyledSection = styled(Section)`\n  background-color: ${(props) => props.theme.color.background.light};\n  clip-path: polygon(0 0, 100% 14%, 100% 100%, 0% 100%);\n`;\n\nconst AskUsContainer = styled(Container)`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  padding: 80px 0 40px;\n`;\n\nconst AskUsTitle = styled.h3`\n  margin: 0 auto 32px;\n  text-align: center;\n`;\n\nconst TryItButton = styled.button`\n  font-weight: 500;\n  font-size: 14px;\n  color: white;\n  letter-spacing: 1px;\n  height: 60px;\n  display: block;\n  margin-left: 8px;\n  text-transform: uppercase;\n  text-decoration: none;\n  cursor: pointer;\n  white-space: nowrap;\n  background: ${(props) => props.theme.color.secondary};\n  border-radius: 4px;\n  padding: 0px 40px;\n  border-width: 0px;\n  border-style: initial;\n  border-color: initial;\n  border-image: initial;\n  outline: 0px;\n  &:hover {\n    box-shadow: rgba(110, 120, 152, 0.22) 0px 2px 10px 0px;\n  }\n  @media (max-width: ${(props) => props.theme.screen.md}) {\n  }\n  @media (max-width: ${(props) => props.theme.screen.sm}) {\n    margin-left: 0;\n  }\n`;\n\nconst Subtitle = styled.span`\n  ${(props) => props.theme.font_size.xxsmall}\n  padding-top: 16px;\n  font-size: 14px;\n  color: ${(props) => props.theme.color.primary};\n`;\n","import { useStaticQuery } from \"gatsby\";\nimport Img from \"gatsby-image\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nimport Layout from \"../../components/common/layout/layout\";\nimport SEO from \"../../components/common/layout/seo\";\nimport Navigation from \"../../components/common/navigation/navigation\";\nimport { Container } from \"../../components/global\";\nimport AskUs from \"../../components/sections/askus\";\nimport Footer from \"../../components/sections/footer\";\nimport howToConnectReadOnly from \"../../static/how-to/Ranger - How to Connect a Read-Only Report.pdf\";\nimport howToConnectEditOnly from \"../../static/how-to/Ranger - How to Connect an Edit Only Report.pdf\";\nimport howToNewVersion from \"../../static/how-to/Ranger - How to Create a New Report Version.pdf\";\nimport howToNewReport from \"../../static/how-to/Ranger - How to Create a New Report.pdf\";\nimport howToSwitchVersion from \"../../static/how-to/Ranger - How to Switch Report Versions.pdf\";\nimport howToNewUpdate from \"../../static/how-to/Ranger - How to Update a Report.pdf\";\n\nconst HowToPage = () => {\n  const data = useStaticQuery(graphql`\n    query {\n      file(\n        sourceInstanceName: { eq: \"product\" }\n        name: { eq: \"ranger-saving-your-report-with-frame\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 1000) {\n            ...GatsbyImageSharpFluid\n          }\n        }\n      }\n    }\n  `);\n\n  return (\n    <Layout>\n      <SEO title=\"How to Use Ranger\" description=\"How to use Ranger. Ranger is an Excel Add-in and plugin for Excel that provides a no-code SaaS solution for protecting, centralizing and storing Excel data by connecting it to the cloud.\"/>\n      <Navigation />\n      <HeaderWrapper id=\"top\">\n        <Container>\n          <Flex>\n            <HeaderTextGroup>\n              <h1>Ranger</h1>\n              <h2>\n                Ranger is a no-code solution for sharing data across your\n                organization.\n              </h2>\n              <p>\n                Ranger allows teams to create and manage a cloud database all\n                from within Excel. With Ranger a user can take ranges of data—\n                <strong>Blocks</strong>—within their workbook and connect them\n                to a cloud database. By uploading or updating Blocks, users make\n                it possible for other members of their organization to use and\n                access that data.\n              </p>\n              <p>\n                Ranger helps you keep you centralize data to make it available\n                across your organization, increasing automation and\n                collaboration, all while protecting your data against corruption\n                and providing version control.\n              </p>\n              <p>\n                Blocks exist within <strong>Reports</strong>. Each Report can\n                contain multiple Blocks of data—ranges that the user wants to\n                sync with the database. Reports are either Edit-Only, meaning\n                the user can send new Block data from their workbook to the\n                database, or Read-Only, meaning the user can pull data from the\n                database into the Blocks in their workbook.{\" \"}\n              </p>\n              <p>\n                As data changes over time, users with Edit-Only Reports can push\n                their updated Block values to the database. These{\" \"}\n                <strong>Updates</strong> are how Ranger enforces version\n                control. Any user can see who updated a report and when. Users\n                with Read-Only reports can choose to download the latest Update\n                data into their Blocks.\n              </p>\n              <p>\n                Complex data management often requires multiple versions of the\n                same data. That’s why Ranger allows users to create multiple\n                versions of their Reports. Different versions are specified by{\" \"}\n                <strong>Parameters</strong> that the user defines. Parameters\n                allow the user to differentiate their forecasts by As Of Date,\n                their sales metrics by Product Line, their historical data by\n                Quarter, or any other differentiators the user chooses. Ranger\n                focuses on being flexible and Parameters let the user make\n                Ranger work for them.\n              </p>{\" \"}\n              <p>\n                If you have any more questions, check out the how to\n                documentation linked, below or reach out to customer support at{\" \"}\n                <a href=\"mailto:support@getranger.co\">support@getranger.co</a>\n              </p>\n            </HeaderTextGroup>\n            <ImageWrapper>\n              <StyledImage fluid={data.file.childImageSharp.fluid} />\n              <br />\n            </ImageWrapper>\n          </Flex>\n        </Container>\n      </HeaderWrapper>\n      <DocLinks />\n      <AskUs />\n      <Footer />\n    </Layout>\n  );\n};\n\nconst DocLinks = () => {\n  const docs = [\n    { link: howToNewReport, text: \"How to Create a New Report\" },\n    { link: howToNewVersion, text: \"How to Create a New Report Version\" },\n    { link: howToNewUpdate, text: \"How to Update a Report\" },\n    {\n      link: howToConnectReadOnly,\n      text: \"How to Connect a New Read-Only Report\",\n    },\n    {\n      link: howToConnectEditOnly,\n      text: \"How to Connect a New Edit-Only Report\",\n    },\n    { link: howToSwitchVersion, text: \"How to Switch Report Version\" },\n  ];\n  return (\n    <DocLinksContainer>\n      <ul>\n        {(() =>\n          docs.map((doc) => (\n            <li key={doc.link}>\n              <a href={doc.link}>{doc.text}</a>\n            </li>\n          )))()}\n      </ul>\n    </DocLinksContainer>\n  );\n};\n\nconst DocLinksContainer = styled(Container)`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  padding: 80px 0 40px;\n  > ul {\n    list-style-type: none;\n    > li {\n      padding: 4px;\n      font-size: 16px;\n    }\n  }\n`;\n\n// const HeaderWrapper = styled.header`\n//   background-color: #f8f8f8;\n//   padding: 160px 0 80px 0;\n//   position: relative;\n//   clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 5vw));\n//   @media (max-width: ${(props) => props.theme.screen.md}) {\n//   }\n// `;\n\nconst StyledContainer = styled(Container)``;\n\nconst HeaderWrapper = styled.header`\n  background-color: #f8f8f8;\n  padding: 160px 0 80px 0;\n  position: relative;\n  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 5vw));\n  @media (max-width: ${(props) => props.theme.screen.md}) {\n  }\n`;\nconst Subtitle = styled.h5`\n  font-size: 16px;\n  color: ${(props) => props.theme.color.accent};\n  letter-spacing: 0px;\n  margin-bottom: 16px;\n`;\n\nconst HeaderTextGroup = styled.div`\n  margin: 0;\n\n  > div {\n    width: 120%;\n    margin-bottom: -4.5%;\n    margin-left: 8%;\n\n    @media (max-width: ${(props) => props.theme.screen.md}) {\n      margin: 0 16px;\n    }\n  }\n\n  h1 {\n    margin: 0 0 24px;\n    color: ${(props) => props.theme.color.primary};\n  }\n\n  h2 {\n    margin-bottom: 24px;\n    ${(props) => props.theme.font_size.regular}\n  }\n\n  p {\n    margin-bottom: 48px;\n  }\n`;\n\nconst Flex = styled.div`\n  display: grid;\n  justify-content: space-between;\n  align-content: center;\n  grid-template-columns: 1fr 1fr;\n  @media (max-width: ${(props) => props.theme.screen.md}) {\n    grid-template-columns: 1fr;\n    grid-gap: 64px;\n  }\n`;\n\nconst HeaderButton = styled.button`\n  font-weight: 500;\n  font-size: 14px;\n  color: white;\n  letter-spacing: 1px;\n  height: 60px;\n  display: block;\n  margin-left: 8px;\n  text-transform: uppercase;\n  cursor: pointer;\n  white-space: nowrap;\n  background: ${(props) => props.theme.color.secondary};\n  border-radius: 4px;\n  padding: 0px 40px;\n  border-width: 0px;\n  border-style: initial;\n  border-color: initial;\n  border-image: initial;\n  outline: 0px;\n  &:hover {\n    box-shadow: rgba(110, 120, 152, 0.22) 0px 2px 10px 0px;\n  }\n  @media (max-width: ${(props) => props.theme.screen.md}) {\n  }\n  @media (max-width: ${(props) => props.theme.screen.sm}) {\n    margin-left: 0;\n  }\n`;\nconst ImageWrapper = styled.div`\n  justify-self: end;\n  align-self: center;\n  @media (max-width: ${(props) => props.theme.screen.md}) {\n    justify-self: center;\n  }\n`;\n\nconst StyledImage = styled(Img)`\n  width: 500px;\n  @media (max-width: ${(props) => props.theme.screen.md}) {\n    width: 400px;\n  }\n  @media (max-width: ${(props) => props.theme.screen.sm}) {\n    width: 300px;\n    display: none;\n  }\n`;\n\nexport default HowToPage;\n","module.exports = __webpack_public_path__ + \"static/Ranger - How to Create a New Report-4763bb11b59d2910f082a6998c4b394c.pdf\";","module.exports = __webpack_public_path__ + \"static/Ranger - How to Update a Report-711b1c0d62ae6aedb4c78a66bbcdd9aa.pdf\";","module.exports = __webpack_public_path__ + \"static/Ranger - How to Connect a Read-Only Report-f9e3f8df68ebf6703cc1b5c06458449e.pdf\";","module.exports = __webpack_public_path__ + \"static/Ranger - How to Switch Report Versions-819e2479b14f6f428f991bb23017a5ca.pdf\";","module.exports = __webpack_public_path__ + \"static/Ranger - How to Connect an Edit Only Report-1ef765db5411d88d1f699df575a326f2.pdf\";","module.exports = __webpack_public_path__ + \"static/Ranger - How to Create a New Report Version-43e178967d338035a9361a70f0f72c40.pdf\";"],"sourceRoot":""}