This is an automated email from the ASF dual-hosted git repository.
lhotari pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/pulsar-site.git
The following commit(s) were added to refs/heads/main by this push:
new b82bb661fab Add GitHub Discussions to the discussions section.
Refactor related components. (#414)
b82bb661fab is described below
commit b82bb661fabd271439bacf6a021cf5d21d06c09e
Author: Kiryl Valkovich <[email protected]>
AuthorDate: Thu Feb 16 10:55:57 2023 +0300
Add GitHub Discussions to the discussions section. Refactor related
components. (#414)
* Refactor discussions section. Add GitHub Discussions option.
* Remove package-lock.json
* Remove unnecessary text
---
.editorconfig | 15 +
src/components/PillButton.js | 14 -
src/components/PillButton.tsx | 24 +
src/pages/community.tsx | 581 ---------------------
src/pages/community/DiscussionPlatform.module.css | 10 +
src/pages/community/DiscussionPlatform.tsx | 62 +++
src/pages/community/DiscussionPlatforms.module.css | 11 +
src/pages/community/DiscussionPlatforms.tsx | 195 +++++++
src/pages/community/Slider.tsx | 102 ++++
src/pages/community/index.tsx | 321 ++++++++++++
static/img/Slack_Mark.svg | 45 +-
static/img/community-meetings.svg | 5 +
static/img/github-mark.svg | 1 +
static/img/logo-stackoverflow.svg | 7 -
static/img/mailing-list.svg | 10 +-
static/img/stackoverflow-logo.svg | 6 +
static/img/wechat-logo.svg | 9 +-
17 files changed, 777 insertions(+), 641 deletions(-)
diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 00000000000..120748ded38
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,15 @@
+# EditorConfig helps maintain consistent coding styles for multiple developers
working on the same project across various editors and IDEs.
+# More: https://editorconfig.org/
+
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+trim_trailing_whitespace = true
+insert_final_newline = true
+charset = utf-8
+end_of_line = lf
+
+[Makefile]
+indent_style = tab
\ No newline at end of file
diff --git a/src/components/PillButton.js b/src/components/PillButton.js
deleted file mode 100644
index 16fa0992022..00000000000
--- a/src/components/PillButton.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from "react";
-
-const PillButton = (props) => {
- return (
- <a
- className={`pill-btn ${props.variant}`}
- href={props.href}
- target={props.target}
- >
- {props.children}
- </a>
- );
-};
-export default PillButton;
diff --git a/src/components/PillButton.tsx b/src/components/PillButton.tsx
new file mode 100644
index 00000000000..bd5b58c2922
--- /dev/null
+++ b/src/components/PillButton.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+export type PillButtonVariant = "primary" | "grey" | "outline" |
"white-outline";
+
+export type PillButtonProps = {
+ variant: PillButtonVariant,
+ href: string,
+ target?: '_blank' | '_self' | '_parent' | '_top',
+ children: React.ReactNode
+}
+
+const PillButton: React.FC<PillButtonProps> = (props) => {
+ return (
+ <a
+ className={`pill-btn ${props.variant}`}
+ href={props.href}
+ target={props.target}
+ >
+ {props.children}
+ </a>
+ );
+};
+
+export default PillButton;
diff --git a/src/pages/community.tsx b/src/pages/community.tsx
deleted file mode 100644
index c85a254796f..00000000000
--- a/src/pages/community.tsx
+++ /dev/null
@@ -1,581 +0,0 @@
-import React, {useEffect} from "react";
-import Layout from "@theme/Layout";
-import useBaseUrl from "@docusaurus/useBaseUrl";
-import TeamTable from "@site/src/components/TeamTable";
-import PromoCallout from "@site/src/components/PromoCallout";
-import PillButton from "@site/src/components/PillButton";
-import GroupsIcon from "@mui/icons-material/Groups";
-import WavySeparatorFive from "@site/static/img/separator-5.svg";
-import WavySeparatorSix from "@site/static/img/separator-6.svg";
-import {pageUrl} from "@site/src/utils";
-import team from "@site/data/team"
-
-export default function Community(): JSX.Element {
- // Images in this array are used in the carousel
- const slidesArr = [
- {
- img: useBaseUrl("/img/community-photo-small.jpg"),
- alt: "community photo",
- },
- {
- img: useBaseUrl("/img/community-image-2.jpg"),
- alt: "community photo 2",
- },
- {
- img: useBaseUrl("/img/community-image-3.jpg"),
- alt: "community photo 3",
- },
- ];
-
- useEffect(() => {
- // used to scroll to anchor on the page
- if (location.hash) {
- let hash = location.hash;
- let id = hash.split("-")[1];
- let target = document.getElementById(id);
- if (target) {
- target.scrollIntoView({
- behavior: "smooth", // smooth scroll
- block: "start", // the upper border of the element will be
aligned at the top of the visible part of the window of the scrollable area.
- });
- }
- }
-
- // highlights the link in the navigation when that section is in the
viewport
- const sections = document.querySelectorAll(".scrollable");
- const links = document.querySelectorAll(".scroll-link");
- var observer = new IntersectionObserver(
- function (entries) {
- if (entries[0].isIntersecting === true) {
- let id = entries[0].target.id;
- let target = "scroll-" + id;
- links.forEach(l => {
- l.classList.remove("active-section");
- });
- let finalTarget = document.getElementById(target);
- if (finalTarget) {
- finalTarget.classList.add("active-section");
- }
- }
- },
- { threshold: [0.5] }
- );
- sections.forEach(s => {
- observer.observe(document.getElementById(s.id));
- });
-
- // This code runs the image carousel
- const slides = document.querySelectorAll(".slide-image");
- const allDots = document.getElementsByClassName("dot");
- const firstSlide = document.getElementById("slide-0");
- const firstDot = document.getElementById("dot-0");
- firstSlide.classList.add("active-slide");
- firstDot.classList.add("active-dot");
- const dots = document.querySelectorAll(".dot");
- const slideCount = slides.length;
- const intervalTime = 4000;
- let interval;
- let counter = 0;
- function cycleSlides() {
- const active = document.querySelector(".active-slide");
- const activeDot = document.querySelector(".active-dot");
- active.classList.remove("active-slide");
- activeDot.classList.remove("active-dot");
- if (counter === slideCount - 1) {
- slides[0].classList.add("active-slide");
- dots[0].classList.add("active-dot");
- counter = 0;
- } else {
- const next = counter++;
- slides[next].nextElementSibling.classList.add("active-slide");
- dots[next].nextElementSibling.classList.add("active-dot");
- counter += 1;
- }
- }
- const slideInterval = function () {
- interval = setInterval(function () {
- cycleSlides();
- }, intervalTime);
- };
-
- slideInterval();
-
- // if you click on on a pagination dot
- const showSlide = function () {
- let id = this.getAttribute("id");
- let slideId = id.replace("dot", "slide");
- let target = document.getElementById(slideId);
- const active = document.querySelector(".active-slide");
- const activeDot = document.querySelector(".active-dot");
- active.classList.remove("active-slide");
- activeDot.classList.remove("active-dot");
- this.classList.add("active-dot");
- target.classList.add("active-slide");
- // stops the interval when someone clicks on a dot.
- clearInterval(interval);
- };
- for (let i = 0; i < allDots.length; i++) {
- allDots[i].addEventListener("click", showSlide, false);
- }
-
- // cleanup required or interval will continue to run, even on other
pages
- return function cleanup() {
- clearInterval(interval);
- };
- });
-
- return (
- <Layout
- title={"Community"}
- description={"Learn about the basics of using Apache Pulsar"}
- >
- <div className="page-wrap tailwind">
- <div className="hero-bg absolute z-0">
- <img
- className="relative"
- src={useBaseUrl("/img/community-hero-bg.jpg")}
- alt={'Community Hero'}/>
- </div>
- <section
- id="welcome"
- className="scrollable hero hero--welcome pt-24 relative"
- >
- <div className="inner cf">
- <h1>Welcome to the Pulsar Community</h1>
- <div className="cf">
- <div className="md:w-2/3 md:float-left">
- <p className="text-lg">
- The Apache Pulsar community includes
people from around the
- globe who are developing and using the
messaging and streaming
- platform for real-time workloads. We
welcome contributions
- from anyone with a passion for distributed
systems.
- </p>
- </div>
- </div>
- </div>
- </section>
-
- <section id="team" className="main-content relative">
- <div className="inner pb-0 cf">
- <div className="cf flex flex-col md:items-center
md:flex-row">
- <div className="md:w-1/2 md:pr-12">
- <h2>About the Community</h2>
- <p>
- The Pulsar community is composed of
members of the Project
- Management Committee (PMC), committers,
and contributors.
- Committers have direct access to the
source of a project and
- actively evolve the codebase. Contributors
improve the project
- through submission of patches and
suggestions to be reviewed
- by the committers. The number of
committers and contributors
- to the project is unbounded.{" "}
- </p>
- </div>
- <div className="image-bg-container p-8 md:w-1/2">
- <div id="slider" className="relative">
- {/*
- NOTE: add images to the slidesArr array above to include
the in the image carousel.
- */}
- {slidesArr.map((s, i) => {
- return (
- <img
- id={`slide-${i}`}
- key={i}
- className="slide-image"
- src={s.img}
- alt={s.alt}
- />
- );
- })}
- </div>
- <div className="pagination">
- {slidesArr.map((d, i) => {
- return <div id={`dot-${i}`} key={i}
className="dot"></div>;
- })}
- </div>
- </div>
- </div>
- <div className="cf py-12 flex flex-col sm:flex-row">
- <div className="sm:w-1/3">
- <h3>
- A successful project requires many people
to play many roles.
- </h3>
- </div>
- <div className="sm:w-2/3 sm:pl-8">
- <p>
- Some write code or documentation, while
others are valuable as
- testers, submitting patches, and
suggestions. Get involved
- today! All contributions to the project
are greatly
- appreciated.
- </p>
- <p>
- Read the{" "}
- <a
-
href="https://www.apache.org/foundation/policies/conduct";
- className="secondary-cta"
- target="_blank"
- >
- Apache Code of Conduct
- </a>{" "}
- and{" "}
- <a
-
href="https://www.apache.org/foundation/policies/conduct#reporting-guidelines";
- className="secondary-cta"
- target="_blank"
- >
- Reporting Guidelines
- </a>
- .
- </p>
- </div>
- </div>
- </div>
- </section>
- <WavySeparatorFive></WavySeparatorFive>
- <section id="discussions" className="scrollable">
- <div className="inner pt-12">
- <h2 className="text--center">Discussions</h2>
- <div className="cf py-12 flex flex-col md:flex-row">
- <div className="md:w-1/3 md:flex md:flex-center
md:p-12">
- <img src={useBaseUrl("/img/mailing-list.svg")}
/>
- </div>
- <div className="md:w-2/3">
- <h3>Mailing Lists</h3>
- <p>
- The primary place for discussions is on
the Pulsar mailing
- lists.
- </p>
- <div className="flex flex-col md:flex-row">
- <div className="discussion-box md:w-1/2
md:pr-2">
- <h4>User List</h4>
- <p>General mailing list for
user-related discussions.</p>
-
- <PillButton
- variant=""
- target=""
-
href="mailto:[email protected]";
- >
- Subscribe
- </PillButton>
- <PillButton
- variant="grey"
- target="_blank"
-
href="mailto:[email protected]";
- >
- Unsubscribe
- </PillButton>
- <p>
- <strong>
- Access the{" "}
- <a
- className="secondary-cta"
-
href="https://lists.apache.org/[email protected]";
- target="_blank"
- >
- User List Archives
- </a>
- .
- </strong>
- </p>
- </div>
- <div className="discussion-box md:w-1/2
md:pr-2">
- <h4>Developer List</h4>
- <p>
- Questions and discussions related
to Pulsar development.
- </p>
-
- <PillButton
- variant=""
- target=""
-
href="mailto:[email protected]";
- >
- Subscribe
- </PillButton>
- <PillButton
- variant="grey"
- target="_blank"
-
href="mailto:[email protected]";
- >
- Unsubscribe
- </PillButton>
-
- <p>
- <strong>
- Access the{" "}
- <a
- className="secondary-cta"
-
href="https://lists.apache.org/[email protected]";
- >
- Developer List Archives
- </a>
- .
- </strong>
- </p>
- </div>
- </div>
- </div>
- </div>
- <div className="cf flex flex-col md:flex-row py-12">
- <div className="md:w-1/3">
- <img src={useBaseUrl("/img/Slack_Mark.svg")} />
- </div>
- <div className="md:w-2/3">
- <h3>Slack</h3>
- <div className="">
- <p>
- The Pulsar community maintains its own
Slack instance
- (separate from ASF Slack) used for
informal discussions for
- developers and users.{" "}
- </p>
- <p>
- Slack channels are great for quick
questions or discussions
- on specialized topics. Remember that
we strongly encourage
- communication via the mailing lists,
and we prefer to
- discuss more complex subjects by
email. Developers should be
- careful to move or duplicate all
official or useful
- discussions to the issue tracking
system and/or the dev
- mailing list.
- </p>
- <p>Not signed up? Use our Slack App to
self-register </p>
- <PillButton
- variant=""
- target="_blank"
- href="https://apache-pulsar.slack.com/";
- >
- PULSAR SLACK
- </PillButton>
- <PillButton
- variant="grey"
- target="_blank"
-
href="https://communityinviter.com/apps/apache-pulsar/apache-pulsar";
- >
- PULSAR SLACK SIGN-UP
- </PillButton>
- </div>
- </div>
- </div>
- </div>
- <div className="inner pt-12">
- <div className="text--center md:text-left md:grid
md:grid-cols-3 md:gap-x-4 md:gap-y-4">
- <div className="discussion-box">
- <div className="icon-wrap text--center
md:text-left md:flex md:items-center">
- <img
- className="mx-auto md:m-0"
-
src={useBaseUrl("/img/logo-stackoverflow.svg")}
- />
- </div>
- <h3>Stack Overflow</h3>
- <p>
- For technical questions, we ask that you
post them to{" "}
- <a
-
href="https://stackoverflow.com/tags/apache-pulsar";
- target="_blank"
- >
- Stack Overflow
- </a>{" "}
- using the tag “apache-pulsar”.
- </p>
- </div>
- <div className="discussion-box">
- <div className="icon-wrap flex items-center">
- <img
- className="mx-auto md:m-0"
-
src={useBaseUrl("/img/wechat-logo.svg")}
- />
- </div>
-
- <h3>WeChat</h3>
- <p>
- Welcome to subscribe to the Apache Pulsar
WeChat Official
- Account! The account ID is ApachePulsar.
- </p>
- </div>
- <div className="discussion-box">
- <div className="icon-wrap text-2xl flex
items-center">
- <GroupsIcon className="icon-wrap-icon
mx-auto md:m-0" />
- </div>
- <h3>Community Meetings</h3>
- <p>
- The community meeting occurs biweekly on
Tuesdays and
- Thursdays to discuss new proposals, open
pull requests, and
- host open discussions. Details and how to
join{" "}
- <a
-
href="https://github.com/apache/pulsar/wiki/Community-Meetings";
- target="_blank"
- >
- here.
- </a>
- </p>
- </div>
- </div>
- </div>
- </section>
- <WavySeparatorSix></WavySeparatorSix>
- <section id="governance" className="py-12 scrollable">
- <div className="inner">
- <h2>Project Governance</h2>
- <p>
- Apache Pulsar is independently managed by its
Project Management
- Committee (PMC)—the governing body tasked with
project management
- including technical direction, voting on new
committers and PMC
- members, setting policies, and formally voting on
software product
- releases.
- </p>
- <PillButton
- variant=""
- target="_blank"
-
href="https://community.apache.org/projectIndependence";
- >
- ASF PROJECT INDEPENDENCE OVERVIEW
- </PillButton>
- <PillButton
- variant="grey"
- target="_blank"
-
href="https://www.apache.org/foundation/governance/pmcs.html";
- >
- ASF PMC OVERVIEW
- </PillButton>
- <PillButton
- variant=""
- target="_blank"
-
href="https://www.apache.org/theapacheway/index.html";
- >
- THE APACHE WAY
- </PillButton>
- </div>
- </section>
- <section id="contribute" className="py-12 scrollable">
- <div className="inner">
- <h2 className="text-center sm:text-left">How to
Contribute</h2>
- <div className="">
- <div className="flex flex-col sm:flex-row
items-center py-12">
- <div className="sm:w-1/3 section-icon px-12">
- <img
src={useBaseUrl("/img/contribute.svg")} />
- </div>
- <div className="sm:w-2/3">
- <h3>Contributing to the Project</h3>
- <p>
- Pulsar has many different
opportunities for contributions --
- you can write new examples/tutorials,
add new user-facing
- libraries, write new Pulsar IO
connectors, participate in
- documentation, and more.{" "}
- </p>
- <PillButton
- variant=""
- target=""
- href={useBaseUrl("contribute")}
- >
- Contribution Guide
- </PillButton>
- <PillButton
- variant="grey"
- target=""
-
href={useBaseUrl("contribute/develop-coding-conventions")}
- >
- Coding Conventions
- </PillButton>
- </div>
- </div>
- <div className="flex flex-col sm:flex-row
items-center py-12">
- <div className="sm:w-1/3 section-icon px-12">
- <img
src={useBaseUrl("/img/report-bugs.svg")} alt={'Report bugs'} />
- </div>
- <div className="sm:w-2/3 ">
- <h3>Reporting Bugs</h3>
- <p>
- If you encounter a problem with
Pulsar, the first places to
- ask for help are the user mailing list
or Stack Overflow.
- </p>
- <p>
- If, after having asked for help, you
suspect that you have
- found a bug in Pulsar, you should
report it to the developer
- mailing list or by opening GitHub
Issue. Please provide as
- much detail as you can on your
problem. Don’t forget to
- indicate which version of Pulsar you
are running and on
- which environment.
- </p>
- </div>
- </div>
- <div className="flex flex-col sm:flex-row
items-center py-12">
- <div className="sm:w-1/3 section-icon px-12">
- <img
src={useBaseUrl("/img/report-vulnerabillity.svg")} />
- </div>
- <div className="sm:w-2/3">
- <h3>Reporting a Vulnerability</h3>
- <p>
- To report a vulnerability for Pulsar,
contact the{" "}
- <a
- className="secondary-cta"
-
href="https://www.apache.org/security/projects.html";
- target="_blank"
- >
- Apache Security Team
- </a>
- .
- </p>
- <p>The process for reporting a
vulnerability is outlined
- <a className="secondary-cta"
href="https://www.apache.org/security/"; target="_blank">here</a>
- . When reporting a vulnerability to
- <a className="secondary-cta"
href="mailto:[email protected]"; target="_blank">[email protected]</a>
- , you can copy your email to
- <a className="secondary-cta"
href="mailto:[email protected]";
target="_blank">[email protected]</a>
- to send your report to the Apache
Pulsar Project Management Committee. This is a private mailing list.
- </p>
- </div>
- </div>
- </div>
- </div>
- </section>
- <WavySeparatorSix></WavySeparatorSix>
- <section id="community" className="py-12 scrollable">
- <div className="inner">
- <h2 className="text--center">Meet the Community</h2>
- <p>Pulsar community consists of PMC members,
committers and contributors. </p>
- <p>
- For the complete and up-to-date list, see{" "}
- <a
- className="secondary-cta"
-
href="https://projects.apache.org/committee.html?pulsar";
- target="_blank"
- >
- Apache Pulsar Committee
- </a>
- .
- </p>
- <h3 className="text--center">PMC members</h3>
- <div className="md:grid md:grid-cols-2 md:gap-x-4">
- <TeamTable
- data={team.pmc.slice(0, (team.pmc.length + 1)
/ 2)}
- />
- <TeamTable
- data={team.pmc.slice((team.pmc.length + 1) /
2)}
- />
- </div>
- <h3 className="text--center">Committers</h3>
- <div className="md:grid md:grid-cols-2 md:gap-x-4">
- <TeamTable
- data={team.committers.slice(0,
(team.committers.length + 1) / 2)}
- />
- <TeamTable
-
data={team.committers.slice((team.committers.length + 1) / 2)}
- />
- </div>
- <div className="md:grid md:grid-cols-2 md:gap-x-4">
- <img
-
src="https://contributor-overtime-api.git-contributor.com/contributors-svg?chart=contributorOverTime&repo=apache/pulsar";
- alt={'Contributors over time'}/>
- <img
-
src="https://contributor-overtime-api.git-contributor.com/contributors-svg?chart=contributorMonthlyActivity&repo=apache/pulsar";
- alt={'Active contributors monthly'}
- />
- </div>
- </div>
- </section>
- <PromoCallout
- url="/blog"
- linkText="Read Now"
- text="Get up-to-date Pulsar insights on the blog"
- />
- </div>
- </Layout>
- );
-}
diff --git a/src/pages/community/DiscussionPlatform.module.css
b/src/pages/community/DiscussionPlatform.module.css
new file mode 100644
index 00000000000..18a39dc7423
--- /dev/null
+++ b/src/pages/community/DiscussionPlatform.module.css
@@ -0,0 +1,10 @@
+.DiscussionPlatform {
+ display: flex;
+}
+
+.Logo {
+ width: 100px;
+ height: 100px;
+ display: block;
+ margin-right: 24px;
+}
diff --git a/src/pages/community/DiscussionPlatform.tsx
b/src/pages/community/DiscussionPlatform.tsx
new file mode 100644
index 00000000000..c7cf83d9903
--- /dev/null
+++ b/src/pages/community/DiscussionPlatform.tsx
@@ -0,0 +1,62 @@
+import React from "react";
+import PillButton, { PillButtonVariant } from
"@site/src/components/PillButton";
+import s from "./DiscussionPlatform.module.css";
+
+type ActionButtonProps = {
+ id: string;
+ text: string;
+ href: string;
+ type: "primary" | "normal" | "link";
+ isExternal?: boolean;
+};
+
+export type DiscussionPlatformProps = {
+ name: string;
+ logoSrc: string;
+ description: React.ReactNode;
+ actions?: ActionButtonProps[];
+};
+
+const DiscussionPlatform: React.FC<DiscussionPlatformProps> = (props) => {
+ return (
+ <div className={s.DiscussionPlatform}>
+ <img className={s.Logo} src={props.logoSrc} />
+ <div>
+ <h3>{props.name}</h3>
+ <p>{props.description}</p>
+ <div>
+ {(props.actions || []).map((action) => (
+ <ActionButton key={action.id} {...action} />
+ ))}
+ </div>
+ </div>
+ </div>
+ );
+};
+
+const ActionButton: React.FC<ActionButtonProps> = (props) => {
+ if (props.type === "link") {
+ }
+
+ let pillButtonVariant: PillButtonVariant;
+ switch (props.type) {
+ case "primary":
+ pillButtonVariant = "primary";
+ break;
+ case "normal":
+ pillButtonVariant = "grey";
+ break;
+ }
+
+ return (
+ <PillButton
+ variant={pillButtonVariant}
+ target={props.isExternal ? "_blank" : undefined}
+ href={props.href}
+ >
+ {props.text}
+ </PillButton>
+ );
+};
+
+export default DiscussionPlatform;
diff --git a/src/pages/community/DiscussionPlatforms.module.css
b/src/pages/community/DiscussionPlatforms.module.css
new file mode 100644
index 00000000000..f7128862274
--- /dev/null
+++ b/src/pages/community/DiscussionPlatforms.module.css
@@ -0,0 +1,11 @@
+.DiscussionPlatforms {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 60px 24px;
+}
+
+@media (max-width: 1000px) {
+ .DiscussionPlatforms {
+ grid-template-columns: 1fr;
+ }
+}
diff --git a/src/pages/community/DiscussionPlatforms.tsx
b/src/pages/community/DiscussionPlatforms.tsx
new file mode 100644
index 00000000000..6ebf3f5ac10
--- /dev/null
+++ b/src/pages/community/DiscussionPlatforms.tsx
@@ -0,0 +1,195 @@
+import React from "react";
+import useBaseUrl from "@docusaurus/useBaseUrl";
+import DiscussionPlatform, {
+ DiscussionPlatformProps,
+} from "./DiscussionPlatform";
+import s from "./DiscussionPlatforms.module.css";
+
+const DiscussionPlatforms: React.FC = () => {
+ const platforms: DiscussionPlatformProps[] = [
+ {
+ name: "User Mailing List",
+ description: (
+ <div>
+ General mailing list for user-related discussions.
+ <br />
+ <a
+ href="https://lists.apache.org/[email protected]";
+ target="_blank"
+ >
+ Access the archives
+ </a>
+ </div>
+ ),
+ actions: [
+ {
+ id: "subscribe",
+ text: "Subscribe",
+ href: "[email protected]",
+ type: "primary",
+ },
+ {
+ id: "unsubscribe",
+ text: "Unsubscribe",
+ href: "[email protected]",
+ type: "normal",
+ },
+ ],
+ logoSrc: useBaseUrl("/img/mailing-list.svg"),
+ },
+ {
+ name: "Developer Mailing List",
+ description: (
+ <div>
+ Questions and discussions related to Pulsar development.
+ <br />
+ <a
+ href="https://lists.apache.org/[email protected]";
+ target="_blank"
+ >
+ Access the archives
+ </a>
+ </div>
+ ),
+ actions: [
+ {
+ id: "subscribe",
+ text: "Subscribe",
+ href: "[email protected]",
+ type: "primary",
+ },
+ {
+ id: "unsubscribe",
+ text: "Unsubscribe",
+ href: "[email protected]",
+ type: "normal",
+ },
+ ],
+ logoSrc: useBaseUrl("/img/mailing-list.svg"),
+ },
+ {
+ name: "Discussions at GitHub",
+ description: (
+ <div>
+ A good place to ask any question, bring an idea or get support.
Especially if you are not
+ friends with mailing lists.
+ </div>
+ ),
+ actions: [
+ {
+ id: "new-discussion",
+ text: "New discussion",
+ href: "https://github.com/apache/pulsar/discussions/new";,
+ type: "primary",
+ isExternal: true,
+ },
+ {
+ id: "open",
+ text: "Browse",
+ href: "https://github.com/apache/pulsar/discussions";,
+ type: "normal",
+ isExternal: true,
+ },
+ ],
+ logoSrc: useBaseUrl("/img/github-mark.svg"),
+ },
+ {
+ name: "Stack Overflow",
+ description: (
+ <span>
+ For technical questions, we ask that you post them to Stack Overflow
+ using the tag{" "}
+ <code style={{ whiteSpace: "nowrap" }}>apache-pulsar</code>.
+ </span>
+ ),
+ actions: [
+ {
+ id: "as",
+ text: "Ask question",
+ href: "https://stackoverflow.com/questions/ask?tags=apache-pulsar";,
+ type: "primary",
+ isExternal: true,
+ },
+ {
+ id: "browse",
+ text: "Browse",
+ href: "https://stackoverflow.com/questions/tagged/apache-pulsar";,
+ type: "normal",
+ isExternal: true,
+ },
+ ],
+ logoSrc: useBaseUrl("/img/stackoverflow-logo.svg"),
+ },
+ {
+ name: "Slack",
+ description: (
+ <>
+ Use it for instant messaging and real-time discussions.
+ <br />
+ <br />
+ Keep in mind that asking questions in Slack makes it harder to find
+ the answers later, due to Slack history isn't indexable by
search
+ engines like Google.
+ </>
+ ),
+ actions: [
+ {
+ id: "open",
+ text: "Open",
+ href: "https://apache-pulsar.slack.com/";,
+ type: "primary",
+ isExternal: true,
+ },
+ {
+ id: "sign-up",
+ text: "Sign-up",
+ href:
"https://communityinviter.com/apps/apache-pulsar/apache-pulsar";,
+ type: "normal",
+ isExternal: true,
+ },
+ ],
+ logoSrc: useBaseUrl("/img/Slack_Mark.svg"),
+ },
+ {
+ name: "WeChat",
+ description: (
+ <span>
+ Welcome to the Apache Pulsar Official Account at WeChat! The account
+ ID is <code>ApachePulsar</code>.
+ </span>
+ ),
+ logoSrc: useBaseUrl("/img/wechat-logo.svg"),
+ },
+ {
+ name: "Community Meetings",
+ description: (
+ <span>
+ The community meeting occurs biweekly on Tuesdays and Thursdays to
+ discuss new proposals, open pull requests, and host open discussions.
+ </span>
+ ),
+ logoSrc: useBaseUrl("/img/community-meetings.svg"),
+ actions: [
+ {
+ id: "see-details",
+ text: "See details",
+ href: "https://github.com/apache/pulsar/wiki/Community-Meetings";,
+ type: "primary",
+ isExternal: true,
+ },
+ ],
+ },
+ ];
+
+ return (
+ <div className={s.DiscussionPlatforms}>
+ {platforms.map((platform) => (
+ <div key={platform.name} className={s.DiscussionPlatform}>
+ <DiscussionPlatform {...platform} />
+ </div>
+ ))}
+ </div>
+ );
+};
+
+export default DiscussionPlatforms;
diff --git a/src/pages/community/Slider.tsx b/src/pages/community/Slider.tsx
new file mode 100644
index 00000000000..933738d5fe4
--- /dev/null
+++ b/src/pages/community/Slider.tsx
@@ -0,0 +1,102 @@
+import BrowserOnly from "@docusaurus/BrowserOnly";
+import React, { useEffect } from "react";
+
+export type Slide = {
+ img: string;
+ alt: string;
+};
+
+export type SliderProps = {
+ slides: Slide[];
+};
+
+const _Slider: React.FC<SliderProps> = (props) => {
+ useEffect(() => {
+ const slides = document.querySelectorAll(".slide-image");
+ const allDots = document.getElementsByClassName("dot");
+ const firstSlide = document.getElementById("slide-0");
+ const firstDot = document.getElementById("dot-0");
+ firstSlide.classList.add("active-slide");
+ firstDot.classList.add("active-dot");
+ const dots = document.querySelectorAll(".dot");
+ const slideCount = slides.length;
+ const intervalTime = 4000;
+ let interval;
+ let counter = 0;
+ function cycleSlides() {
+ const active = document.querySelector(".active-slide");
+ const activeDot = document.querySelector(".active-dot");
+ active.classList.remove("active-slide");
+ activeDot.classList.remove("active-dot");
+ if (counter === slideCount - 1) {
+ slides[0].classList.add("active-slide");
+ dots[0].classList.add("active-dot");
+ counter = 0;
+ } else {
+ const next = counter++;
+ slides[next].nextElementSibling.classList.add("active-slide");
+ dots[next].nextElementSibling.classList.add("active-dot");
+ counter += 1;
+ }
+ }
+ const slideInterval = function () {
+ interval = setInterval(function () {
+ cycleSlides();
+ }, intervalTime);
+ };
+
+ slideInterval();
+
+ // if you click on on a pagination dot
+ const showSlide = function () {
+ let id = this.getAttribute("id");
+ let slideId = id.replace("dot", "slide");
+ let target = document.getElementById(slideId);
+ const active = document.querySelector(".active-slide");
+ const activeDot = document.querySelector(".active-dot");
+ active.classList.remove("active-slide");
+ activeDot.classList.remove("active-dot");
+ this.classList.add("active-dot");
+ target.classList.add("active-slide");
+ // stops the interval when someone clicks on a dot.
+ clearInterval(interval);
+ };
+ for (let i = 0; i < allDots.length; i++) {
+ allDots[i].addEventListener("click", showSlide, false);
+ }
+
+ // cleanup required or interval will continue to run, even on other pages
+ return function cleanup() {
+ clearInterval(interval);
+ };
+ });
+
+ return (
+ <div className="image-bg-container p-8 md:w-1/2">
+ <div id="slider" className="relative">
+ {props.slides.map((s, i) => {
+ return (
+ <img
+ id={`slide-${i}`}
+ key={i}
+ className="slide-image"
+ src={s.img}
+ alt={s.alt}
+ />
+ );
+ })}
+ </div>
+ <div className="pagination">
+ {props.slides.map((_, i) => {
+ return <div id={`dot-${i}`} key={i} className="dot"></div>;
+ })}
+ </div>
+ </div>
+ );
+};
+
+const Slider: React.FC<SliderProps> = (props) => (
+ <BrowserOnly>{() => <_Slider {...props} />}</BrowserOnly>
+);
+
+export default Slider;
diff --git a/src/pages/community/index.tsx b/src/pages/community/index.tsx
new file mode 100644
index 00000000000..19bd26ff8b1
--- /dev/null
+++ b/src/pages/community/index.tsx
@@ -0,0 +1,321 @@
+import React, { useEffect } from "react";
+import Layout from "@theme/Layout";
+import useBaseUrl from "@docusaurus/useBaseUrl";
+import TeamTable from "@site/src/components/TeamTable";
+import PromoCallout from "@site/src/components/PromoCallout";
+import PillButton from "@site/src/components/PillButton";
+import WavySeparatorFive from "@site/static/img/separator-5.svg";
+import WavySeparatorSix from "@site/static/img/separator-6.svg";
+import team from "@site/data/team";
+import Slider from "./Slider";
+import DiscussionPlatforms from "./DiscussionPlatforms";
+
+const CommunityPage: React.FC = () => {
+ return (
+ <Layout
+ title={"Community"}
+ description={"Learn about the basics of using Apache Pulsar"}
+ >
+ <div className="page-wrap tailwind">
+ <div className="hero-bg absolute z-0">
+ <img
+ className="relative"
+ src={useBaseUrl("/img/community-hero-bg.jpg")}
+ alt={"Community Hero"}
+ />
+ </div>
+ <section
+ id="section-welcome"
+ className="scrollable hero hero--welcome pt-24 relative"
+ >
+ <div className="inner cf">
+ <h1>Welcome to the Pulsar Community</h1>
+ <div className="cf">
+ <div className="md:w-2/3 md:float-left">
+ <p className="text-lg">
+ The Apache Pulsar community includes people from around the
+ globe who are developing and using the messaging and
streaming
+ platform for real-time workloads. We welcome contributions
+ from anyone with a passion for distributed systems.
+ </p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="section-team" className="main-content relative">
+ l
+ <div className="inner pb-0 cf">
+ <div className="cf flex flex-col md:items-center md:flex-row">
+ <div className="md:w-1/2 md:pr-12">
+ <h2>About the Community</h2>
+ <p>
+ The Pulsar community is composed of members of the Project
+ Management Committee (PMC), committers, and contributors.
+ Committers have direct access to the source of a project and
+ actively evolve the codebase. Contributors improve the
project
+ through submission of patches and suggestions to be reviewed
+ by the committers. The number of committers and contributors
+ to the project is unbounded.{" "}
+ </p>
+ </div>
+ <Slider
+ slides={[
+ {
+ img: useBaseUrl("/img/community-photo-small.jpg"),
+ alt: "community photo",
+ },
+ {
+ img: useBaseUrl("/img/community-image-2.jpg"),
+ alt: "community photo 2",
+ },
+ {
+ img: useBaseUrl("/img/community-image-3.jpg"),
+ alt: "community photo 3",
+ },
+ ]}
+ />
+ </div>
+ <div className="cf py-12 flex flex-col sm:flex-row">
+ <div className="sm:w-1/3">
+ <h3>
+ A successful project requires many people to play many roles.
+ </h3>
+ </div>
+ <div className="sm:w-2/3 sm:pl-8">
+ <p>
+ Some write code or documentation, while others are valuable
as
+ testers, submitting patches, and suggestions. Get involved
+ today! All contributions to the project are greatly
+ appreciated.
+ </p>
+ <p>
+ Read the{" "}
+ <a
+ href="https://www.apache.org/foundation/policies/conduct";
+ className="secondary-cta"
+ target="_blank"
+ >
+ Apache Code of Conduct
+ </a>{" "}
+ and{" "}
+ <a
+
href="https://www.apache.org/foundation/policies/conduct#reporting-guidelines";
+ className="secondary-cta"
+ target="_blank"
+ >
+ Reporting Guidelines
+ </a>
+ .
+ </p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <WavySeparatorFive />
+
+ <section id="section-discussions">
+ <div className="inner pt-12">
+ <h2 className="text--center">Discussions</h2>
+ <DiscussionPlatforms />
+ </div>
+ </section>
+
+ <WavySeparatorSix />
+
+ <section id="section-governance" className="py-12 scrollable">
+ <div className="inner">
+ <h2>Project Governance</h2>
+ <p>
+ Apache Pulsar is independently managed by its Project Management
+ Committee (PMC)—the governing body tasked with project management
+ including technical direction, voting on new committers and PMC
+ members, setting policies, and formally voting on software
product
+ releases.
+ </p>
+ <PillButton
+ variant="primary"
+ target="_blank"
+ href="https://community.apache.org/projectIndependence";
+ >
+ ASF PROJECT INDEPENDENCE OVERVIEW
+ </PillButton>
+ <PillButton
+ variant="grey"
+ target="_blank"
+ href="https://www.apache.org/foundation/governance/pmcs.html";
+ >
+ ASF PMC OVERVIEW
+ </PillButton>
+ <PillButton
+ variant="primary"
+ target="_blank"
+ href="https://www.apache.org/theapacheway/index.html";
+ >
+ THE APACHE WAY
+ </PillButton>
+ </div>
+ </section>
+ <section id="section-contribute" className="py-12 scrollable">
+ <div className="inner">
+ <h2 className="text-center sm:text-left">How to Contribute</h2>
+ <div className="">
+ <div className="flex flex-col sm:flex-row items-center py-12">
+ <div className="sm:w-1/3 section-icon px-12">
+ <img src={useBaseUrl("/img/contribute.svg")} />
+ </div>
+ <div className="sm:w-2/3">
+ <h3>Contributing to the Project</h3>
+ <p>
+ Pulsar has many different opportunities for contributions
--
+ you can write new examples/tutorials, add new user-facing
+ libraries, write new Pulsar IO connectors, participate in
+ documentation, and more.{" "}
+ </p>
+ <PillButton
+ variant="primary"
+ href={useBaseUrl("contribute")}
+ >
+ Contribution Guide
+ </PillButton>
+ <PillButton
+ variant="grey"
+ href={useBaseUrl("contribute/develop-coding-conventions")}
+ >
+ Coding Conventions
+ </PillButton>
+ </div>
+ </div>
+ <div className="flex flex-col sm:flex-row items-center py-12">
+ <div className="sm:w-1/3 section-icon px-12">
+ <img
+ src={useBaseUrl("/img/report-bugs.svg")}
+ alt={"Report bugs"}
+ />
+ </div>
+ <div className="sm:w-2/3 ">
+ <h3>Reporting Bugs</h3>
+ <p>
+ If you encounter a problem with Pulsar, the first places to
+ ask for help are the user mailing list or Stack Overflow.
+ </p>
+ <p>
+ If, after having asked for help, you suspect that you have
+ found a bug in Pulsar, you should report it to the
developer
+ mailing list or by opening GitHub Issue. Please provide as
+ much detail as you can on your problem. Don’t forget to
+ indicate which version of Pulsar you are running and on
+ which environment.
+ </p>
+ </div>
+ </div>
+ <div className="flex flex-col sm:flex-row items-center py-12">
+ <div className="sm:w-1/3 section-icon px-12">
+ <img src={useBaseUrl("/img/report-vulnerabillity.svg")} />
+ </div>
+ <div className="sm:w-2/3">
+ <h3>Reporting a Vulnerability</h3>
+ <p>
+ To report a vulnerability for Pulsar, contact the{" "}
+ <a
+ className="secondary-cta"
+ href="https://www.apache.org/security/projects.html";
+ target="_blank"
+ >
+ Apache Security Team
+ </a>
+ .
+ </p>
+ <p>
+ The process for reporting a vulnerability is outlined
+ <a
+ className="secondary-cta"
+ href="https://www.apache.org/security/";
+ target="_blank"
+ >
+ here
+ </a>
+ . When reporting a vulnerability to
+ <a
+ className="secondary-cta"
+ href="mailto:[email protected]";
+ target="_blank"
+ >
+ [email protected]
+ </a>
+ , you can copy your email to
+ <a
+ className="secondary-cta"
+ href="mailto:[email protected]";
+ target="_blank"
+ >
+ [email protected]
+ </a>
+ to send your report to the Apache Pulsar Project Management
+ Committee. This is a private mailing list.
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+ <WavySeparatorSix></WavySeparatorSix>
+ <section id="section-community" className="py-12 scrollable">
+ <div className="inner">
+ <h2 className="text--center">Meet the Community</h2>
+ <p>
+ Pulsar community consists of PMC members, committers and
+ contributors.{" "}
+ </p>
+ <p>
+ For the complete and up-to-date list, see{" "}
+ <a
+ className="secondary-cta"
+ href="https://projects.apache.org/committee.html?pulsar";
+ target="_blank"
+ >
+ Apache Pulsar Committee
+ </a>
+ .
+ </p>
+ <h3 className="text--center">PMC members</h3>
+ <div className="md:grid md:grid-cols-2 md:gap-x-4">
+ <TeamTable data={team.pmc.slice(0, (team.pmc.length + 1) / 2)} />
+ <TeamTable data={team.pmc.slice((team.pmc.length + 1) / 2)} />
+ </div>
+ <h3 className="text--center">Committers</h3>
+ <div className="md:grid md:grid-cols-2 md:gap-x-4">
+ <TeamTable
+ data={team.committers.slice(
+ 0,
+ (team.committers.length + 1) / 2
+ )}
+ />
+ <TeamTable
+ data={team.committers.slice((team.committers.length + 1) / 2)}
+ />
+ </div>
+ <div className="md:grid md:grid-cols-2 md:gap-x-4">
+ <img
+
src="https://contributor-overtime-api.git-contributor.com/contributors-svg?chart=contributorOverTime&repo=apache/pulsar";
+ alt={"Contributors over time"}
+ />
+ <img
+
src="https://contributor-overtime-api.git-contributor.com/contributors-svg?chart=contributorMonthlyActivity&repo=apache/pulsar";
+ alt={"Active contributors monthly"}
+ />
+ </div>
+ </div>
+ </section>
+ <PromoCallout
+ url="/blog"
+ linkText="Read Now"
+ text="Get up-to-date Pulsar insights on the blog"
+ />
+ </div>
+ </Layout>
+ );
+};
+
+export default CommunityPage;
diff --git a/static/img/Slack_Mark.svg b/static/img/Slack_Mark.svg
index c37dc5eb49e..84b675233ca 100644
--- a/static/img/Slack_Mark.svg
+++ b/static/img/Slack_Mark.svg
@@ -1,33 +1,14 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version:
6.00 Build 0) -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg";
xmlns:xlink="http://www.w3.org/1999/xlink"; x="0px" y="0px"
- viewBox="0 0 270 270" style="enable-background:new 0 0 270 270;"
xml:space="preserve">
-<style type="text/css">
- .st0{fill:#E01E5A;}
- .st1{fill:#36C5F0;}
- .st2{fill:#2EB67D;}
- .st3{fill:#ECB22E;}
-</style>
-<g>
- <g>
- <path class="st0"
d="M99.4,151.2c0,7.1-5.8,12.9-12.9,12.9c-7.1,0-12.9-5.8-12.9-12.9c0-7.1,5.8-12.9,12.9-12.9h12.9V151.2z"/>
- <path class="st0"
d="M105.9,151.2c0-7.1,5.8-12.9,12.9-12.9s12.9,5.8,12.9,12.9v32.3c0,7.1-5.8,12.9-12.9,12.9
- s-12.9-5.8-12.9-12.9V151.2z"/>
- </g>
- <g>
- <path class="st1"
d="M118.8,99.4c-7.1,0-12.9-5.8-12.9-12.9c0-7.1,5.8-12.9,12.9-12.9s12.9,5.8,12.9,12.9v12.9H118.8z"/>
- <path class="st1"
d="M118.8,105.9c7.1,0,12.9,5.8,12.9,12.9s-5.8,12.9-12.9,12.9H86.5c-7.1,0-12.9-5.8-12.9-12.9
- s5.8-12.9,12.9-12.9H118.8z"/>
- </g>
- <g>
- <path class="st2"
d="M170.6,118.8c0-7.1,5.8-12.9,12.9-12.9c7.1,0,12.9,5.8,12.9,12.9s-5.8,12.9-12.9,12.9h-12.9V118.8z"/>
- <path class="st2"
d="M164.1,118.8c0,7.1-5.8,12.9-12.9,12.9c-7.1,0-12.9-5.8-12.9-12.9V86.5c0-7.1,5.8-12.9,12.9-12.9
- c7.1,0,12.9,5.8,12.9,12.9V118.8z"/>
- </g>
- <g>
- <path class="st3"
d="M151.2,170.6c7.1,0,12.9,5.8,12.9,12.9c0,7.1-5.8,12.9-12.9,12.9c-7.1,0-12.9-5.8-12.9-12.9v-12.9H151.2z"/>
- <path class="st3"
d="M151.2,164.1c-7.1,0-12.9-5.8-12.9-12.9c0-7.1,5.8-12.9,12.9-12.9h32.3c7.1,0,12.9,5.8,12.9,12.9
- c0,7.1-5.8,12.9-12.9,12.9H151.2z"/>
- </g>
-</g>
+<svg focusable="false" viewBox="0 0 127 127" tabindex="-1"
xmlns="http://www.w3.org/2000/svg";>
+ <path
+ d="M27.2 80c0 7.3-5.9 13.2-13.2 13.2C6.7 93.2.8 87.3.8 80c0-7.3 5.9-13.2
13.2-13.2h13.2V80zm6.6 0c0-7.3 5.9-13.2 13.2-13.2 7.3 0 13.2 5.9 13.2 13.2v33c0
7.3-5.9 13.2-13.2 13.2-7.3 0-13.2-5.9-13.2-13.2V80z"
+ fill="#E01E5A" />
+ <path
+ d="M47 27c-7.3 0-13.2-5.9-13.2-13.2C33.8 6.5 39.7.6 47 .6c7.3 0 13.2 5.9
13.2 13.2V27H47zm0 6.7c7.3 0 13.2 5.9 13.2 13.2 0 7.3-5.9 13.2-13.2
13.2H13.9C6.6 60.1.7 54.2.7 46.9c0-7.3 5.9-13.2 13.2-13.2H47z"
+ fill="#36C5F0" />
+ <path
+ d="M99.9 46.9c0-7.3 5.9-13.2 13.2-13.2 7.3 0 13.2 5.9 13.2 13.2 0 7.3-5.9
13.2-13.2 13.2H99.9V46.9zm-6.6 0c0 7.3-5.9 13.2-13.2 13.2-7.3
0-13.2-5.9-13.2-13.2V13.8C66.9 6.5 72.8.6 80.1.6c7.3 0 13.2 5.9 13.2 13.2v33.1z"
+ fill="#2EB67D" />
+ <path
+ d="M80.1 99.8c7.3 0 13.2 5.9 13.2 13.2 0 7.3-5.9 13.2-13.2 13.2-7.3
0-13.2-5.9-13.2-13.2V99.8h13.2zm0-6.6c-7.3 0-13.2-5.9-13.2-13.2 0-7.3 5.9-13.2
13.2-13.2h33.1c7.3 0 13.2 5.9 13.2 13.2 0 7.3-5.9 13.2-13.2 13.2H80.1z"
+ fill="#ECB22E" />
</svg>
diff --git a/static/img/community-meetings.svg
b/static/img/community-meetings.svg
new file mode 100644
index 00000000000..b4c07beec55
--- /dev/null
+++ b/static/img/community-meetings.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg"; focusable="false" viewBox="0 0 24 24"
tabindex="-1"
+ fill="#198fff">
+ <path
+ d="M12 12.75c1.63 0 3.07.39 4.24.9 1.08.48 1.76 1.56 1.76
2.73V18H6v-1.61c0-1.18.68-2.26 1.76-2.73 1.17-.52 2.61-.91 4.24-.91zM4 13c1.1 0
2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm1.13 1.1c-.37-.06-.74-.1-1.13-.1-.99
0-1.93.21-2.78.58C.48 14.9 0 15.62 0
16.43V18h4.5v-1.61c0-.83.23-1.61.63-2.29zM20 13c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2
2 .9 2 2 2zm4 3.43c0-.81-.48-1.53-1.22-1.85-.85-.37-1.79-.58-2.78-.58-.39
0-.76.04-1.13.1.4.68.63 1.46.63 2.29V18H24v-1.57zM12 6c1.66 0 3 1.34 3 3s-1.34
3-3 3 [...]
+</svg>
diff --git a/static/img/github-mark.svg b/static/img/github-mark.svg
new file mode 100644
index 00000000000..fe1f823869d
--- /dev/null
+++ b/static/img/github-mark.svg
@@ -0,0 +1 @@
+<svg focusable="false" viewBox="0 0 98 96" tabindex="-1"
xmlns="http://www.w3.org/2000/svg";><path fill-rule="evenodd"
clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172
33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59
2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015
4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235
4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.2 [...]
diff --git a/static/img/logo-stackoverflow.svg
b/static/img/logo-stackoverflow.svg
deleted file mode 100644
index 295a61784fe..00000000000
--- a/static/img/logo-stackoverflow.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg"; width="622" height="124" viewBox="0 0
622 124">
- <g fill="none" fill-rule="evenodd">
- <path fill="#1E1B1D" fill-rule="nonzero" d="M142.7,76.742 L135.526,76.107
C129.895,75.654 127.716,73.383 127.716,69.568 C127.716,65.028 131.167,62.211
137.706,62.211 C142.338,62.211 146.424,63.302 149.606,65.754 L153.875,61.485
C149.875,58.216 144.156,56.673 137.8,56.673 C128.264,56.673 121.361,61.573
121.361,69.75 C121.361,77.106 125.994,81.011 134.712,81.738 L142.068,82.373
C147.244,82.828 149.515,85.007 149.515,88.912 C149.515,94.18 144.974,96.812
137.615,96.812 C132.074,96.812 12 [...]
- <polygon fill="#BBBBBB" points="88 80 99 80 99 124 0 124 0 80 11 80 11 113
88 113"/>
- <path fill="#F58025" fill-rule="nonzero" d="M22.9878906,76.73
L77.0128906,88.085 L79.2838906,77.285 L25.2588906,65.925 L22.9878906,76.73 Z
M30.1368906,50.861 L80.1828906,74.169 L84.8448906,64.16 L34.7978906,40.852
L30.1368906,50.861 Z M43.9848906,26.308 L86.4128906,61.639 L93.4788906,53.154
L51.0508906,17.824 L43.9848906,26.308 Z M71.3718906,0.192 L62.5118906,6.782
L95.4598906,51.082 L104.319891,44.493 L71.3718906,0.192 Z M22,102 L77,102
L77,91 L22,91 L22,102 Z"/>
- </g>
-</svg>
diff --git a/static/img/mailing-list.svg b/static/img/mailing-list.svg
index 3c2ff67161d..449200ccd41 100644
--- a/static/img/mailing-list.svg
+++ b/static/img/mailing-list.svg
@@ -1,8 +1,6 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="127px" height="127px" viewBox="0 0 127 127" version="1.1"
xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org/1999/xlink";>
- <title>e-mail</title>
+<svg focusable="false" viewBox="0 0 115 115" tabindex="-1"
xmlns="http://www.w3.org/2000/svg";>
<defs>
- <filter x="-11.0%" y="-11.0%" width="122.0%" height="122.0%"
filterUnits="objectBoundingBox" id="filter-1">
+ <filter filterUnits="objectBoundingBox" id="filter-1">
<feOffset dx="0" dy="2" in="SourceAlpha"
result="shadowOffsetOuter1"></feOffset>
<feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1"
result="shadowBlurOuter1"></feGaussianBlur>
<feColorMatrix values="0 0 0 0 0.0941176471 0 0 0 0 0.560784314
0 0 0 0 1 0 0 0 0.5 0" type="matrix" in="shadowBlurOuter1"
result="shadowMatrixOuter1"></feColorMatrix>
@@ -13,7 +11,7 @@
</filter>
</defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none"
fill-rule="evenodd">
- <g id="e-mail" filter="url(#filter-1)" transform="translate(9.000000,
9.000000)">
+ <g id="e-mail" filter="url(#filter-1)" transform="translate(3, 3)">
<circle id="Oval" fill="#FFFFFF" fill-rule="nonzero" cx="54.5"
cy="54.5" r="54.5"></circle>
<path d="M97,80 L97,46.8075 C97,44.855 95.925,42.725
94.3125,41.4825 L60.9875,11.6625 C57.0458333,8.1125 50.9541667,8.1125
47.0125,11.6625 L13.6875,41.4825 C12.075,42.725 11,44.6775 11,46.8075 L11,80
L97,80 Z" id="Path" stroke="#2A5082" fill="#E6F1FF" fill-rule="nonzero"></path>
<rect id="Rectangle" stroke="#2A5082" fill="#FFFFFF"
fill-rule="nonzero" x="23" y="22" width="61" height="57"></rect>
@@ -25,4 +23,4 @@
<line x1="36" y1="54" x2="59" y2="54" id="Path"
stroke="#2A5082"></line>
</g>
</g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/static/img/stackoverflow-logo.svg
b/static/img/stackoverflow-logo.svg
new file mode 100644
index 00000000000..56027ed231e
--- /dev/null
+++ b/static/img/stackoverflow-logo.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 120 120" tabindex="-1"
focusable="false">
+ <style>.st0{fill:#bcbbbb}.st1{fill:#f48023}</style>
+ <path class="st0" d="M84.4 93.8V70.6h7.7v30.9H22.6V70.6h7.7v23.2z" />
+ <path class="st1"
+ d="M38.8 68.4l37.8 7.9 1.6-7.6-37.8-7.9-1.6 7.6zm5-18l35 16.3
3.2-7-35-16.4-3.2 7.1zm9.7-17.2l29.7 24.7 4.9-5.9-29.7-24.7-4.9
5.9zm19.2-18.3l-6.2 4.6 23 31 6.2-4.6-23-31zM38 86h38.6v-7.7H38V86z" />
+</svg>
diff --git a/static/img/wechat-logo.svg b/static/img/wechat-logo.svg
index ac58d861169..c59c9824e2f 100644
--- a/static/img/wechat-logo.svg
+++ b/static/img/wechat-logo.svg
@@ -1 +1,8 @@
-<svg xmlns="http://www.w3.org/2000/svg"; width="2500" height="707" viewBox="0 0
279.658 79.051"><path fill="#2E3233" d="M183.584 25.053c6.076-1.466 13.467-.102
17.434 5.085 1.687 2.034 2.406 4.627 3.033
7.144-2.669.042-5.348.042-8.017.042-1.161-5.746-9.052-8.043-13.238-4.11-2.95
3.212-3.483 7.983-2.873 12.145.652 3.194 1.941 6.906 5.237 8.229 4.696 1.753
10.246-1.374 10.874-6.433 2.721 0 5.449-.009 8.178.051-.567 4.865-2.915
9.932-7.678 11.924-7.391 3.212-17.976 2.254-22.257-5.398.68-3.11 [...]
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 350 350" tabindex="-1"
focusable="false">
+ <path
+ fill="#2E3233"
+ d="M274 167c-7.778 0-14-6.222-14-14s6.222-14 14-14 14 6.222 14 14c0
7.389-6.222 14-14 14m-69 0c-7.778 0-14-6.222-14-14s6.222-14 14-14 14 6.222 14
14c0 7.389-6.222 14-14 14m102.39 78.581C329.216 229.871 343 206.5 343 180.827
343 133.316 297.052 95 240 95s-103 38.316-103 85.827c0 47.512 45.948 85.828 103
85.828 11.87 0 22.974-1.533 33.695-4.598.766-.383 1.915-.383 3.063-.383 1.915 0
3.83.766 5.361 1.532l22.591 13.028c.766.383 1.149.766 1.915.766a3.433 3.433 0
003.446-3.448c0-.767-.383- [...]
+ <path
+ fill="#9DE60B"
+ d="M164 86c-8.93 0-16-7.07-16-16s7.07-16 16-16 16 7.07 16 16c0 8.558-7.07
16-16 16m-82 0c-8.93 0-16-7.07-16-16s7.07-16 16-16 16 7.07 16 16c0 8.558-7.07
16-16 16m41.96-86C55.646 0 0 45.895 0 102.88c0 30.98 16.502 58.899 42.983 77.64
1.919 1.53 3.454 3.824 3.454 6.884 0 .764-.384 1.912-.384 2.677-1.919
7.649-5.373 20.27-5.757 20.652-.383 1.148-.767 1.913-.767 3.06 0 2.295 1.919
4.207 4.221 4.207.768 0 1.535-.382 2.303-.765l27.248-15.68c1.919-1.148
4.222-1.913 6.524-1.913 1.152 0 2.303 [...]
+</svg>
