{"version":3,"sources":["webpack:///./src/components/ResourcesComponents/ResourcesCard.tsx","webpack:///./src/components/CustomerStories/CustomerTemplateLayout.tsx","webpack:///./src/components/CustomerStories/CustomerRightCol.tsx","webpack:///./node_modules/@material-ui/icons/Twitter.js","webpack:///./node_modules/@material-ui/core/esm/Typography/Typography.js","webpack:///./node_modules/@material-ui/core/esm/Link/Link.js","webpack:///./src/components/ResourcesComponents/ResourceLeftCol.tsx","webpack:///./src/templates/resource.tsx","webpack:///./src/images/back-left-arrow.svg","webpack:///./node_modules/@material-ui/icons/LinkedIn.js","webpack:///./node_modules/@material-ui/icons/Facebook.js"],"names":["getResourceCardColor","text","ResourcesItem","post","index","formatDate","date","formatedMonth","substring","featureImage","resources","featuredImage","localFile","childImageSharp","fluid","FirstPostContainer","FirstImageContainer","FirstImage","TextContainer","FirstPostInfoBar","Pill","color","category","Date","FirstPostTitle","title","FirstDescription","description","ReadMoreLink","to","appendUrlPartnerTracking","slug","src","Arrow","PostCard","SecondaryImage","TextContainerBackground","PostTitle","styled","h3","p","h5","div","Link","props","Img","span","CustomerTemplateLayout","children","Container","CustomerRightCol","_interopRequireDefault","_interopRequireWildcard","Object","defineProperty","exports","value","default","React","_default","createElement","d","defaultVariantMapping","h1","h2","h4","h6","subtitle1","subtitle2","body1","body2","ref","_props$align","align","classes","className","_props$color","component","_props$display","display","_props$gutterBottom","gutterBottom","_props$noWrap","noWrap","_props$paragraph","paragraph","_props$variant","variant","_props$variantMapping","variantMapping","other","Component","root","concat","capitalize","withStyles","theme","margin","typography","caption","button","overline","srOnly","position","height","width","overflow","alignLeft","textAlign","alignCenter","alignRight","alignJustify","textOverflow","whiteSpace","marginBottom","colorInherit","colorPrimary","palette","primary","main","colorSecondary","secondary","colorTextPrimary","colorTextSecondary","colorError","error","displayInline","displayBlock","name","_props$component","onBlur","onFocus","TypographyClasses","_props$underline","underline","_useIsFocusVisible","useIsFocusVisible","isFocusVisible","onBlurVisible","focusVisibleRef","_React$useState","focusVisible","setFocusVisible","handlerRef","useForkRef","event","underlineNone","textDecoration","underlineHover","underlineAlways","WebkitTapHighlightColor","backgroundColor","outline","border","borderRadius","padding","cursor","userSelect","verticalAlign","borderStyle","useStyles","makeStyles","customHoverFocus","marginRight","icon","fill","ResourceLeftCol","useState","URL","setURL","useEffect","window","location","href","Inner","Title","Course","BackLink","arrhead","alt","Line","SocialIcons","StyledIconButton","aria-label","target","second","img","brand","blue","IconButton","BackToResources","resourceTemplate","data","wpPost","pageContext","breadcrumbData","url","featImg","mediaItemUrl","e","renderedBlocks","LazyBlocksFactory","lazy_data","Layout","MainGrid","noPaddingMobile","noPaddingTablet","backgroundMobile","Breadcrumb","style","downloadLink","DownloadLink","download","Button","MainImage","map","v","a","module"],"mappings":"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","file":"component---src-templates-resource-tsx-e9836db5a2e09da1884f.js","sourcesContent":["import React from 'react'\nimport styled from 'styled-components'\nimport { Link } from 'gatsby'\nimport Img from 'gatsby-image'\nimport Arrow from '../../images/link-arrow.svg'\nimport { appendUrlPartnerTracking } from '../../util/url'\n\nexport function getResourceCardColor(text: string) {\n  switch (text) {\n    case 'Blog':\n      return '#00A3C7'\n    case 'Events':\n      return '#66C1BF'\n    case 'Downloads':\n      return '#C70F55'\n    case 'White Papers':\n      return '#F7A823'\n    default:\n      return '#00A3C7'\n  }\n}\n\n\ninterface ResourcesCardInterface {\n  post: any\n  index: number\n}\n\nexport const ResourcesItem: React.FC<ResourcesCardInterface> = ({\n  post,\n  index,\n}) => {\n\n\n  function formatDate(date: string){\n      const month = date.substring(5, 7)\n      let formatedMonth =''\n      switch (month){\n        case '01':formatedMonth = 'January'\n        break\n        case '02':formatedMonth = 'February'\n        break\n        case '03':formatedMonth = 'March'    \n        break\n        case '04':formatedMonth = 'April'\n        break\n        case '05':formatedMonth = 'May'    \n        break \n        case '06':formatedMonth = 'June'   \n        break    \n        case '07':formatedMonth = 'July'    \n        break  \n        case '08':formatedMonth = 'August'  \n        break      \n        case '09':formatedMonth = 'September' \n        break      \n        case '10':formatedMonth = 'October'   \n        break    \n        case '11':formatedMonth = 'November'  \n        break\n        case '12':formatedMonth = 'December'\n     break\n      }\n\n      const formatedDay = date.substring(8, 10) \n      const formatedYear = date.substring(0, 4) \n      \n      const formatedDate =  formatedDay + \" \" +formatedMonth + \", \" + formatedYear \n      return formatedDate\n  }\n  let featureImage = null;\n\n  if(post.resources.featuredImage){\n    featureImage= post.resources.featuredImage.localFile.childImageSharp.fluid\n \n  }\n  if (index === 0) {\n       return (\n      <FirstPostContainer>\n        {featureImage && <FirstImageContainer><FirstImage fluid={featureImage} /></FirstImageContainer>}\n        <TextContainer>\n          <FirstPostInfoBar>\n            <Pill color={getResourceCardColor(post.resources.category)}>\n              {post.resources.category}\n            </Pill>\n            <Date>{formatDate(post.date)}</Date>\n          </FirstPostInfoBar>\n          <FirstPostTitle>{post.title}</FirstPostTitle>\n          <FirstDescription>{post.resources.description}</FirstDescription>\n          <ReadMoreLink to={appendUrlPartnerTracking('/resources/' + post.slug)}>\n             <b>Read more </b> <img src={Arrow}/> \n             </ReadMoreLink>\n        </TextContainer>\n      </FirstPostContainer>\n    )\n  } else {\n    return (\n      <PostCard to={appendUrlPartnerTracking('/resources/' + post.slug)}>\n        {featureImage &&(\n\n          <SecondaryImage fluid={featureImage} />\n        )}\n        <TextContainerBackground\n          color={getResourceCardColor(post.resources.category)}\n        >\n          <FirstPostInfoBar>\n            <Pill color={getResourceCardColor(post.resources.category)}>\n              {post.resources.category}\n            </Pill>\n            <Date>{formatDate(post.date)}</Date>\n          </FirstPostInfoBar>\n          <PostTitle>{post.title}</PostTitle>\n          <p>{post.resources.description}</p>\n        </TextContainerBackground>\n      </PostCard>\n    )\n  }\n}\n\nconst FirstPostTitle = styled.h3`\n  font-weight: 700;\n  line-height: 40px;\n  padding-bottom: 16px;\n  color: #1d1e22;\n`\nconst FirstDescription = styled.p`\n  font-weight: 300;\n  line-height: 30px;\n  padding-bottom: 30px;\n  color: #1d1e22;\n`\n\nconst PostTitle = styled.h5`\n  font-weight: 700;\n  font-size: 20px;\n  line-height: 30px;\n  padding-bottom: 16px;\n  color: #1d1e22;\n`\nconst TextContainer = styled.div`\n  flex: 1;\n \n width: 50%;\n @media (max-width: 768px ){\nwidth: 100%;\n}\n`\ninterface TextContainerBackground {\n  color: string\n}\n\nconst ReadMoreLink = styled(Link)`\ndisplay: flex;\nflex-direction: row;\nheight: 20px;\n\nalign-items:center;\n& img{\nheight: 15px;\nmargin-left: 10px;\n}\n`\n\nconst TextContainerBackground = styled.div`\n  flex: 1;\n  background-color: #fafafa;\n  padding-left: 30px;\n  padding-right: 30px;\n  padding-top: 20px;\n  border-top: 3px solid ${(props) => props.color};\n  min-height: 360px;\n  \n  /* max-height: 360px; */\n`\nconst FirstImageContainer = styled.div`\nwidth: 50%;\npadding-right: 49px;\ndisplay:flex;\nalign-items: center;\n@media (max-width: 768px ){\nwidth: 100%;\npadding-right: 0px;\n}\n`\nconst FirstImage = styled(Img)`\n  width: 100%;\n\n`\n\nconst SecondaryImage = styled(Img)`\n  //height: 270px;\n  width:100%;\n // padding: 40px;\n  /* min-width: 420px; */\n  \n`\nconst FirstPostContainer = styled.div`\n    display: flex;\n    border-bottom: 1px solid #dadada;\n\n    flex-direction: row;\n    grid-area: 1 / 1 / 2 / 4;\n    padding-bottom: 50px;\n    margin-bottom: 50px;\n    @media (max-width: 1024px) {\n      grid-area: 1 / 1 / 2 / 3;\n  }\n@media (max-width: 768px ){\nflex-direction: column;\n}\n \n`\n\nconst FirstPostInfoBar = styled.div`\n  padding-top: 20px;\n  padding-bottom: 20px;\n`\n\nconst PostCard = styled(Link)`\n  &:hover {\n    text-decoration: none;\n  }\n`\n\ninterface PillBackground {\n  color: string\n}\nconst Pill = styled.span<PillBackground>`\n  background-color: ${(props) => props.color};\n  padding: 3px 8px;\n  border-radius: 9px;\n  color: white;\n  font-size: 9px;\n  text-transform: uppercase;\n  margin-right: 9px;\n`\nconst Date = styled.span`\n  font-size: 10px;\n  font-weight: 700;\n  color: #1d1e22;\n`\n","import React, { FunctionComponent } from 'react'\nimport styled from 'styled-components'\nimport MainGrid from '../styling/MainGrid'\n\nconst CustomerTemplateLayout: FunctionComponent = ({ children }) => {\n  return (\n    <MainGrid>\n      <Container>{children}</Container>\n    </MainGrid>\n  )\n}\n\nexport default CustomerTemplateLayout\n\nconst Container = styled.div`\n  display: flex;\n  padding: 65px 0 0;\n`\n","import React, { FunctionComponent } from 'react'\nimport styled from 'styled-components'\n\nconst CustomerRightCol: FunctionComponent = ({ children }) => {\n  return <Container>{children}</Container>\n}\n\nexport default CustomerRightCol\n\nconst Container = styled.div`\n  width: 100%;\n  padding-left: 0;\n  \n  /* p {\n    padding-bottom: 55px !important;\n  } */\n  h2 {\n    padding-bottom: 20px !important;\n  }\n  @media (min-width: 1024px) {\n    padding-left: 11%;\n  }\n`\n","\"use strict\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nvar _interopRequireWildcard = require(\"@babel/runtime/helpers/interopRequireWildcard\");\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\nvar React = _interopRequireWildcard(require(\"react\"));\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _default = (0, _createSvgIcon.default)( /*#__PURE__*/React.createElement(\"path\", {\n  d: \"M22.46 6c-.77.35-1.6.58-2.46.69.88-.53 1.56-1.37 1.88-2.38-.83.5-1.75.85-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.29 0 .34.04.67.11.98C8.28 9.09 5.11 7.38 3 4.79c-.37.63-.58 1.37-.58 2.15 0 1.49.75 2.81 1.91 3.56-.71 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.21a4.22 4.22 0 0 1-1.93.07 4.28 4.28 0 0 0 4 2.98 8.521 8.521 0 0 1-5.33 1.84c-.34 0-.68-.02-1.02-.06C3.44 20.29 5.7 21 8.12 21 16 21 20.33 14.46 20.33 8.79c0-.19 0-.37-.01-.56.84-.6 1.56-1.36 2.14-2.23z\"\n}), 'Twitter');\nexports.default = _default;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nexport var styles = function styles(theme) {\n  return {\n    /* Styles applied to the root element. */\n    root: {\n      margin: 0\n    },\n    /* Styles applied to the root element if `variant=\"body2\"`. */\n    body2: theme.typography.body2,\n    /* Styles applied to the root element if `variant=\"body1\"`. */\n    body1: theme.typography.body1,\n    /* Styles applied to the root element if `variant=\"caption\"`. */\n    caption: theme.typography.caption,\n    /* Styles applied to the root element if `variant=\"button\"`. */\n    button: theme.typography.button,\n    /* Styles applied to the root element if `variant=\"h1\"`. */\n    h1: theme.typography.h1,\n    /* Styles applied to the root element if `variant=\"h2\"`. */\n    h2: theme.typography.h2,\n    /* Styles applied to the root element if `variant=\"h3\"`. */\n    h3: theme.typography.h3,\n    /* Styles applied to the root element if `variant=\"h4\"`. */\n    h4: theme.typography.h4,\n    /* Styles applied to the root element if `variant=\"h5\"`. */\n    h5: theme.typography.h5,\n    /* Styles applied to the root element if `variant=\"h6\"`. */\n    h6: theme.typography.h6,\n    /* Styles applied to the root element if `variant=\"subtitle1\"`. */\n    subtitle1: theme.typography.subtitle1,\n    /* Styles applied to the root element if `variant=\"subtitle2\"`. */\n    subtitle2: theme.typography.subtitle2,\n    /* Styles applied to the root element if `variant=\"overline\"`. */\n    overline: theme.typography.overline,\n    /* Styles applied to the root element if `variant=\"srOnly\"`. Only accessible to screen readers. */\n    srOnly: {\n      position: 'absolute',\n      height: 1,\n      width: 1,\n      overflow: 'hidden'\n    },\n    /* Styles applied to the root element if `align=\"left\"`. */\n    alignLeft: {\n      textAlign: 'left'\n    },\n    /* Styles applied to the root element if `align=\"center\"`. */\n    alignCenter: {\n      textAlign: 'center'\n    },\n    /* Styles applied to the root element if `align=\"right\"`. */\n    alignRight: {\n      textAlign: 'right'\n    },\n    /* Styles applied to the root element if `align=\"justify\"`. */\n    alignJustify: {\n      textAlign: 'justify'\n    },\n    /* Styles applied to the root element if `nowrap={true}`. */\n    noWrap: {\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'nowrap'\n    },\n    /* Styles applied to the root element if `gutterBottom={true}`. */\n    gutterBottom: {\n      marginBottom: '0.35em'\n    },\n    /* Styles applied to the root element if `paragraph={true}`. */\n    paragraph: {\n      marginBottom: 16\n    },\n    /* Styles applied to the root element if `color=\"inherit\"`. */\n    colorInherit: {\n      color: 'inherit'\n    },\n    /* Styles applied to the root element if `color=\"primary\"`. */\n    colorPrimary: {\n      color: theme.palette.primary.main\n    },\n    /* Styles applied to the root element if `color=\"secondary\"`. */\n    colorSecondary: {\n      color: theme.palette.secondary.main\n    },\n    /* Styles applied to the root element if `color=\"textPrimary\"`. */\n    colorTextPrimary: {\n      color: theme.palette.text.primary\n    },\n    /* Styles applied to the root element if `color=\"textSecondary\"`. */\n    colorTextSecondary: {\n      color: theme.palette.text.secondary\n    },\n    /* Styles applied to the root element if `color=\"error\"`. */\n    colorError: {\n      color: theme.palette.error.main\n    },\n    /* Styles applied to the root element if `display=\"inline\"`. */\n    displayInline: {\n      display: 'inline'\n    },\n    /* Styles applied to the root element if `display=\"block\"`. */\n    displayBlock: {\n      display: 'block'\n    }\n  };\n};\nvar defaultVariantMapping = {\n  h1: 'h1',\n  h2: 'h2',\n  h3: 'h3',\n  h4: 'h4',\n  h5: 'h5',\n  h6: 'h6',\n  subtitle1: 'h6',\n  subtitle2: 'h6',\n  body1: 'p',\n  body2: 'p'\n};\nvar Typography = /*#__PURE__*/React.forwardRef(function Typography(props, ref) {\n  var _props$align = props.align,\n    align = _props$align === void 0 ? 'inherit' : _props$align,\n    classes = props.classes,\n    className = props.className,\n    _props$color = props.color,\n    color = _props$color === void 0 ? 'initial' : _props$color,\n    component = props.component,\n    _props$display = props.display,\n    display = _props$display === void 0 ? 'initial' : _props$display,\n    _props$gutterBottom = props.gutterBottom,\n    gutterBottom = _props$gutterBottom === void 0 ? false : _props$gutterBottom,\n    _props$noWrap = props.noWrap,\n    noWrap = _props$noWrap === void 0 ? false : _props$noWrap,\n    _props$paragraph = props.paragraph,\n    paragraph = _props$paragraph === void 0 ? false : _props$paragraph,\n    _props$variant = props.variant,\n    variant = _props$variant === void 0 ? 'body1' : _props$variant,\n    _props$variantMapping = props.variantMapping,\n    variantMapping = _props$variantMapping === void 0 ? defaultVariantMapping : _props$variantMapping,\n    other = _objectWithoutProperties(props, [\"align\", \"classes\", \"className\", \"color\", \"component\", \"display\", \"gutterBottom\", \"noWrap\", \"paragraph\", \"variant\", \"variantMapping\"]);\n  var Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span';\n  return /*#__PURE__*/React.createElement(Component, _extends({\n    className: clsx(classes.root, className, variant !== 'inherit' && classes[variant], color !== 'initial' && classes[\"color\".concat(capitalize(color))], noWrap && classes.noWrap, gutterBottom && classes.gutterBottom, paragraph && classes.paragraph, align !== 'inherit' && classes[\"align\".concat(capitalize(align))], display !== 'initial' && classes[\"display\".concat(capitalize(display))]),\n    ref: ref\n  }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? void 0 : void 0;\nexport default withStyles(styles, {\n  name: 'MuiTypography'\n})(Typography);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport capitalize from '../utils/capitalize';\nimport withStyles from '../styles/withStyles';\nimport { elementTypeAcceptingRef } from '@material-ui/utils';\nimport useIsFocusVisible from '../utils/useIsFocusVisible';\nimport useForkRef from '../utils/useForkRef';\nimport Typography from '../Typography';\nexport var styles = {\n  /* Styles applied to the root element. */\n  root: {},\n  /* Styles applied to the root element if `underline=\"none\"`. */\n  underlineNone: {\n    textDecoration: 'none'\n  },\n  /* Styles applied to the root element if `underline=\"hover\"`. */\n  underlineHover: {\n    textDecoration: 'none',\n    '&:hover': {\n      textDecoration: 'underline'\n    }\n  },\n  /* Styles applied to the root element if `underline=\"always\"`. */\n  underlineAlways: {\n    textDecoration: 'underline'\n  },\n  // Same reset as ButtonBase.root\n\n  /* Styles applied to the root element if `component=\"button\"`. */\n  button: {\n    position: 'relative',\n    WebkitTapHighlightColor: 'transparent',\n    backgroundColor: 'transparent',\n    // Reset default value\n    // We disable the focus ring for mouse, touch and keyboard users.\n    outline: 0,\n    border: 0,\n    margin: 0,\n    // Remove the margin in Safari\n    borderRadius: 0,\n    padding: 0,\n    // Remove the padding in Firefox\n    cursor: 'pointer',\n    userSelect: 'none',\n    verticalAlign: 'middle',\n    '-moz-appearance': 'none',\n    // Reset\n    '-webkit-appearance': 'none',\n    // Reset\n    '&::-moz-focus-inner': {\n      borderStyle: 'none' // Remove Firefox dotted outline.\n    },\n\n    '&$focusVisible': {\n      outline: 'auto'\n    }\n  },\n  /* Pseudo-class applied to the root element if the link is keyboard focused. */\n  focusVisible: {}\n};\nvar Link = /*#__PURE__*/React.forwardRef(function Link(props, ref) {\n  var classes = props.classes,\n    className = props.className,\n    _props$color = props.color,\n    color = _props$color === void 0 ? 'primary' : _props$color,\n    _props$component = props.component,\n    component = _props$component === void 0 ? 'a' : _props$component,\n    onBlur = props.onBlur,\n    onFocus = props.onFocus,\n    TypographyClasses = props.TypographyClasses,\n    _props$underline = props.underline,\n    underline = _props$underline === void 0 ? 'hover' : _props$underline,\n    _props$variant = props.variant,\n    variant = _props$variant === void 0 ? 'inherit' : _props$variant,\n    other = _objectWithoutProperties(props, [\"classes\", \"className\", \"color\", \"component\", \"onBlur\", \"onFocus\", \"TypographyClasses\", \"underline\", \"variant\"]);\n  var _useIsFocusVisible = useIsFocusVisible(),\n    isFocusVisible = _useIsFocusVisible.isFocusVisible,\n    onBlurVisible = _useIsFocusVisible.onBlurVisible,\n    focusVisibleRef = _useIsFocusVisible.ref;\n  var _React$useState = React.useState(false),\n    focusVisible = _React$useState[0],\n    setFocusVisible = _React$useState[1];\n  var handlerRef = useForkRef(ref, focusVisibleRef);\n  var handleBlur = function handleBlur(event) {\n    if (focusVisible) {\n      onBlurVisible();\n      setFocusVisible(false);\n    }\n    if (onBlur) {\n      onBlur(event);\n    }\n  };\n  var handleFocus = function handleFocus(event) {\n    if (isFocusVisible(event)) {\n      setFocusVisible(true);\n    }\n    if (onFocus) {\n      onFocus(event);\n    }\n  };\n  return /*#__PURE__*/React.createElement(Typography, _extends({\n    className: clsx(classes.root, classes[\"underline\".concat(capitalize(underline))], className, focusVisible && classes.focusVisible, component === 'button' && classes.button),\n    classes: TypographyClasses,\n    color: color,\n    component: component,\n    onBlur: handleBlur,\n    onFocus: handleFocus,\n    ref: handlerRef,\n    variant: variant\n  }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? void 0 : void 0;\nexport default withStyles(styles, {\n  name: 'MuiLink'\n})(Link);","import React, { useEffect, useState } from 'react'\nimport styled from 'styled-components'\nimport theme from '../styling/theme'\nimport arrhead from '../../images/back-left-arrow.svg'\nimport { appendUrlPartnerTracking } from '../../util/url'\n\nimport IconButton from '@material-ui/core/IconButton'\nimport TwitterIcon from '@material-ui/icons/Twitter'\nimport LinkedInIcon from '@material-ui/icons/LinkedIn'\nimport FacebookIcon from '@material-ui/icons/Facebook'\n\nimport { Link, makeStyles } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  customHoverFocus: {\n    width: 35,\n    height: 35,\n    '&:hover, &.Mui-focusVisible': { backgroundColor: '#2e2e2e' },\n    backgroundColor: 'black',\n    color: 'white',\n    marginRight: 5,\n  },\n  icon: {\n    width: 20,\n    height: 20,\n    fill: 'white',\n    color: 'white',\n  },\n}))\n\nconst ResourceLeftCol = ({ title }) => {\n  const classes = useStyles()\n  const [URL, setURL] = useState('')\n  useEffect(() => {\n    setURL(typeof window !== 'undefined' ? window.location.href : '')\n  }, [])\n  return (\n    <Container>\n      <Inner>\n        <Title>\n          <Course>{title}</Course>\n        </Title>\n        <BackLink href={appendUrlPartnerTracking('/resources')}>\n          <Arrow src={arrhead} alt=\"Arrow back\" />\n          <Line />\n        </BackLink>\n        {/* {description && (\n          <Description className=\"small-p\">{description}</Description>\n        )} */}\n\n        <Course>SHARE THIS ARTICLE</Course>\n\n        <SocialIcons>\n          <StyledIconButton\n            aria-label=\"linkedIn\"\n            href={`https://www.linkedin.com/sharing/share-offsite/?url=${URL}`}\n            target=\"_blank\"\n            className={classes.customHoverFocus}\n          >\n            <LinkedInIcon className={classes.icon} />\n          </StyledIconButton>\n\n          <StyledIconButton\n            aria-label=\"Twitter\"\n            href={`https://twitter.com/intent/tweet?text=Check%20out%20this%20great%20article%20from%20Bob's%20Business:%20 ${URL}`}\n            target=\"_blank\"\n            className={classes.customHoverFocus}\n          >\n            <TwitterIcon className={classes.icon} />\n          </StyledIconButton>\n\n          <StyledIconButton\n            aria-label=\"Facebook\"\n            // href={`https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(url)}`}\n            href={`https://www.facebook.com/sharer/sharer.php?u=${URL}`}\n            target=\"_blank\"\n            className={classes.customHoverFocus}\n          >\n            <FacebookIcon className={classes.icon} />\n          </StyledIconButton>\n        </SocialIcons>\n      </Inner>\n    </Container>\n  )\n}\n\nexport default ResourceLeftCol\n\nconst Container = styled.div`\n  display: none;\n  @media (min-width: 1024px) {\n    display: block;\n    width: 100%;\n    max-width: 264px;\n    position: relative;\n  }\n`\nconst Inner = styled.div`\n  position: sticky;\n  left: 0;\n  bottom: 0;\n  top: 100px;\n`\n\nconst Title = styled.div`\n  display: flex;\n  flex-direction: column;\n  margin-bottom: 25px;\n`\n\nconst Course = styled.h6`\n  color: ${theme.text.second};\n  padding-bottom: 15px;\n  margin-top: 18px;\n`\n\nconst BackLink = styled(Link)`\n  display: flex;\n  align-items: center;\n  width: 280px;\n  margin-bottom: 18px;\n`\n\nconst Arrow = styled.img`\n  height: 40px;\n  transition: all 0.5s ease;\n  position: relative;\n  left: -10px;\n  animation: arrowCourseTemplate ease 0.5s forwards 0.5s;\n  ${BackLink}:hover & {\n    transform: translateX(-20px);\n  }\n`\n\nconst Line = styled.div`\n  display: inline;\n  position: relative;\n  width: 0%;\n  height: 1px;\n  background: ${theme.brand.blue};\n  transition: all 0.5s ease;\n  animation: growLineCourseTemplate ease 0.5s forwards 0.5s;\n  ${BackLink}:hover & {\n    transform: translateX(-40px);\n  }\n`\n\nconst Description = styled.p`\n  color: ${theme.text.second};\n  font-weight: 300;\n`\nconst SocialIcons = styled.div`\n  flex-direction: row;\n`\n\nconst StyledIconButton = styled(IconButton)`\n  background-color: ${theme.brand.blue} !important;\n  color: white;\n  margin: 4px;\n\n  .root {\n    background-color: ${theme.brand.blue} !important;\n  }\n`\n","import React from 'react'\nimport { graphql, Link } from 'gatsby'\n// import TrackVisibility from 'react-on-screen'\nimport Layout from '../components/Layout'\nimport MainGrid from '../components/styling/MainGrid'\nimport Breadcrumb from '../components/shared/Breadcrumb/Breadcrumb'\nimport Img from 'gatsby-image'\nimport CustomerTemplateLayout from '../components/CustomerStories/CustomerTemplateLayout'\nimport CustomerRightCol from '../components/CustomerStories/CustomerRightCol'\nimport ResourceLeftCol from '../components/ResourcesComponents/ResourceLeftCol'\nimport { LazyBlocksFactory } from '../components/LazyBlocksFactory/LazyBlocksFactory'\nimport TrackVisibility from 'react-on-screen'\nimport PromotionBannerAnimation from '../components/PromotionBannerAnimation'\nimport { getResourceCardColor } from '../components/ResourcesComponents/ResourcesCard'\nimport styled from 'styled-components'\nimport Button from '../components/shared/Button/Button'\nimport { RichTextContainer } from '../components/RichTextContainer/RichTextContainer'\nimport { Helmet } from 'react-helmet'\n\ninterface Props {\n  data: any\n  pageContext: any\n}\nconst resourceTemplate = ({ data, pageContext }: Props) => {\n  const { wpPost } = data\n  const breadcrumbData = [\n    {\n      title: 'Home',\n      url: '/',\n    },\n    {\n      title: 'Resources',\n      url: '/resources',\n    },\n    {\n      title: wpPost.title,\n      url: '/' + wpPost.slug,\n    },\n  ]\n  // const { acfCourse2: courseData2 } = courseData\n  let featImg = null\n  try {\n    featImg = wpPost.resources.featuredImage.mediaItemUrl\n  } catch (e) {}\n\n  \n  const renderedBlocks = LazyBlocksFactory(\n    wpPost.lazy_data,\n    wpPost.title,\n    featImg\n  )\n  //console.log(wpPost.lazy_data);\n\n  function formatDate(date: string) {\n    const month = date.substring(5, 7)\n    let formatedMonth = ''\n    switch (month) {\n      case '01':\n        formatedMonth = 'January'\n        break\n      case '02':\n        formatedMonth = 'February'\n        break\n      case '03':\n        formatedMonth = 'March'\n        break\n      case '04':\n        formatedMonth = 'April'\n        break\n      case '05':\n        formatedMonth = 'May'\n        break\n      case '06':\n        formatedMonth = 'June'\n        break\n      case '07':\n        formatedMonth = 'July'\n        break\n      case '08':\n        formatedMonth = 'August'\n        break\n      case '09':\n        formatedMonth = 'September'\n        break\n      case '10':\n        formatedMonth = 'October'\n        break\n      case '11':\n        formatedMonth = 'November'\n        break\n      case '12':\n        formatedMonth = 'December'\n        break\n    }\n\n    const formatedDay = date.substring(8, 10)\n    const formatedYear = date.substring(0, 4)\n\n    const formatedDate = formatedDay + ' ' + formatedMonth + ', ' + formatedYear\n    return formatedDate\n  }\n\n  return (\n    <Layout>\n      <MainGrid noPaddingMobile noPaddingTablet backgroundMobile=\"white\">\n        <Breadcrumb data={breadcrumbData} />\n      </MainGrid>\n      <CustomerTemplateLayout>\n        {/* <CustomerLeftCol title={wpPost.title} /> */}\n        <ResourceLeftCol title={wpPost.resources.category} />\n\n        <CustomerRightCol>\n          <Pill color={getResourceCardColor(wpPost.resources.category)}>\n            {wpPost.resources.category}\n          </Pill>\n\n          <h1 style={{ marginBottom: 32 }}>{wpPost.title}</h1>\n          <b style={{ marginBottom: 67 }}>{formatDate(wpPost.date)}</b>\n\n          {wpPost.resources.downloadLink ? (\n            <DownloadLink\n              href={wpPost.resources.downloadLink.mediaItemUrl}\n              download\n            >\n              <Button>Download Assets</Button>\n            </DownloadLink>\n          ) : (\n            ''\n          )}\n          {wpPost.resources.featuredImage && (\n            <MainImage\n              fluid={\n                wpPost.resources.featuredImage.localFile.childImageSharp.fluid\n              }\n            />\n          )}\n          {/* <RichTextContainer richText={wpPost.lazy_data}/> */}\n          {renderedBlocks.map((v) => v)}\n          {wpPost.resources.downloadLink ? (\n            <DownloadLink\n              href={wpPost.resources.downloadLink.mediaItemUrl}\n              download\n            >\n              <Button>Download Assets</Button>\n            </DownloadLink>\n          ) : (\n            ''\n          )}\n          <BackToResources to=\"/resources\">Back to resources</BackToResources>\n        </CustomerRightCol>\n      </CustomerTemplateLayout>\n    </Layout>\n  )\n}\n\nexport default resourceTemplate\n\nexport const pageQuery = graphql`\n  query RescoureById($id: String!) {\n    wpPost(id: { eq: $id }) {\n      id\n      slug\n      lazy_data\n      date\n      title\n      resources {\n        fieldGroupName\n        demoLink\n        downloadLink {\n          mediaItemUrl\n        }\n        category\n        description\n        isolatedForLandingPage\n        featuredImage {\n          mediaItemUrl\n          localFile {\n            childImageSharp {\n              fluid(maxWidth: 1080, toFormat: WEBP) {\n                ...GatsbyImageSharpFluid\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n`\n\nconst BackToResources = styled(Link)`\n  font-weight: 900;\n`\n\ninterface PillBackground {\n  color: string\n}\nconst Pill = styled.span<PillBackground>`\n  background-color: ${(props) => props.color};\n  padding: 3px 8px;\n  border-radius: 9px;\n  color: white;\n  font-size: 9px;\n  text-transform: uppercase;\n  margin-right: 9px;\n`\nconst Date = styled.span`\n  font-size: 10px;\n  font-weight: 700;\n  color: #1d1e22;\n`\nconst MainImage = styled(Img)`\n  width: 100%;\n  margin: 25px 0;\n`\nconst DownloadLink = styled.a`\n  max-width: 220px;\n  margin: 37px 0 55px;\n`\n","module.exports = \"data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI0LjMuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAxOSAzNSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTkgMzU7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojMDBBM0M3O30KPC9zdHlsZT4KPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CjxnIGlkPSJQYWdlLTEiPgoJPGcgaWQ9ImNvdXJzZS10ZW1wbGF0ZV94MkZfZGVza3RvcCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTk3LjAwMDAwMCwgLTM1Mi4wMDAwMDApIj4KCQk8ZyBpZD0iQW5jaG9yZWQtc2lkZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOTcuMDAwMDAwLCAyNjUuMDAwMDAwKSI+CgkJCTxnIGlkPSJCYWNrLWFycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgNzguMDAwMDAwKSI+CgkJCQk8ZyBpZD0ic21hbGwtbGVmdC1hcnJvdyI+CgkJCQkJPHBvbHlnb24gaWQ9InBhdGgtMV8xXyIgY2xhc3M9InN0MCIgcG9pbnRzPSIwLDI2LjIgMTcuNSw0My41IDE4LjYsNDIuNCAyLjIsMjYuMiAxOC42LDEwLjEgMTcuNSw5IAkJCQkJIi8+CgkJCQk8L2c+CgkJCTwvZz4KCQk8L2c+Cgk8L2c+CjwvZz4KPC9zdmc+Cg==\"","\"use strict\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nvar _interopRequireWildcard = require(\"@babel/runtime/helpers/interopRequireWildcard\");\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\nvar React = _interopRequireWildcard(require(\"react\"));\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _default = (0, _createSvgIcon.default)( /*#__PURE__*/React.createElement(\"path\", {\n  d: \"M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14m-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93h2.79M6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37h2.77z\"\n}), 'LinkedIn');\nexports.default = _default;","\"use strict\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nvar _interopRequireWildcard = require(\"@babel/runtime/helpers/interopRequireWildcard\");\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\nvar React = _interopRequireWildcard(require(\"react\"));\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _default = (0, _createSvgIcon.default)( /*#__PURE__*/React.createElement(\"path\", {\n  d: \"M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2m13 2h-2.5A3.5 3.5 0 0 0 12 8.5V11h-2v3h2v7h3v-7h3v-3h-3V9a1 1 0 0 1 1-1h2V5z\"\n}), 'Facebook');\nexports.default = _default;"],"sourceRoot":""}