Skip to content

move /community-images to /static/images/community and added gatsby-source-filesystem for /static/images #7494

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
saurabhraghuvanshii wants to merge 6 commits into
base: master
Choose a base branch
from
+403 −272
Open

move /community-images to /static/images/community and added gatsby-source-filesystem for /static/images #7494

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
c1c46ed
move /community-images to /static/images/community
saurabhraghuvanshii Mar 11, 2026
1688d52
Merge branch 'master' into images
saurabhraghuvanshii Mar 11, 2026
5b37bbe
Merge branch 'master' into images
saurabhraghuvanshii Mar 11, 2026
66d3261
Merge branch 'master' into images
saurabhraghuvanshii Mar 12, 2026
efa1e8a
remove static/image source-file
saurabhraghuvanshii Mar 12, 2026
e5fa67d
rename images and add array
saurabhraghuvanshii Mar 12, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
334 changes: 167 additions & 167 deletions gatsby-config.js
View file
Open in desktop

Large diffs are not rendered by default.

Binary file removed src/assets/images/programs/Layer5-mentor-program.webp
View file
Open in desktop
Binary file not shown.
61 changes: 47 additions & 14 deletions src/sections/Careers/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import React from "react";
import { StaticImage } from "gatsby-plugin-image";
import { withPrefix } from "gatsby";
import { Container } from "../../reusecore/Layout";
import { Row } from "../../reusecore/Layout";
import PageHeader from "../../reusecore/PageHeader";
import InternshipPage from "./Careers-Internship-grid";
import Five from "../../sections/Community/Community-pictures/community.webp";
import JoinCommunity from "../Community/Join-community";
import CareersSectionWrapper from "./careers.style";

