Merge branch 'master' of https://github.com/layer5io/layer5 into anku…

…shbhardwaj408-layer5io#4395

.gitignore

@@ -90,4 +90,5 @@ default.profraw
 .husky/_/
 
 # Lighthouse CI
-.lighthouseci/
+.lighthouseci/
+.gitpod.yml

.gitpod.yml

@@ -0,0 +1,11 @@
+# This configuration file was automatically generated by Gitpod.
+# Please adjust to your needs (see https://www.gitpod.io/docs/introduction/learn-gitpod/gitpod-yaml)
+# and commit this file to your remote git repository to share the goodness with others.
+
+# Learn more from ready-to-use templates: https://www.gitpod.io/docs/introduction/getting-started/quickstart
+
+tasks:
+  - init: npm install && npm run build && make
+    command: npm run start
+
+

package.json

@@ -38,7 +38,7 @@
     "axios": "^1.4.0",
     "babel-plugin-styled-components": "^2.1.4",
     "babel-preset-gatsby": "^2.22.0",
-    "cytoscape": "^3.23.0",
+    "cytoscape": "^3.26.0",
     "cytoscape-cose-bilkent": "^4.1.0",
     "cytoscape-fcose": "^2.2.0",
     "dedent": "^0.7.0",
@@ -66,7 +66,7 @@
     "gatsby-transformer-sharp": "^4.25.0",
     "gbimage-bridge": "^0.2.2",
     "gsap": "^3.12.2",
-    "joi": "^17.7.0",
+    "joi": "^17.10.2",
     "js-search": "^2.0.0",
     "lodash": "^4.17.21",
     "prism-react-renderer": "^1.3.5",

src/collections/members/Mohammed-zaki/index.mdx

@@ -0,0 +1,15 @@
+---
+name: Mohammed Zaki
+position: Contributor
+image_path: ./zakisk.webp
+github: zakisk
+twitter: dev_zaki
+linkedin: mohammed-zaki-shaikh-907242125
+layer5: 6a6ccef1-39d0-4ac4-8ae1-dc47d455d7ff
+location: Maharashtra, India
+bio: Enthusiastic Golang developer passionate about cloud-native solutions, skilled in crafting RESTful APIs, gRPC services, and CLI applications. Actively contributes to open source projects, acquiring valuable domain expertise. Adept problem solver, versatile across software development domains, and eager to learn through hands-on experience
+badges: 
+  - meshery
+status: Active
+published: true
+---

src/collections/members/aabid-sofi/index.mdx

@@ -9,6 +9,7 @@ location: Srinagar, Jammu & Kashmir, India
 bio: Hi, I'm Aabid Sofi, a software engineer and web developer.
      I specialize in creating custom software and web applications that are both functional and visually appealing, with a focus on design, security, and performance. Highly passionate about cloud native and open source .
 badges:
+   - meshmap
 status: Active
 published: true
 ---

src/collections/members/akshay-sharma/index.mdx

@@ -0,0 +1,13 @@
+---
+name: Akshay Sharma
+position: Contributor
+image_path: ./akshay-sharma.webp
+github: captain-Akshay
+twitter: akshay_0503
+linkedin: akshay-sharma-76a267203
+layer5: 51f49d2c-0050-4bdb-9bce-fdddcb4742be
+location: West Bengal, India
+bio: "Hi,I like to code!"
+status: Active
+published: true
+---

src/collections/members/archit-sharma/index.mdx

@@ -0,0 +1,13 @@
+---
+name: Archit Sharma
+position: Contributor
+image_path: ./Archit-Sharma.webp
+github: iArchitSharma
+twitter: IArchitSharma
+linkedin: iarchitsharma
+layer5: 2662825c-2bc7-4dea-a7ef-91269d334f71
+location: India
+bio: "Hi, I'm Archit Sharma, an undergraduate student in Information Technology and an open-source enthusiast. I enjoy contributing to open-source projects and building web applications using Node.js and React."
+status: Active
+published: true
+---

src/collections/members/parthib-datta/index.mdx

