"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[2807],{6917:function(n,t,e){e.r(t),e.d(t,{_frontmatter:function(){return p},default:function(){return a}});var o=e(31461),s=(e(2784),e(94099)),i=["components"],p={name:"PostList A2",component:"post-list"},r={_frontmatter:p};function a(n){var t=n.components,e=(0,o.Z)(n,i);return(0,s.kt)("wrapper",Object.assign({},r,e,{components:t,mdxType:"MDXLayout"}),(0,s.kt)("h1",{id:"postlist-a2"},"PostList A2"),(0,s.kt)("pre",null,(0,s.kt)("code",{parentName:"pre",className:"language-jsx",metastring:"live",live:!0},"<ul\n  sx={{\n    listStyle: 'none',\n    display: 'grid',\n    gridGap: 3,\n    gridTemplateColumns: 'repeat(auto-fit, minmax(256px, 1fr))',\n    m: 0,\n    px: 3,\n    py: 4,\n  }}>\n  {posts.map((post) => (\n    <li key={post.id} sx={{}}>\n      <Themed.h2\n        sx={{\n          m: 0,\n        }}>\n        <Link\n          to={post.slug}\n          sx={{\n            color: 'inherit',\n            textDecoration: 'none',\n            ':hover,:focus': {\n              color: 'primary',\n              textDecoration: 'underline',\n            },\n          }}>\n          {post.title}\n        </Link>\n      </Themed.h2>\n      <small sx={{ fontWeight: 'bold' }}>{post.date}</small>\n      <Themed.p\n        sx={{\n          m: 0,\n        }}>\n        {post.excerpt}\n      </Themed.p>\n    </li>\n  ))}\n</ul>\n")))}a.isMDXComponent=!0}}]);
//# sourceMappingURL=component---src-pages-recipes-post-list-a-2-mdx-c87718cc3cebbf21f498.js.map