Fix: Update

Signed-off-by: vr-varad <varadgupta21@gmail.com>

Author: vr-varad

gatsby-node.js

@@ -72,6 +72,12 @@ exports.createPages = async ({ actions, graphql, reporter }) => {
     redirectInBrowser: true,
     isPermanent: true,
   });
+  createRedirect({
+    fromPath: "/learn/service-mesh-workshops",
+    toPath: "/learn/workshops",
+    redirectInBrowser: true,
+    isPermanent: true,
+  });
   createRedirect({
     fromPath: "/workshops",
     toPath: "/learn/workshops",

src/components/Workshop-Card/WorkshopsCardWrapper.style.js

@@ -42,6 +42,11 @@ const WorkshopCardWrapper = styled.div`
     width: 100%;
     height: auto;
     margin-bottom: 1.25rem;
+
+    .image {
+      height: 35rem;
+    }
+      
   }
 
   .image {
@@ -67,7 +72,7 @@ const WorkshopCardWrapper = styled.div`
     display: block;
     width: 100%;
     text-align: center;
-    margin-top: 0.625rem;
+    margin-top: -5rem;
     transition: all 0.25s ease-in;
   }
 

src/reusecore/PageHeader/index.js

@@ -20,7 +20,7 @@ const authorField = (author, isSlugAvailable) => {
   );
 };
 
-const PageHeader = ({ category, title, img, feedlink, subtitle, author, thumbnail, superscript, date }) => {
+const PageHeader = ({ category, title, img, feedlink, subtitle, author, thumbnail, superscript, date, noAspectRatio = false }) => {
   let isSlugAvailable = false;
   if (author){
     const validMembers = useStaticQuery(
@@ -45,7 +45,7 @@ const PageHeader = ({ category, title, img, feedlink, subtitle, author, thumbnai
   return (
     <PageHeaderWrapper>
       <div className="page-header">
-        { thumbnail && <div className="feature-image" style={{ aspectRatio: "16/9", minHeight: "250px" }}>
+        { thumbnail && <div className="feature-image" style={noAspectRatio ? { minHeight: "250px" }: { aspectRatio: "16/9", minHeight: "250px" }}>
           <Image {...thumbnail} imgStyle={{ objectFit: "contain" }} alt={title}/>
         </div>}
         <h1 className="page-title" >{title}  <sup className="supscript">{superscript}</sup>{ img && feedlink && (<a href= {feedlink} target="_blank" rel="noreferrer"> <img src={img} alt="RSS Feed"/> </a>) } </h1>

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

@@ -27,6 +27,7 @@ const WorkshopSinglePage = ({ frontmatter, body }) => {
         title={frontmatter.title}
         subtitle={frontmatter.abstract}
         thumbnail={frontmatter.thumbnail}
+        noAspectRatio={true}
       />
       <Container>
         <div className="cardContent">