@@ -0,0 +1,13 @@
+---
+name: Parthib Datta
+position: Contributor
+image_path: ./parthib-datta.webp
+github: ptdatta
+twitter: parthibdatta123
+linkedin: parthib-datta-90b29b1b4
+layer5: 55a18ae1-fef3-4ffc-a385-1973ca2c9fd8
+location: India
+bio: "Hi there! I'm a passionate software engineer currently pursuing my B.Tech in Computer Science at the University of Calcutta. I thrive in the world of technology and have a deep love for Open Source and community-driven initiatives. My interests span the entire spectrum of full-stack development, from crafting user-friendly frontends to building robust backends and optimizing infrastructure for seamless user experiences. I'm dedicated to creating innovative solutions that make a positive impact and am excited to continue my journey in the world of technology."
+status: Active
+published: true
+---

src/collections/members/rhoda-michael/index.mdx

@@ -8,6 +8,8 @@ linkedin: rhodamichael
 layer5: b93a7eef-01f1-4ab0-b129-690b28b6a6d7
 location: Jos, Nigeria
 bio: " I'm Rhoda Michael, a User Experience Designer/Researcher based in Nigeria I focus on accessibility and inclusion for users. I enjoy writing and reading."
+badges:
+  - ui-ux
 status: Active
 published: true
 ---

src/collections/members/sandra-ashipala/index.mdx

@@ -0,0 +1,14 @@
+---
+name: Sandra Ashipala
+position: Contributor
+image_path: ./sandra-ashipala.webp
+github: sandramsc
+twitter: sandraamsc
+linkedin: sandraashipala
+layer5: aaeb3b36-ac02-450a-bb7e-964ad9d818e4
+location: Namibia
+bio: "With a diverse international background, I've collaborated with companies in Germany, France, and Italy, gaining a broad perspective on software development. Thriving in diverse teams, I've worked with individuals from various backgrounds and cultures. These international collaborations expanded my professional horizons and instilled a deep appreciation for diversity's power in driving innovation.
+I hold a Master's in Computer Science from the Technical University of Berlin. Currently, I'm enhancing my skills in DevOps and Python. My journey of growth includes active participation in the Layer5 open-source community, where I eagerly contribute and thrive in the world of service mesh technology."
+status: Active
+published: true
+---

src/collections/members/saurabh soni/index.mdx

@@ -8,6 +8,8 @@ linkedin: saurabh100ni
 layer5: 489cc007-64cb-407d-a620-f5c046399bb2
 location: Gwalior, Madhya Pradesh, India
 bio: "I'm a former Google Developer Students Club Lead and founded a community of 600+ people out of my passion for the people and the community, now I'm here to start my new journey at layer5."
+badges:
+  - community
 status: Active
 published: true
 ---

src/collections/members/senali-dilumika/index.mdx

@@ -10,6 +10,8 @@ location: Colombo, Sri Lanka
 bio: Hi, I possess a strong passion for software development. Contributing to Layer5 has been an amazing experience. Collaboration is an excellent way to learn and grow within the tech community. I'm constantly learning new things due to my curiosity and interest in exploring new things.
 badges: 
   - docs
+  - meshmap
+  - meshery-catalog
 status: Active
 published: true
 ---

src/collections/members/sudhanshu-dasgupta/index.mdx

@@ -16,5 +16,6 @@ status: Active
 badges:
  - meshery
  - meshery-catalog
+ - community
 published: true
 ---

src/collections/members/yash-sharma/index.mdx

@@ -11,6 +11,7 @@ bio: "Hi there! I'm an enthusiastic technology lover who's always on the lookout
 badges: 
   - meshery
   - meshery-catalog
+  - meshmap
 status: Active
 meshmate: yes
 published: true

src/components/SocialLinks-Color/index.js

@@ -3,7 +3,7 @@ import { Col, Row } from "../../reusecore/Layout";
 import forum_icon from "../../assets/images/socialIcons/forum.svg";
 import mail_icon from "../../assets/images/socialIcons/mail_keppel.svg";
 import slack_icon from "../../assets/images/socialIcons/slack-light.svg";
