Update donation box and include a button to join Jupyter Foundation (#776)

Author: jasongrout

_sass/components/_about-box.scss

@@ -14,7 +14,7 @@
     background-color: $button-orange;
     border-radius: 2px;
     padding: 0.75em 1.25em;
-    margin: 0 auto;
+    margin: 0 auto 10px;
     width: 240px;
     text-align: center;
     display: table;

about.html

@@ -581,6 +581,7 @@
   description:
     - Jupyter will always be 100% open source software, free for all to use and released under the liberal terms of the <a href="https://opensource.org/licenses/BSD-3-Clause">modified BSD license</a>. If you have found Project Jupyter to be useful in your work, research, or company, please consider making a donation to the project commensurate with your resources.
     - Donations after fees will be used to fund Project Jupyter's open source software, standards, documentation, and community. Our donations are managed by <a href="https://lf-charities.org/">LF Charities</a>, which hosts Project Jupyter. LF Charities is tax exempt under Section 501(c)(3) of the Internal Revenue Code of the United States; if you are an individual subject to US tax law, your contributions are generally tax-deductible (but please consult your tax advisor).
+  jupyter_foundation:
     - Alternatively, corporations and other organizations may join the <a href="https://jupyterfoundation.org">Jupyter Foundation</a>, under the <a href="https://www.linuxfoundation.org/">Linux Foundation</a>, to support Project Jupyter and its mission. The Linux Foundation is a 501(c)(6) non-profit.
 ---
 
@@ -838,9 +839,22 @@ <h2 class="text-center">{{ page.donate_box.headline }}</h2>
 
     <div class="orange-button">
         <a href="https://donate.stripe.com/cN23fi1DpcJE66A6oo" target="noopener noreferrer">
-            Support Project Jupyter
+            Donate to Project Jupyter
         </a>
     </div>
+
+    {% for graf in page.donate_box.jupyter_foundation %}
+    <p class="content content--copy">
+        {{ graf }}
+    </p>
+    {% endfor %}
+
+    <div class="orange-button">
+      <a href="https://jupyterfoundation.org/join" target="noopener noreferrer">
+          Join Jupyter Foundation
+      </a>
   </div>
+
+</div>
   <!-- The globe icon is originally from https://github.com/twitter/twemoji/blob/ad3d3d669bb3697946577247ebb15818f09c6c91/assets/svg/1f310.svg, licensed CC-by-4.0 -->
 </article>