component---src-pages-index-js-61e8595e2aa6f1801dcd.js.map

{"version":3,"file":"component---src-pages-index-js-61e8595e2aa6f1801dcd.js","mappings":"mMAMA,MAiBaA,EAAO,IAAM,gBAAC,IAAG,CAACC,MAAQ,cAGvC,UApBkB,IAEd,gBAAC,IAAM,CAACC,UAAW,cACjB,uBAAKC,MAAQ,CAAEC,aAAc,MAAQC,SAAU,SAAUC,MAAO,MAAOC,OAAQ,MAAMC,OAAQ,SAAUC,QAAQ,OAAQC,eAAgB,WACrI,gBAAC,EAAAC,EAAW,CACVC,IAAM,8BACNC,IAAM,qBAAoB,uBAG9B,uBAAKV,MAAO,CAACM,QAAQ,OAAQC,eAAe,WAC1C,yBAAG,yB","sources":["webpack://samuel-tan/./src/pages/index.js"],"sourcesContent":["import * as React from 'react'\r\nimport Layout from '../components/layout'\r\nimport {StaticImage} from 'gatsby-plugin-image'\r\nimport Seo from '../components/seo'\r\n//import {imageSizing} from '../components/layout.module.css'\r\n// Step 2: Define your component\r\nconst IndexPage = () => {\r\n  return (\r\n    <Layout pageTitle= \"Samuel Tan\">\r\n      <div style ={{ borderRadius: '50%' , overflow: 'hidden', width: '70%', height: '70%',margin: '0 Auto', display:'flex', justifyContent: 'center'}}>\r\n        <StaticImage\r\n          alt = \"Samuel in front of Slovenia\"\r\n          src = \"../images/home.jpg\"\r\n        />\r\n      </div>\r\n      <div style={{display:'flex', justifyContent:'center'}}>\r\n        <p>Making a difference.</p>\r\n      </div>\r\n    </Layout>\r\n  )\r\n}\r\n\r\n// You'll learn about this in the next task, just copy it for now\r\nexport const Head = () => <Seo title = \"Home Page\"/>\r\n\r\n// Step 3: Export your component\r\nexport default IndexPage\r\n\r\n/*import * as React from \"react\"\r\n\r\nconst pageStyles = {\r\n  color: \"#232129\",\r\n  padding: 96,\r\n  fontFamily: \"-apple-system, Roboto, sans-serif, serif\",\r\n}\r\nconst headingStyles = {\r\n  marginTop: 0,\r\n  marginBottom: 64,\r\n  maxWidth: 320,\r\n}\r\nconst headingAccentStyles = {\r\n  color: \"#663399\",\r\n}\r\nconst paragraphStyles = {\r\n  marginBottom: 48,\r\n}\r\nconst codeStyles = {\r\n  color: \"#8A6534\",\r\n  padding: 4,\r\n  backgroundColor: \"#FFF4DB\",\r\n  fontSize: \"1.25rem\",\r\n  borderRadius: 4,\r\n}\r\nconst listStyles = {\r\n  marginBottom: 96,\r\n  paddingLeft: 0,\r\n}\r\nconst listItemStyles = {\r\n  fontWeight: 300,\r\n  fontSize: 24,\r\n  maxWidth: 560,\r\n  marginBottom: 30,\r\n}\r\n\r\nconst linkStyle = {\r\n  color: \"#8954A8\",\r\n  fontWeight: \"bold\",\r\n  fontSize: 16,\r\n  verticalAlign: \"5%\",\r\n}\r\n\r\nconst docLinkStyle = {\r\n  ...linkStyle,\r\n  listStyleType: \"none\",\r\n  marginBottom: 24,\r\n}\r\n\r\nconst descriptionStyle = {\r\n  color: \"#232129\",\r\n  fontSize: 14,\r\n  marginTop: 10,\r\n  marginBottom: 0,\r\n  lineHeight: 1.25,\r\n}\r\n\r\nconst docLink = {\r\n  text: \"Documentation\",\r\n  url: \"https://www.gatsbyjs.com/docs/\",\r\n  color: \"#8954A8\",\r\n}\r\n\r\nconst badgeStyle = {\r\n  color: \"#fff\",\r\n  backgroundColor: \"#088413\",\r\n  border: \"1px solid #088413\",\r\n  fontSize: 11,\r\n  fontWeight: \"bold\",\r\n  letterSpacing: 1,\r\n  borderRadius: 4,\r\n  padding: \"4px 6px\",\r\n  display: \"inline-block\",\r\n  position: \"relative\",\r\n  top: -2,\r\n  marginLeft: 10,\r\n  lineHeight: 1,\r\n}\r\n\r\nconst links = [\r\n  {\r\n    text: \"Tutorial\",\r\n    url: \"https://www.gatsbyjs.com/docs/tutorial/getting-started/\",\r\n    description:\r\n      \"A great place to get started if you're new to web development. Designed to guide you through setting up your first Gatsby site.\",\r\n    color: \"#E95800\",\r\n  },\r\n  {\r\n    text: \"How to Guides\",\r\n    url: \"https://www.gatsbyjs.com/docs/how-to/\",\r\n    description:\r\n      \"Practical step-by-step guides to help you achieve a specific goal. Most useful when you're trying to get something done.\",\r\n    color: \"#1099A8\",\r\n  },\r\n  {\r\n    text: \"Reference Guides\",\r\n    url: \"https://www.gatsbyjs.com/docs/reference/\",\r\n    description:\r\n      \"Nitty-gritty technical descriptions of how Gatsby works. Most useful when you need detailed information about Gatsby's APIs.\",\r\n    color: \"#BC027F\",\r\n  },\r\n  {\r\n    text: \"Conceptual Guides\",\r\n    url: \"https://www.gatsbyjs.com/docs/conceptual/\",\r\n    description:\r\n      \"Big-picture explanations of higher-level Gatsby concepts. Most useful for building understanding of a particular topic.\",\r\n    color: \"#0D96F2\",\r\n  },\r\n  {\r\n    text: \"Plugin Library\",\r\n    url: \"https://www.gatsbyjs.com/plugins\",\r\n    description:\r\n      \"Add functionality and customize your Gatsby site or app with thousands of plugins built by our amazing developer community.\",\r\n    color: \"#8EB814\",\r\n  },\r\n  {\r\n    text: \"Build and Host\",\r\n    url: \"https://www.gatsbyjs.com/cloud\",\r\n    badge: true,\r\n    description:\r\n      \"Now you’re ready to show the world! Give your Gatsby site superpowers: Build and host on Gatsby Cloud. Get started for free!\",\r\n    color: \"#663399\",\r\n  },\r\n]\r\n\r\nconst IndexPage = () => {\r\n  return (\r\n    <main style={pageStyles}>\r\n      <h1 style={headingStyles}>\r\n        Congratulations\r\n        <br />\r\n        <span style={headingAccentStyles}>— you just made a Gatsby site! 🎉🎉🎉</span>\r\n      </h1>\r\n      <p style={paragraphStyles}>\r\n        Edit <code style={codeStyles}>src/pages/index.js</code> to see this page\r\n        update in real-time. 😎\r\n      </p>\r\n      <ul style={listStyles}>\r\n        <li style={docLinkStyle}>\r\n          <a\r\n            style={linkStyle}\r\n            href={`${docLink.url}?utm_source=starter&utm_medium=start-page&utm_campaign=minimal-starter`}\r\n          >\r\n            {docLink.text}\r\n          </a>\r\n        </li>\r\n        {links.map(link => (\r\n          <li key={link.url} style={{ ...listItemStyles, color: link.color }}>\r\n            <span>\r\n              <a\r\n                style={linkStyle}\r\n                href={`${link.url}?utm_source=starter&utm_medium=start-page&utm_campaign=minimal-starter`}\r\n              >\r\n                {link.text}\r\n              </a>\r\n              {link.badge && (\r\n                <span style={badgeStyle} aria-label=\"New Badge\">\r\n                  NEW!\r\n                </span>\r\n              )}\r\n              <p style={descriptionStyle}>{link.description}</p>\r\n            </span>\r\n          </li>\r\n        ))}\r\n      </ul>\r\n      <img\r\n        alt=\"Gatsby G Logo\"\r\n        src=\"data:image/svg+xml,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2a10 10 0 110 20 10 10 0 010-20zm0 2c-3.73 0-6.86 2.55-7.75 6L14 19.75c3.45-.89 6-4.02 6-7.75h-5.25v1.5h3.45a6.37 6.37 0 01-3.89 4.44L6.06 9.69C7 7.31 9.3 5.63 12 5.63c2.13 0 4 1.04 5.18 2.65l1.23-1.06A7.959 7.959 0 0012 4zm-8 8a8 8 0 008 8c.04 0 .09 0-8-8z' fill='%23639'/%3E%3C/svg%3E\"\r\n      />\r\n    </main>\r\n  )\r\n}\r\n\r\nexport default IndexPage\r\n\r\nexport const Head = () => <title>Home Page</title>\r\n*/"],"names":["Head","title","pageTitle","style","borderRadius","overflow","width","height","margin","display","justifyContent","S","alt","src"],"sourceRoot":""}