Merge branch 'master' into lint

Signed-off-by: jamieplu <179417684+jamieplu@users.noreply.github.com>

Author: jamieplu

src/sections/Learn/Workshop-grid/index.js

@@ -1,6 +1,5 @@
 import React, { useState, useRef } from "react";
 import { graphql, useStaticQuery, Link } from "gatsby";
-import { MDXRenderer } from "gatsby-plugin-mdx";
 
 import { Container, Row, Col } from "../../../reusecore/Layout";
 import WorkshopCard from "../../../components/Workshop-Card";
@@ -46,7 +45,6 @@ const WorkshopsPage = () => {
       fields {
         slug
       }
-      body
     }
   }
 }`
@@ -103,9 +101,8 @@ const WorkshopsPage = () => {
           <div className="workshop-grid-wrapper">
             <Row style={{
               flexWrap: "wrap"
-            }}
-            >
-              {data.allMdx.nodes.map(({ id, frontmatter, fields, body }) => (
+            }}>
+              {data.allMdx.nodes.map(({ id, frontmatter, fields }) => (
                 <Col {...content && ID === id ? { $xs: 12, $sm: 12, $lg: 12 } : { $xs: 12, $sm: 6, $lg: 4 } } key={id} className="workshop-grid-col">
                   <div className="workshop-grid-card" ref={(el) => {
                     if (el) scrollRefMap.current[id] = el;
@@ -114,7 +111,7 @@ const WorkshopsPage = () => {
                     <WorkshopCard frontmatter={frontmatter} content={content} ID={ID} id={id} />
                     <div className={content && ID === id ? "active" : "text-contents"}>
                       <div className="content">
-                        <MDXRenderer>{body}</MDXRenderer>
+                        <p>{frontmatter.abstract}</p>
                       </div>
                     </div>
                     <div className={content && ID === id ? "btn-and-status-open" : "btn-and-status"}>