{"version":3,"file":"static/chunks/2153.7221c68655626862.js","mappings":"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","sources":["webpack://_N_E/./src/components/elements/blog-item/blog-item.js","webpack://_N_E/./src/components/elements/blog-item/styles.js","webpack://_N_E/<anon>"],"sourcesContent":["import dynamic from \"next/dynamic\";\nimport { renderLineBreaks } from \"../../../utils\";\nimport { NextImage } from \"..\";\nimport {\n  BlogItemGridWrapper,\n  BlogItemWrapper,\n  BlogItemInfoWrapper,\n  TitleWrapper,\n  DescriptionWrapper,\n  CardButton,\n} from \"./styles\";\nconst Link = dynamic(() => import(\"../link/link\"));\n\nconst Title = ({ children, titleWithLink, ...cardProps }) => {\n  return (\n    <TitleWrapper {...cardProps}>\n      {titleWithLink ? (\n        <h3>\n          <Link {...titleWithLink} />\n        </h3>\n      ) : (\n        <h3>{renderLineBreaks(children)}</h3>\n      )}\n    </TitleWrapper>\n  );\n};\n\nconst Description = ({ children, ...cardProps }) => {\n  return (\n    <DescriptionWrapper {...cardProps}>\n        <p>{renderLineBreaks(children)}</p>\n    </DescriptionWrapper>\n  );\n};\n\nexport const BlogItem = ({\n  title,\n  date,\n  image,\n  link,\n  hexCode,\n  hideOnMobile,\n  showImageOnMobile,\n}) => {\n  const cardProps = {\n    hexCode,\n    hideOnMobile,\n    showImageOnMobile,\n  };\n\n  return (\n    <BlogItemGridWrapper {...cardProps}>\n      <BlogItemWrapper {...cardProps}>\n          {image && <NextImage media={image} />}\n        <BlogItemInfoWrapper {...cardProps}>\n          <Title {...cardProps}>\n            {title}\n          </Title>\n          <Description {...cardProps}>\n            {date}\n          </Description>\n          {link && (\n            <CardButton >\n              <Link type=\"buttonHex\" hexCode={hexCode} {...link} />\n            </CardButton>\n          )}\n        </BlogItemInfoWrapper>\n      </BlogItemWrapper>\n    </BlogItemGridWrapper>\n  );\n};\n\nexport default BlogItem;\n","import styled, { css } from \"styled-components\";\n\nexport const BlogItemGridWrapper = styled.li`\n  --cardItemImageHeight: 221px;\n  --cardItemDescription: 128px;\n  --cardItemTitle: 92px;\n\n  list-style: none;\n  width: 100%;\n  border-radius: 16px;\n  flex-shrink:0;\n  max-width:300px;\n\n  > a {\n    margin-bottom: 0px;\n  }\n\n  ${({ hideOnMobile }) =>\n    hideOnMobile &&\n    css`\n      display: none;\n  `}\n\n  @media screen and (min-width: 1128px) {\n    display: list-item;\n    max-width:360px;\n    &:hover{\n      box-shadow: 0px 4px 30px 0px #00000040;\n    }\n  }\n`;\n\nexport const BlogItemInfoWrapper = styled.div`\n  position: relative;\n  flex-grow:2;\n  text-align: left;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  padding: var(--spacingM);\n  gap: var(--spacingM);\n  border: 1px solid #B3B3B3;\n  border-radius: 0 0 16px 16px;\n  border-top:none;\n  @media screen and (max-width: 400px) {\n    padding: var(--spacingS);\n    gap: var(--spacingS);\n  }\n\n  @media screen and (min-width: 1128px) {\n    padding: var(--spacingM);\n    gap: var(--spacingS);\n  }\n`;\n\nexport const TitleWrapper = styled.div`\n  width: 100%;\n  height: auto;\n  word-break: break-word;\n\n  > h3 {\n    margin: 0;\n    font-size: var(--textM);\n    color: ${({ hexCode }) =>\n    hexCode ? hexCode : \"var(--primary800)\"};\n    font-weight: 500;\n\n    > a {\n      text-decoration: none;\n    }\n  }\n\n  @media screen and (min-width: 1128px) {\n\n    margin: 0px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    -webkit-line-clamp: 4;\n    -webkit-box-orient: vertical;\n\n    > h3 {\n      padding: 0px;\n      font-size: 20px;\n      line-height: normal;\n    }\n  }\n`;\n\nexport const DescriptionWrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  color: #4D4D4D;\n  font-size: 16px;\n  line-height: var(--lineHeightS);\n  min-height: 60px;\n  padding: 0px;\n  margin: 0px;\n  margin-top: 8px;\n  ul {\n    gap: 0;\n  }\n\n  > p {\n    padding: 0px;\n    margin: 0px;\n  }\n\n  @media screen and (min-width: 1128px) {\n    display: flex;\n    overflow: hidden;\n\n    > p {\n      display: -webkit-box;\n      line-height: var(--lineHeightS);\n      overflow: hidden;\n      -webkit-line-clamp: 5;\n      -webkit-box-orient: vertical;\n    }\n\n  }\n`;\n\nexport const BlogItemWrapper = styled.article`\n  display: flex;\n  list-style: none;\n  width: 100%;\n  background-color: #fff;\n  border-radius: 16px;\n  justify-content: space-between;\n  margin-left: auto;\n  margin-right: auto;\n  flex-direction: column;\n  text-decoration: none;\n  transition: transform 0.1s ease-in-out;\n  text-decoration: none;\n    height:100%;\n  &[href]:focus,\n  &[href]:hover {\n    transform: scale(1.05);\n  }\n\n  > img {\n    border-radius: var(--radiusL) var(--radiusL) 0 0;\n    object-fit: cover;\n    width: 100%;\n    height: 160px;\n  }\n\n@media screen and (min-width: 1128px) {\n    > img {\n      width: 100%;\n      height: var(--cardItemImageHeight);\n      display: block;\n    }\n  }\n`;\n\nexport const CardButton = styled.div`\n  max-width: 228px;\n  align-self: center;\n  width: fit-content;\n  cursor:pointer;\n  > a {\n    width: fit-content;\n    height: 32px;\n    font-size: var(--textS);\n    color: white;\n    background-color: ${({ hexCode }) =>\n    hexCode ? hexCode : \"var(--primary800)\"};;\n    border-radius: var(--radiusXs);\n  }\n  > div {\n     border-radius: var(--radiusXs);\n  }\n`;\n"],"names":["Link","dynamic","__webpack_require__","e","then","bind","loadableGenerated","webpack","Title","_ref","children","titleWithLink","cardProps","_opt_build_repo_next_node_modules_next_dist_compiled_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_6__","Z","_excluded","react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__","jsx","_styles__WEBPACK_IMPORTED_MODULE_4__","$t","_objectSpread","renderLineBreaks","Description","_ref2","_excluded2","cp","BlogItem","_ref3","title","date","image","link","hexCode","hideOnMobile","showImageOnMobile","rj","jsxs","n6","___WEBPACK_IMPORTED_MODULE_3__","oH","media","Lv","xC","type","__webpack_exports__","BlogItemGridWrapper","styled","li","withConfig","displayName","componentId","css","BlogItemInfoWrapper","div","TitleWrapper","DescriptionWrapper","BlogItemWrapper","article","CardButton"],"sourceRoot":""}