Add mailing list page

We need instructions to tell people how to subscribe/unsubscribe from
the development mailing list.

Signed-off-by: Robert Young <robertyoungnz@gmail.com>

Author: robobario

join-us/index.md

@@ -30,6 +30,17 @@ title: Join Us!
             </div>
           </div>
         </div>
+        <div class="col">
+          <div class="card shadow mb-2 mx-2 h-100">
+            <div class="card-header"><h2 class="card-title fs-4">Join our Development Mailing List</h2></div>
+            <div class="card-body mx-3 my-2">
+              <p>Keep up with Kroxylicious Development topics by joining the kroxylicious-dev Mailing List</p>
+            </div>
+            <div class="card-footer text-center">
+               <a href="mailing-lists/" class="btn btn-primary">More info</a>
+            </div>
+          </div>
+        </div>
         <div class="col">
           <div class="card shadow mb-2 mx-2 h-100">
             <div class="card-header"><h2 class="card-title fs-4">Join our Community Call</h2></div>

join-us/mailing-lists/index.md

@@ -0,0 +1,43 @@
+---
+layout: default
+title: Mailing Lists
+---
+
+<div class="row align-items-start justify-content-center my-5">
+  <div class="col-lg-3 mb-5" role="complementary" aria-labelledby="page-title">
+    <div class="card shadow px-2 mx-2">
+      <div class="card-body">
+        <h1 id="page-title" class="fs-3">{{ page.title }}</h1>
+        <p>Join our Development Mailing List to keep up with:</p>
+        <ul>
+            <li>Formal technical discussions.</li>
+            <li>Voting on technical decisions.</li>
+            <li>Summaries of major decisions made in Slack.</li>
+            <li>Long-form information.</li>
+        </ul>
+        <p>We welcome everyone to contribute in a respectful and inclusive environment. See our <a href="https://github.com/kroxylicious/.github/blob/main/CODE_OF_CONDUCT.md">Code of Conduct</a>.</p>
+      </div>
+    </div>
+  </div>
+  <div class="col-lg-6" role="main">
+    <h3 style="display: flex; align-items: center; gap: 0.5em;">How to Subscribe</h3>
+    <div>
+    <ul>
+      <li>If you have a Google Account, you can join <a href="https://groups.google.com/g/kroxylicious-dev">here</a></li>
+      <li>Alternatively, you can subscribe by sending an empty email to <a href="mailto:kroxylicious-dev+subscribe@googlegroups.com">kroxylicious-dev+subscribe@googlegroups.com</a></li>
+    </ul>
+</div>
+     <hr class="section-divider"/>
+<h3 style="display: flex; align-items: center; gap: 0.5em;">How to Unsubscribe</h3>
+    <div>
+     <ul>
+      <li>You can unsubscribe by sending an empty email to <a href="mailto:kroxylicious-dev+unsubscribe@googlegroups.com">kroxylicious-dev+unsubscribe@googlegroups.com</a></li>
+    </ul>
+    </div>
+    <hr class="section-divider"/>
+<h3 style="display: flex; align-items: center; gap: 0.5em;">Contact Us</h3>
+<div>
+<p>The project managers will use a private list, but only for communication that needs to remain private. 
+You can contact them by email to <a href="mailto:kroxylicious-pms@googlegroups.com">kroxylicious-pms@googlegroups.com</a>.</p>
+</div>
+</div>