https://fauna-gatsby-comments.netlify.app/posts/

1<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="ie=edge"/><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/><meta name="generator" content="Gatsby 2.20.18"/><title data-react-helmet="true">Comments App | Posts</title><link data-react-helmet="true" rel="icon" type="image/png" sizes="16x16" href="https://fauna-gatsby-comments.netlify.com/images/favicon-16x16.png"/><link data-react-helmet="true" rel="icon" type="image/png" sizes="32x32" href="https://fauna-gatsby-comments.netlify.com/images/favicon-32x32.png"/><meta data-react-helmet="true" name="description" content="Roll your own comments with Gatsby and FaunaDB"/><meta data-react-helmet="true" name="image" content="https://fauna-gatsby-comments.netlify.com/images/comments-app-open-graph-image.jpg"/><meta data-react-helmet="true" name="image:alt" content="Roll your own comments with Gatsby and FaunaDB"/><meta data-react-helmet="true" name="gatsby-theme" content="@pauliescanlon/gatsby-theme-terminal"/><meta data-react-helmet="true" name="keywords" content="React, Gatsby, FaunaDB, Netlify Continuous Deployment, Netlify Identity Widget, Netlify Serverless functions, Apollo, GraphQL"/><meta data-react-helmet="true" property="og:type" content="website"/><meta data-react-helmet="true" property="og:title" content="Comments App | Posts"/><meta data-react-helmet="true" property="og:url" content="https://fauna-gatsby-comments.netlify.com"/><meta data-react-helmet="true" property="og:description" content="Roll your own comments with Gatsby and FaunaDB"/><meta data-react-helmet="true" property="og:image" content="https://fauna-gatsby-comments.netlify.com/images/comments-app-open-graph-image.jpg"/><meta data-react-helmet="true" property="og:image:alt" content="Roll your own comments with Gatsby and FaunaDB"/><meta data-react-helmet="true" name="twitter:card" content="summary_large_image"/><meta data-react-helmet="true" name="twitter:title" content="Comments App | Posts"/><meta data-react-helmet="true" name="twitter:url" content="https://fauna-gatsby-comments.netlify.com"/><meta data-react-helmet="true" name="twitter:description" content="Roll your own comments with Gatsby and FaunaDB"/><meta data-react-helmet="true" name="twitter:image" content="https://fauna-gatsby-comments.netlify.com/images/comments-app-open-graph-image.jpg"/><meta data-react-helmet="true" name="twitter:image:alt" content="Roll your own comments with Gatsby and FaunaDB"/><link as="script" rel="preload" href="/app-95c7d9971f38b57423cc.js"/><link as="script" rel="preload" href="/component---src-pages-posts-js-c0202e3195663526cece.js"/><link as="script" rel="preload" href="/fe1c074cc7b48926f87a461b0851b5bab5819917-442ec7849957975cae92.js"/><link as="script" rel="preload" href="/0743333ce9493013f18d2402c7e0a00036ccd168-477583ecf66cd88526f9.js"/><link as="script" rel="preload" href="/framework-601ef0ec90fca11d7027.js"/><link as="script" rel="preload" href="/532a2f07-d78d95459c838e3443e8.js"/><link as="script" rel="preload" href="/webpack-runtime-810d78ba21cff7cb410f.js"/><link as="fetch" rel="preload" href="/page-data/posts/page-data.json" crossorigin="anonymous"/><link as="fetch" rel="preload" href="/page-data/app-data.json" crossorigin="anonymous"/></head><body>

1<script>(function() { try {
2  var mode = localStorage.getItem('theme-ui-color-mode');
3  if (!mode) return
4  document.body.classList.add('theme-ui-' + mode);
5} catch (e) {} })();</script>

