Merge pull request #6722 from vr-varad/update/projects

Add Academy to Projects

Author: vr-varad

src/assets/images/academy/academy.svg

@@ -20,6 +20,7 @@ import kanvas from "../../../assets/images/kanvas/icon-only/kanvas-icon-color.sv
 import catalog from "../../../assets/images/catalog-icon/catalog.svg";
 import sistent from "../../../assets/images/sistent/sistent-logo.svg";
 import SoSpecial from "../../Home/So-Special-Section";
+import academy from "../../../assets/images/academy/academy.svg";
 
 const ProjectPage = () => {
   const { isDark } = useContext(ThemeManagerContext);
@@ -43,6 +44,13 @@ const ProjectPage = () => {
                 <h5>Sistent</h5>
               </div>
             </Link>
+            {/*TODD - The URL needs to be changed */}
+            <Link to="https://cloud.layer5.io/academy" className="project__card academy">
+              <div className="project__card-container project__card-container_one">
+                <img src={academy} alt="Academy" />
+                <h5>Academy</h5>
+              </div>
+            </Link>
             <Link to="/service-mesh-landscape" className="project__card one">
               <div className="project__card-container project__card-container_one">
                 <img src={landscape} alt="Landscape" />

src/sections/Projects/Project-grid/index.js

@@ -164,7 +164,7 @@ export const ProjectWrapper = styled.div`
     grid-column: 6/8;
     grid-row: 1/3;
     img {
-      width: 75px;
+      width: 105px;
       align-self: center;
     }
     h5 {
@@ -175,7 +175,7 @@ export const ProjectWrapper = styled.div`
 
   // Sistent
   .project__card.sistent {
-    grid-column: 1/3;
+    grid-column: 1/2;
     grid-row: 1/3;
     img {
       width: 85px;
@@ -187,6 +187,20 @@ export const ProjectWrapper = styled.div`
     }
   }
 
+  // Academy
+  .project__card.academy {
+    grid-column: 2/3;
+    grid-row: 1/3;
+    img {
+      width: 85px;
+      align-self: center;
+      margin-bottom: 14px;
+    }
+    h5 {
+      align-self: center;
+    }
+}
+
   // Service Mesh Performance
   .project__card.five {
     grid-column: 1/2;