Updated contribution page (#339)

Author: jemgillam

src/components/MarketingContribution.js

@@ -2,9 +2,13 @@ import React from "react";
 import fallbackIcon from "../images/avatar.svg";
 import { black } from "ansi-colors";
 
-function Icon({ src }) {
+function Icon({ src, alt }) {
   return (
-    <img style={{ width: "5rem", height: "5rem" }} src={src || fallbackIcon} />
+    <img
+      style={{ width: "5rem", height: "5rem" }}
+      src={src || fallbackIcon}
+      alt={alt}
+    />
   );
 }
 
@@ -38,7 +42,7 @@ export default function Contribution({ title, children, text, icon }) {
           marginTop: "1rem",
         }}
       >
-        <Icon src={icon} />
+        <Icon src={icon} alt={title} />
         <span>{title}</span>
       </div>
       <div style={{}}>{text || children}</div>

src/images/contributions/chat2.png

@@ -13,30 +13,30 @@ import MarketingDivide from '$components/MarketingDivide';
 import Contributions from '$components/MarketingContributions';
 import Contribution from '$components/MarketingContribution';
 
-import chat from '$images/contributions/chat.png';
-import code from '$images/contributions/code.png';
-import docs from '$images/contributions/docs2.png';
+import chat from '$images/contributions/chat2.png';
+import code from '$images/contributions/code2.png';
+import docs from '$images/contributions/docs.svg';
 import sponsor from '$images/contributions/sponsor.png';
-import stories from '$images/contributions/stories.png';
-import talks from '$images/contributions/talks2.png';
-import write from '$images/contributions/write.png';
+import stories from '$images/contributions/stories2.png';
+import talks from '$images/contributions/talks3.png';
+import write from '$images/contributions/write2.png';
 
 
 <MarketingLayout blue>
 <Hero bg="white">
 
-# Contribute to PostGraphile
+# Contribute to Graphile projects
 
 </Hero>
 
 <MarketingSection bg="white" left maxWidth>
 <h3>
-  PostGraphile wouldn't be where it is today without valuable contributions from the open source community.
+  PostGraphile, Graphile Worker and the Graphile suite wouldn't be where they are today without valuable contributions from the open source community.
 </h3>
 
 <div class='flex'>
-<a class='button--solid' href='https://patreon.com/benjie'>Sponsor PostGraphile <span class='fas fa-fw fa-external-link-square-alt' /></a>&nbsp;
-<a class='button--outline' href='https://github.com/graphile/postgraphile'>PostGraphile on Github <span class='fas fa-fw fa-external-link-square-alt' /></a>
+<a class='button--solid' href='https://github.com/sponsors/benjie'>GitHub Sponsors<span class='fas fa-fw fa-external-link-square-alt' /></a>&nbsp;
+<a class='button--outline' href='https://github.com/graphile/'>Graphile on Github <span class='fas fa-fw fa-external-link-square-alt' /></a>
 </div>
 
 </MarketingSection>
@@ -48,7 +48,7 @@ import write from '$images/contributions/write.png';
 
 <div style={{maxWidth: '48rem', margin: '0 auto'}}>
 
-PostGraphile wouldn’t be where it is today without the people who supported it by dedicating their time, skills and knowledge to it since its inception in 2016.
+The Graphile suite wouldn&apos;t be where it is today without the people who supported it by dedicating their time, skills and knowledge to it since its inception in 2016.
 
 There is always something for anyone who wants to get involved; be it programming, writing, presenting at meetups or more. We are working hard to build an inclusive and supportive community around the Graphile suite, and would love for more interested people to join.
 
@@ -79,22 +79,22 @@ Adding to the documentation is always a valuable way to contribute. You can add
 </Contribution>
 <Contribution title="Talks" icon={talks}>
 
-Talk about PostGraphile at your local meetups and in your workplace. If you're planning on giving a presentation, let us know and we'll send you some stickers or [cheatsheets](https://learn.graphile.org) to support your talk. You can contact us on our [chat server](https://discord.gg/graphile) or [on twitter](https://twitter.com/graphilehq) and we'll do what we can to help you.
+Talk about PostGraphile, Graphile Worker or one of the other tools at your local meetups and in your workplace. If you're planning on giving a presentation, let us know and we'll send you some stickers or [cheatsheets](https://learn.graphile.org) to support your talk. You can contact us on our [chat server](https://discord.gg/graphile) or [on twitter](https://twitter.com/graphilehq) and we'll do what we can to help you.
 
 </Contribution>
 <Contribution title="Stories" icon={stories}>
 
-We always want to hear about your use of PostGraphile, whether a good experience or bad. Sharing your story helps us improve, and encourages other potential users to give PostGraphile a try. We want to compile some user case studies, so please get in contact [on chat](https://discord.gg/graphile) or [on twitter](https://twitter.com/graphilehq) with your PostGraphile story.
+We love to hear about your use of PostGraphile, whether a good experience or bad. Sharing your story helps us improve, and encourages other potential users to give our projects a try. We want to compile some user case studies, so please get in contact [on chat](https://discord.gg/graphile) or [on twitter](https://twitter.com/graphilehq) with your story.
 
 </Contribution>
 <Contribution title="Write" icon={write}>
 
-Share your experiences with the project on your blog or social media - it could be about how you use the project, what success you've seen, or anything else; sharing your experiences with PostGraphile helps more people find us, which in turn allows the project to grow and become more sustainable. Don't forget to tag us [on twitter](https://twitter.com/graphilehq) and we'll share your writing too.
+Write and share your experiences with the project - it could be about how you use the project, what success you've seen, or anything else; sharing your experiences with PostGraphile, Graphile Worker or the other tools helps more people find us, which in turn allows the project to grow and become more sustainable. Don't forget to send us the link and we'll share your writing too.
 
 </Contribution>
 <Contribution title="Sponsor" icon={sponsor}>
 
-Crowd-sourced funding enables us to spend the most time directly working on improving PostGraphile, which you and other PostGraphile users then benefit from. Sponsorship money is used to fund software development, testing, documentation and releases of the PostGraphile and Graphile Engine software suite. [Sponsor PostGraphile on Patreon here.](https://www.patreon.com/benjie)
+Crowd-sourced funding enables us to spend the most time directly working on improving the Graphile suite, which you and other users then benefit from. Sponsorship money is used to fund software development, testing, documentation and releases of the PostGraphile and the Graphile software suite. [Sponsor on GitHub Sponsors here.](https://github.com/sponsors/benjie)
 
 </Contribution>