Expand All @@ -16,41 +16,74 @@ const CareersPage = () => {
<PageHeader title="Come Work with us" path="Careers" />
<div className="careers-section-wrapper">
<Container>
<p className="centerTexts">If you’re a smart, curious person who can make contributions in and out of your areas of expertise, why not start now?</p>
<p className="centerTexts">
If you’re a smart, curious person who can make contributions in and
out of your areas of expertise, why not start now?
</p>
</Container>
<Container>
<Row className="videoText">
<div className="introText">
<h2>Layer5 Culture</h2>
<p>All team members <strong>are expected to... </strong>
take initiative, execute briskly, debate in the discussion, then execute post-haste on the decision, irrespective of the specific decision.
<p>
All team members <strong>are expected to... </strong>
take initiative, execute briskly, debate in the discussion, then
execute post-haste on the decision, irrespective of the specific
decision.
</p>
<p>All team members <strong>should expect to... </strong>
be challenged, to work hard, to play hard, to be recognized, to grow and help others grow.
<p>
All team members <strong>should expect to... </strong>
be challenged, to work hard, to play hard, to be recognized, to
grow and help others grow.
</p>
<p><strong>You should... </strong>
pay attention to detail and take pride in your work. Know when to prioritize and have the discipline to adhere to those priorities. Focus on the customer. Pay it forward and enable others. Bring solutions with the problems. Take out the trash (do grunt work) as needed.
<p>
<strong>You should... </strong>
pay attention to detail and take pride in your work. Know when
to prioritize and have the discipline to adhere to those
priorities. Focus on the customer. Pay it forward and enable
others. Bring solutions with the problems. Take out the trash
(do grunt work) as needed.
</p>
</div>
<div className="introImage">
<StaticImage src={Layer5_culture} alt="Five holding Layer5 banner" />
<StaticImage
src={Layer5_culture}
alt="Five holding Layer5 banner"
/>
</div>
</Row>
</Container>
<div className="opportunity-section">
<InternshipPage hide_heading={true} />
</div>

<JoinCommunity image={Five} />
<JoinCommunity image={withPrefix("/images/community/community.webp")} />
<Container>
<br />
<p className="center">Open source contributors come in all shapes, sizes, colors and so on. All are welcome in the Layer5 projects and community!!</p>

<p className="center">Layer5 goes out of its way to welcome and encourage new contributors. We often assign newcomers an onboarding buddy, a MeshMate, to ensure that newcomers get both introduced to the projects within the community and introduced around to other individuals. We strive to help them get a foothold on a crevice of one of our initiatives, instilling and nurturing a sense of ownership, so that they feel at-home as they become a regular contributor.</p>
<p className="center">
We also spend a great deal of time trying to recognize and uplift contributors on the Layer5 and Meshery Twitter accounts whether “contribution” means code or any of the other various forms of being involved int the projects and community. Likewise, we try to lift up contributors’ works on the Layer5 and Meshery LinkedIn pages, too. And, while it’s not a world stage, we openly and publicly share our community meetings on YouTube.
Open source contributors come in all shapes, sizes, colors and so
on. All are welcome in the Layer5 projects and community!!
</p>

<p className="center">
Layer5 goes out of its way to welcome and encourage new
contributors. We often assign newcomers an onboarding buddy, a
MeshMate, to ensure that newcomers get both introduced to the
projects within the community and introduced around to other
individuals. We strive to help them get a foothold on a crevice of
one of our initiatives, instilling and nurturing a sense of
ownership, so that they feel at-home as they become a regular
contributor.
</p>
<p className="center">
We also spend a great deal of time trying to recognize and uplift
contributors on the Layer5 and Meshery Twitter accounts whether
“contribution” means code or any of the other various forms of being
involved int the projects and community. Likewise, we try to lift up
contributors’ works on the Layer5 and Meshery LinkedIn pages, too.
And, while it’s not a world stage, we openly and publicly share our
community meetings on YouTube.
</p>
</Container>
</div>
</CareersSectionWrapper>
Expand Down
132 changes: 84 additions & 48 deletions src/sections/Community/Newcomers-guide/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,20 +1,22 @@
import React, { useState } from "react";
import { Link } from "gatsby";
import { Link, withPrefix } from "gatsby";
import Button from "../../../reusecore/Button";
import { Col, Container, Row } from "../../../reusecore/Layout";
import PageHeader from "../../../reusecore/PageHeader";
import { NewcomersGuideWrapper } from "./NewcomersPageWrapper.style";
import CommunityImage4 from "../Community-pictures/community.webp";
import TutorialsTable from "./Tutorials-table";
import NewcomersMap from "./newcomers-map";
import JoinCommunity from "../Join-community";
import longArrow from "./long-arrow.svg";
import { StaticImage } from "gatsby-plugin-image";

const CommunityImage2 = "../Community-pictures/five-finding-issue.webp";
const CommunityImage3 = "../../../assets/images/newcomers-page-images/community-collage.webp";
const FiveWorking = "../Community-pictures/five-working.webp";
const CommunityHandbook = "../Community-pictures/community-handbook.webp";
const CommunityImage2 = withPrefix("/images/community/five-finding-issue.webp");
const CommunityImage3 =
"../../../assets/images/newcomers-page-images/community-collage.webp";
const FiveWorking = withPrefix("/images/community/five-working.webp");
const CommunityHandbook = withPrefix(
"/images/community/community-handbook.webp",
);
const CommunityImage4 = withPrefix("/images/community/community.webp");

const NewcomersGuide = () => {
const [hover, setHover] = useState(false);
Expand All @@ -25,19 +27,25 @@ const NewcomersGuide = () => {
<Container>
<div className="newcomers-welcome">
<p>
Whether you are a first time contributor or an open source
veteran, you are welcome to contribute to and actively engage in the
Whether you are a first time contributor or an open source veteran,
you are welcome to contribute to and actively engage in the
development of projects at Layer5. Here are some instructions to get
you started and if you haven’t joined yet, join the{" "}
<a href="https://slack.layer5.io/" target="_blank" rel="noreferrer">
Slack workspace
</a>{" "}
to collaborate with the community and the <a href="https://discuss.layer5.io" target="">discussion forum</a> for questions. Also, you can check the
quick-links below for jumping straight into things.
to collaborate with the community and the{" "}
<a href="https://discuss.layer5.io" target="">
discussion forum
</a>{" "}
for questions. Also, you can check the quick-links below for jumping
straight into things.
</p>
<Row style={{
flexWrap: "wrap"
}} className="newcomers-journey"
<Row
style={{
flexWrap: "wrap",
}}
className="newcomers-journey"
>
<Col
className="heading"
Expand All @@ -61,43 +69,60 @@ const NewcomersGuide = () => {
</Row>
<Row className="how-to-contribute">
<p>
These steps outline the process by which you can
openly engage, learn, and participate in the broad set of open
source projects at Layer5. If at any time you get stuck, please
seek help in the{" "}
These steps outline the process by which you can openly engage,
learn, and participate in the broad set of open source projects at
Layer5. If at any time you get stuck, please seek help in the{" "}
<a
href="https://discuss.layer5.io"
target="_blank"
rel="noreferrer"
>
community forum
</a>{""}.
Our{" "}
<Link to="/community/meshmates">MeshMates</Link> and community
members are here to help!
</a>
{""}. Our <Link to="/community/meshmates">MeshMates</Link> and
community members are here to help!
</p>
</Row>
</div>
<div className="instructions">
<Row style={{
flexWrap: "wrap"
}} className="step"
<Row
style={{
flexWrap: "wrap",
}}
className="step"
>
<Col $sm={12} $lg={6}>
<h3>Fill in the Community Member Form</h3>
<p>Help us get to know you, so that we can highlight projects and initiatives that align with your interests. Fill-in a community member form. Gain access to community resources.</p>
<p>
Help us get to know you, so that we can highlight projects and
initiatives that align with your interests. Fill-in a community
member form. Gain access to community resources.
</p>
</Col>
<Col $sm={12} $lg={6} className="col-newcomers-form">
<Button $primary className="newcomers-form" title="Submit a Member Form" $url="/newcomer" $external={false} />
<Button
$primary
className="newcomers-form"
title="Submit a Member Form"
$url="/newcomer"
$external={false}
/>
</Col>
<Col $sm={12} $lg={6} className="col-finding-an-issue">
<div className="finding-an-issue">
<StaticImage src={CommunityImage2} alt="Five Working Image" />
<img src={CommunityImage2} alt="Five Working Image" />
</div>
</Col>
<Col $sm={12} $lg={6}>
<h3>Finding an Issue to Work On</h3>
<p>Note that the Layer5 community spans six GitHub organizations. See all in the <Link to="/community/handbook/repository-overview">repository overview</Link>.</p>
<p>
Note that the Layer5 community spans six GitHub organizations.
See all in the{" "}
<Link to="/community/handbook/repository-overview">
repository overview
</Link>
.
</p>
<ol type="i">
<li>
Browse the list of{" "}
Expand Down Expand Up @@ -131,10 +156,12 @@ const NewcomersGuide = () => {
” label.
</li>
<li>
Find an area of interest by perusing the list of projects by repository and technology in the{" "}
Find an area of interest by perusing the list of projects by
repository and technology in the{" "}
<Link to="/community/handbook/repository-overview/">
Layer5 Repository Overview
</Link>.
</Link>
.
</li>
<li>
After identifying the issue you wish to work on, check whether
Expand All @@ -145,9 +172,11 @@ const NewcomersGuide = () => {
</ol>
</Col>
</Row>
<Row style={{
flexWrap: "wrap"
}} className="step"
<Row
style={{
flexWrap: "wrap",
}}
className="step"
>
<Col $sm={12} $lg={6}>
<h3>Working on Your Issue</h3>
Expand Down Expand Up @@ -193,31 +222,36 @@ const NewcomersGuide = () => {
>
#newcomers
</a>{" "}
channel in our Slack workspace. Introduce yourself and ask questions.
channel in our Slack workspace. Introduce yourself and ask
questions.
</li>
</ol>
</Col>
<Col $sm={12} $lg={6} className="community-img">
<StaticImage src={FiveWorking} alt="Five Working Image" />
<img src={FiveWorking} alt="Five Working Image" />
</Col>
</Row>
<Row style={{ flexWrap: "wrap" }} className="step">
<Col $sm={12} $lg={6} className="community-collage">
<a className="book-container" href="https://layer5.io/community/handbook/">
<a
className="book-container"
href="https://layer5.io/community/handbook/"
>
<div className="book">
<div>
<StaticImage src={CommunityHandbook} alt="Community Image" />
<img src={CommunityHandbook} alt="Community Image" />
</div>
</div>
</a>
</Col>
<Col $sm={12} $lg={6}>
<h3>Explore the Meshery Community</h3>
<p>
The community is growing at a tremendous rate. We value our connections
and that is what makes us unique. Whether it is your first meeting or
your tenth contribution, we want to make sure that you are supported and
equipped to take advantage of all of that the community has to offer.
The community is growing at a tremendous rate. We value our
connections and that is what makes us unique. Whether it is your
first meeting or your tenth contribution, we want to make sure
that you are supported and equipped to take advantage of all of
that the community has to offer.
</p>
</Col>
</Row>
Expand All @@ -229,26 +263,28 @@ const NewcomersGuide = () => {
Be patient. There are a large number of contributors and only a
small number of maintainers/reviewers. All contributors are
equally important to us, and we'll be sure to get to you as soon
as possible. In the meanwhile, you are welcome to engage in the Layer5{" "}
as possible. In the meanwhile, you are welcome to engage in the
Layer5{" "}
<a
href="https://discuss.layer5.io/"
target="_blank"
rel="noreferrer"
>
discussion forum
</a>, join our{" "}
discussion forum
</a>
, join our{" "}
<a
href="https://slack.layer5.io/"
target="_blank"
rel="noreferrer"
>
Slack workspace
Slack workspace
</a>{" "}
and take a look at all our <Link to="/projects">projects</Link>.
and take a look at all our <Link to="/projects">projects</Link>.
</p>
</Col>
<Col $sm={12} $lg={6} className="community-collage">
<StaticImage src={CommunityImage3} alt="Community Image" />
<img src={CommunityImage3} alt="Community Image" />
</Col>
</Row>
</div>
Expand Down
Loading
Loading