-import twitter_icon from "../../assets/images/socialIcons/twitter-light.svg";
+import { ReactComponent as TwitterIcon } from "../../assets/images/socialIcons/twitter.svg";
 import github_icon from "../../assets/images/socialIcons/github.svg";
 import youtube_icon from "../../assets/images/socialIcons/youtube.svg";
 import docker_icon from "../../assets/images/socialIcons/docker.svg";
@@ -15,11 +15,7 @@ const SocialLinksColor = () => {
     <SocialLinksWrapper>
       <Col xs={12}>
         <Row className="social_icons">
-          <a
-            href="https://discuss.layer5.io"
-            target="_blank"
-            rel="noreferrer"
-          >
+          <a href="https://discuss.layer5.io" target="_blank" rel="noreferrer">
             <img height="30px" src={forum_icon} alt="forum" />
           </a>
           <a
@@ -33,25 +29,21 @@ const SocialLinksColor = () => {
           <a href="https://slack.layer5.io/" target="_blank" rel="noreferrer">
             <img className="slack" height="30px" src={slack_icon} alt="slack" />
           </a>
-          <a href="https://twitter.com/layer5" target="_blank" rel="noreferrer">
-            <img
-              className="twitter"
-              height="30px"
-              src={twitter_icon}
-              alt="twitter"
-            />
+          <a
+            href="https://twitter.com/layer5"
+            target="_blank"
+            rel="noreferrer"
+            className="footer_twitter"
+          >
+            <TwitterIcon />
           </a>
           <a
             href="https://github.com/layer5io"
             target="_blank"
             rel="noreferrer"
             className="github"
           >
-            <img
-              height="30px"
-              src={github_icon}
-              alt="github"
-            />
+            <img height="30px" src={github_icon} alt="github" />
           </a>
           <a
             href="https://www.linkedin.com/company/layer5"
@@ -97,4 +89,4 @@ const SocialLinksColor = () => {
   );
 };
 
-export default SocialLinksColor;
+export default SocialLinksColor;

src/components/SocialLinks-Color/sociallinkscolor.style.js

@@ -1,46 +1,45 @@
 import styled from "styled-components";
 
 const SocialLinksWrapper = styled.div`
-
-    .social_icons {
-        justify-content: flex-end;
-
-        a {
-            margin: 0 0.3rem;
-            width: 2.5rem;
-            filter: grayscale(1) invert(0.25);
-
-            img {
-                width: 2rem;
-            }
-
-            &:hover {
-                filter: grayscale(0) invert(0);
-            }
-        }
-        .github:hover {
-            filter: grayscale(0) invert(1);
-        }
-        .github {
-            filter: grayscale(1.5) invert(0.38);
-        }
-
-        .mail_icon {
-            img {
-                padding: 0.1rem;
-                border-radius: 0.25rem;
-            }
-        }
-
+  .social_icons {
+    justify-content: flex-end;
+    .footer_twitter:hover {
+      color: #fff;
+    }
+    a {
+      margin: 0 0.3rem;
+      width: 2.5rem;
+      filter: grayscale(1) invert(0.25);
+
+      img {
+        width: 2rem;
+      }
+
+      &:hover {
+        filter: grayscale(0) invert(0);
+      }
+    }
+    .github:hover {
+      filter: grayscale(0) invert(1);
+    }
+    .github {
+      filter: grayscale(1.5) invert(0.38);
     }
 
+    .mail_icon {
+      img {
+        padding: 0.1rem;
+        border-radius: 0.25rem;
+      }
+    }
+  }
 
-    @media screen and (max-width: 575px) {
-        .social_icons {
-            margin-bottom: 2rem;
-            justify-content: center;
-        }
+  @media screen and (max-width: 575px) {
+    .social_icons {
+      margin-bottom: 2rem;
+      justify-content: center;
     }
+  }
 `;
 
-export default SocialLinksWrapper;
+export default SocialLinksWrapper;