5<div id="___gatsby"><style data-emotion-css="1icz5gt">body{color:var(--theme-ui-colors-text,#333333);background-color:var(--theme-ui-colors-background,#ffffff);}</style><style data-emotion-css="1j0mqyc">*{box-sizing:border-box;}body{margin:0;font-size:1rem;font-family:system-ui,sans-serif;line-height:1.5;}</style><div style="outline:none" tabindex="-1" id="gatsby-focus-wrapper"><style data-emotion-css="vurnku">.css-vurnku{box-sizing:border-box;margin:0;min-width:0;}</style><main class="css-vurnku"><style data-emotion-css="nbd9bw">.css-nbd9bw{box-sizing:border-box;margin:0;min-width:0;width:100%;max-width:1140px;margin-left:auto;margin-right:auto;max-width:998px;padding-left:16px;padding-right:16px;}@media screen and (min-width:40em){.css-nbd9bw{padding-left:24px;padding-right:24px;}}</style><div class="css-nbd9bw"><style data-emotion-css="1axytzc">.css-1axytzc{box-sizing:border-box;margin:0;min-width:0;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--theme-ui-colors-background,#ffffff);border-bottom-color:var(--theme-ui-colors-muted,#DEDEDE);border-bottom-style:solid;border-bottom-width:1px;height:64px;left:0;position:fixed;right:0;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><header class="css-1axytzc"><style data-emotion-css="sb1gx1">.css-sb1gx1{box-sizing:border-box;margin:0;min-width:0;width:100%;max-width:1140px;margin-left:auto;margin-right:auto;max-width:998px;padding-left:16px;padding-right:16px;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}@media screen and (min-width:40em){.css-sb1gx1{padding-left:24px;padding-right:24px;}}</style><div class="css-sb1gx1"><style data-emotion-css="12wttmp">.css-12wttmp{box-sizing:border-box;margin:0;min-width:0;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-left:-8px;margin-right:-8px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><nav class="css-12wttmp"><style data-emotion-css="1nq05u6">.css-1nq05u6{box-sizing:border-box;margin:0;min-width:0;color:inherit;-webkit-text-decoration:none;text-decoration:none;font-weight:700;display:inline-block;border-radius:3px;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;padding-left:8px;padding-right:8px;padding-top:4px;padding-bottom:4px;-webkit-transition:.2s linear color;transition:.2s linear color;}.css-1nq05u6:hover,.css-1nq05u6:focus,.css-1nq05u6.active{color:var(--theme-ui-colors-primary,#FF5BA3);}.css-1nq05u6[aria-current]{color:var(--theme-ui-colors-primary,#FF5BA3);}.css-1nq05u6:hover{color:var(--theme-ui-colors-highlight,#00C4FF);background-color:var(--theme-ui-colors-darken,#F7F7F7);}</style><a class="css-1nq05u6" href="/"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="100%" fill="currentcolor" viewBox="0 0 24 24" preserveAspectRatio="xMidYMid meet" x="0" y="0" class="css-vurnku"><path d="M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4-.01-18zM18 14H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z" fill="currentcolor"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></a><a class="css-1nq05u6" href="/posts">Posts</a></nav><div class="css-vurnku"></div></div></header><style data-emotion-css="11di82w">.css-11di82w{box-sizing:border-box;margin:0;min-width:0;height:96px;}</style><div class="css-11di82w"></div><section class="css-vurnku"><style data-emotion-css="146auqf">.css-146auqf{box-sizing:border-box;margin:0;min-width:0;font-family:system-ui,sans-serif;font-weight:700;line-height:1;color:var(--theme-ui-colors-primary,#FF5BA3);font-size:3.5rem;font-weight:700;line-height:1;margin-top:0;margin-bottom:16px;}@media screen and (min-width:40em){.css-146auqf{font-size:4.5rem;}}.css-146auqf a{color:inherit;}</style><h1 class="css-146auqf">Posts<!-- --> <span role="img" aria-label="posts">✍️</span></h1><style data-emotion-css="a4oq5l">.css-a4oq5l{box-sizing:border-box;margin:0;min-width:0;color:var(--theme-ui-colors-gray,#999999);margin:0;margin-top:8px;margin-bottom:8px;border:0;border-bottom:1px solid;border:0;border-style:0;color:var(--theme-ui-colors-muted,#DEDEDE);margin-top:16px;margin-bottom:16px;}</style><hr class="css-a4oq5l"/><style data-emotion-css="hdrfx9">.css-hdrfx9{box-sizing:border-box;margin:0;min-width:0;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-8px;margin-right:-8px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><div class="css-hdrfx9"><style data-emotion-css="1ogkvwq">.css-1ogkvwq{box-sizing:border-box;margin:0;min-width:0;padding-left:8px;padding-right:8px;margin-bottom:16px;}.css-1ogkvwq a{-webkit-text-decoration:none;text-decoration:none;}</style><div class="css-1ogkvwq"><a href="/posts/2020/04/post-five/"><style data-emotion-css="10ojl8q">.css-10ojl8q{box-sizing:border-box;margin:0;min-width:0;color:var(--theme-ui-colors-text,#333333);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex:1;-ms-flex:1;flex:1;padding:24px;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);background-color:var(--theme-ui-colors-background,#ffffff);-webkit-transition:.2s linear box-shadow,.2s ease-in-out -webkit-transform;-webkit-transition:.2s linear box-shadow,.2s ease-in-out transform;transition:.2s linear box-shadow,.2s ease-in-out transform;}.css-10ojl8q:hover{-webkit-transform:translateY(-0.25rem);-ms-transform:translateY(-0.25rem);transform:translateY(-0.25rem);box-shadow:0 10px 20px rgba(0,0,0,0.19),0 6px 6px rgba(0,0,0,0.23);}.css-10ojl8q:hover button{color:var(--theme-ui-colors-primary,#FF5BA3);}</style><div class="css-10ojl8q"><style data-emotion-css="1nwfbjq">.css-1nwfbjq{box-sizing:border-box;margin:0;min-width:0;font-family:system-ui,sans-serif;font-weight:700;line-height:1;color:var(--theme-ui-colors-text,#333333);font-size:1.5rem;font-weight:700;line-height:1;margin-top:0;margin-bottom:8px;}@media screen and (min-width:40em){.css-1nwfbjq{font-size:2.125rem;}}.css-1nwfbjq a{color:inherit;}</style><h4 class="css-1nwfbjq">Post Five</h4><style data-emotion-css="1c4ebui">.css-1c4ebui{box-sizing:border-box;margin:0;min-width:0;font-size:0.75rem;color:var(--theme-ui-colors-highlight,#00C4FF);}</style><small class="css-1c4ebui">11 April 2020</small><hr class="css-a4oq5l"/><style data-emotion-css="joa6mv">.css-joa6mv{box-sizing:border-box;margin:0;min-width:0;margin-bottom:24px;}</style><div class="css-joa6mv">This is post five Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean commodo tristique odio. Cras diam magna, sodales id leo…</div><style data-emotion-css="1p9giz6">.css-1p9giz6{box-sizing:border-box;margin:0;min-width:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;text-align:center;line-height:inherit;-webkit-text-decoration:none;text-decoration:none;font-size:inherit;padding-left:16px;padding-right:16px;padding-top:8px;padding-bottom:8px;color:white;background-color:var(--theme-ui-colors-primary,#FF5BA3);border:0;border-radius:4px;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:transparent;cursor:pointer;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;color:var(--theme-ui-colors-text,#333333);padding:0;-webkit-transition:.2s linear color;transition:.2s linear color;-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end;}.css-1p9giz6:hover{color:var(--theme-ui-colors-primary,#FF5BA3);}</style><button tabindex="-1" class="css-1p9giz6">Read post</button></div></a></div><div class="css-1ogkvwq"><a href="/posts/2020/04/post-four/"><div class="css-10ojl8q"><h4 class="css-1nwfbjq">Post Four</h4><small class="css-1c4ebui">2 April 2020</small><hr class="css-a4oq5l"/><div class="css-joa6mv">This is post four Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean commodo tristique odio. Cras diam magna, sodales id leo…</div><button tabindex="-1" class="css-1p9giz6">Read post</button></div></a></div><div class="css-1ogkvwq">

5<a href="/posts/2020/03/post-three/"><div class="css-10ojl8q"><h4 class="css-1nwfbjq">Post Three</h4><small class="css-1c4ebui">21 March 2020</small><hr class="css-a4oq5l"/><div class="css-joa6mv">This is post three Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean commodo tristique odio. Cras diam magna, sodales id leo…</div><button tabindex="-1" class="css-1p9giz6">Read post</button></div></a></div><div class="css-1ogkvwq"><a href="/posts/2020/02/post-two/"><div class="css-10ojl8q"><h4 class="css-1nwfbjq">Post Two</h4><small class="css-1c4ebui">17 February 2020</small><hr class="css-a4oq5l"/><div class="css-joa6mv">This is post two Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean commodo tristique odio. Cras diam magna, sodales id leo vel…</div><button tabindex="-1" class="css-1p9giz6">Read post</button></div></a></div><div class="css-1ogkvwq"><a href="/posts/2020/01/post-one/"><div class="css-10ojl8q"><h4 class="css-1nwfbjq">Post One</h4><small class="css-1c4ebui">31 January 2020</small><hr class="css-a4oq5l"/><div class="css-joa6mv">This is post one Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean commodo tristique odio. Cras diam magna, sodales id leo vel…</div><button tabindex="-1" class="css-1p9giz6">Read post</button></div></a></div></div></section></div></main></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div>

5<script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/posts/";/*]]>*/</script>

5<script id="gatsby-chunk-mapping">/*<![CDATA[*/window.___chunkMapping={"app":["/app-95c7d9971f38b57423cc.js"],"component---src-layouts-posts-layout-js":["/component---src-layouts-posts-layout-js-df1a8125340333701017.js"],"component---src-pages-404-js":["/component---src-pages-404-js-6a54230c8aef7ec67869.js"],"component---src-pages-admin-js":["/component---src-pages-admin-js-82f365865171f9f90070.js"],"component---src-pages-index-js":["/component---src-pages-index-js-e8cc25e1362f13217a68.js"],"component---src-pages-posts-js":["/component---src-pages-posts-js-c0202e3195663526cece.js"]};/*]]>*/</script>

5<script src="/webpack-runtime-810d78ba21cff7cb410f.js" async=""></script>

5<script src="/532a2f07-d78d95459c838e3443e8.js" async=""></script>

5<script src="/framework-601ef0ec90fca11d7027.js" async=""></script>

5<script src="/0743333ce9493013f18d2402c7e0a00036ccd168-477583ecf66cd88526f9.js" async=""></script>

5<script src="/fe1c074cc7b48926f87a461b0851b5bab5819917-442ec7849957975cae92.js" async=""></script>

5<script src="/component---src-pages-posts-js-c0202e3195663526cece.js" async=""></script>

5<script src="/app-95c7d9971f38b57423cc.js" async=""></script>

5</body></html>