feat: how-to email setup and stagger bio images

2 files changed, 124 insertions, 57 deletions

diff --git a/about/index.php b/about/index.php
index 4607787..ce80aa9 100644
--- a/about/index.php
+++ b/about/index.php
@@ -66,59 +66,6 @@
 
 <section class="quiet flexible">
 	<div>
-		<h2>Joel Monroe</h2>
-		<p>
-
-			Joel has been a math nerd since he first discovered the number 11. Since then, he has worked to develop his skills in both studying and teaching math. Joel earned his Bachelor's in Mathematics and his Master's in Computational Operations Research from the College of William &amp; Mary. Throughout his education, he has consistently sought opportunities to tutor, whether it was helping friends in high school, peers in college, or other students during his Master's program. Joel has a passion for seeing students break through the barriers which can form when studying math and discover the amazing language hidden within. As a part of Carpenter Tutoring, Joel is happy to offer assistance to students in high school and college math and introductory physics.
-		</p>
-	</div>
-
-	<figure class="shadowy">
-		<picture>
-			<source srcset="/assets/joelm.webp" type="image/webp" />
-			<source srcset="/assets/joelm.png" type="image/png" />
-			<img alt="Joel Monroe" src="/assets/joelm.png" />
-		</picture>
-		<figcaption>Joel Monroe, M.Sc.</figcaption>
-	</figure>
-
-</section>
-
-<section></section>
-
-<section class="quiet flexible">
-	<div>
-		<h2>William Brubaker</h2>
-		<p>
-			William Brubaker graduated from the University of California at Berkeley
-			with degrees in Architecture and Business Administration. He subsequently
-			worked as project manager for real estate developers of very large
-			commercial projects in multiple cities in the United States and in Abu
-			Dhabi and Hong Kong. In 2011, William began tutoring GMAT prep and later,
-			GRE prep, full time and has done that ever since. Over the past 11 years
-			he has tutored over 7,500 hours to hundreds of students. During that time
-			he has gradually developed a structured system designed to optimize
-			graduate students' tutoring experience. William is the father of three
-			children and lives in the foothills of the Sierra Nevada Mountains in
-			California.
-		</p>
-	</div>
-
-	<figure class="shadowy">
-		<picture>
-			<source srcset="/assets/williamb.webp" type="image/webp" />
-			<source srcset="/assets/williamb.png" type="image/png" />
-			<img alt="William Brubaker" src="/assets/williamb.png" />
-		</picture>
-		<figcaption>William Brubaker</figcaption>
-	</figure>
-
-</section>
-
-<section></section>
-
-<section class="quiet flexible">
-	<div>
 		<h2>Genevieve Akins</h2>
 		<p>
 			Genevieve is currently pursuing a master’s degree in Clinical Mental Health Counseling
@@ -151,6 +98,14 @@
 <section></section>
 
 <section class="quiet flexible">
+	<figure class="shadowy">
+		<picture>
+			<source srcset="/assets/ianw.webp" type="image/webp" />
+			<source srcset="/assets/ianw.png" type="image/png" />
+			<img alt="Ian Wilenzik" src="/assets/ianw.png" />
+		</picture>
+		<figcaption>Ian Wilenzik</figcaption>
+	</figure>
 	<div>
 		<h2>Ian Wilenzik</h2>
 		<p>
@@ -171,14 +126,58 @@
 		</p>
 	</div>
 
+</section>
+
+<section></section>
+
+<section class="quiet flexible">
+	<div>
+		<h2>Joel Monroe</h2>
+		<p>
+
+			Joel has been a math nerd since he first discovered the number 11. Since then, he has worked to develop his skills in both studying and teaching math. Joel earned his Bachelor's in Mathematics and his Master's in Computational Operations Research from the College of William &amp; Mary. Throughout his education, he has consistently sought opportunities to tutor, whether it was helping friends in high school, peers in college, or other students during his Master's program. Joel has a passion for seeing students break through the barriers which can form when studying math and discover the amazing language hidden within. As a part of Carpenter Tutoring, Joel is happy to offer assistance to students in high school and college math and introductory physics.
+		</p>
+	</div>
+
 	<figure class="shadowy">
 		<picture>
-			<source srcset="/assets/ianw.webp" type="image/webp" />
-			<source srcset="/assets/ianw.png" type="image/png" />
-			<img alt="Ian Wilenzik" src="/assets/ianw.png" />
+			<source srcset="/assets/joelm.webp" type="image/webp" />
+			<source srcset="/assets/joelm.png" type="image/png" />
+			<img alt="Joel Monroe" src="/assets/joelm.png" />
 		</picture>
-		<figcaption>Ian Wilenzik</figcaption>
+		<figcaption>Joel Monroe, M.Sc.</figcaption>
+	</figure>
+
+</section>
+
+<section></section>
+<section class="quiet flexible">
+	<figure class="shadowy">
+		<picture>
+			<source srcset="/assets/williamb.webp" type="image/webp" />
+			<source srcset="/assets/williamb.png" type="image/png" />
+			<img alt="William Brubaker" src="/assets/williamb.png" />
+		</picture>
+		<figcaption>William Brubaker</figcaption>
 	</figure>
+
+	<div>
+		<h2>William Brubaker</h2>
+		<p>
+			William Brubaker graduated from the University of California at Berkeley
+			with degrees in Architecture and Business Administration. He subsequently
+			worked as project manager for real estate developers of very large
+			commercial projects in multiple cities in the United States and in Abu
+			Dhabi and Hong Kong. In 2011, William began tutoring GMAT prep and later,
+			GRE prep, full time and has done that ever since. Over the past 11 years
+			he has tutored over 7,500 hours to hundreds of students. During that time
+			he has gradually developed a structured system designed to optimize
+			graduate students' tutoring experience. William is the father of three
+			children and lives in the foothills of the Sierra Nevada Mountains in
+			California.
+		</p>
+	</div>
+
 </section>
 
 <section></section>
diff --git a/tutors/email/index.php b/tutors/email/index.php
new file mode 100644
index 0000000..666ebf0
--- /dev/null
+++ b/tutors/email/index.php
@@ -0,0 +1,68 @@
+<?php include('../../header.php'); ?>
+<section class="banner">
+	<h1>Email Setup</h1>
+</section>
+
+<section class="quiet flexible">
+	<div>
+		<p>
+			This guide is for Gmail users only. While most of this guide will also be applicable to other mail providers, additional steps may be required.
+		</p>
+
+		<h2>Receiving Mail</h2>
+
+		<p>
+			Once your <a href="/">carpentertutoring.com</a> email address is created, you will receive a verification email. In order to receive mail in your personal address from this alias, you will have to click the confirmation link in the verification email. Once complete, you can start receiving mail immediately.
+		</p>
+
+		<h2>Sending Mail</h2>
+
+		<p>
+			Sending mail from your <a href="/">carpentertutoring.com</a> address requires a small amount of setup.
+		</p>
+
+		<h3>App Password (for 2-Step Verification enabled accounts only)</h3>
+
+		<p>
+			If you have Google 2-Step Verification enabled, you must first generate an App Password. You can verify whether you have 2-Step Verification turned on for your Google account by <a href="https://myaccount.google.com/signinoptions/two-step-verification">visiting this link to your Google account settings</a>. If 2-Step Verification is turned off, you may skip the next step.
+		</p>
+
+		<p>
+			If 2-Step Verification is turned on, generate an App Password by <a href="https://myaccount.google.com/apppasswords">following this link</a>.
+
+		<ol>
+			<li>On your computer, open <a href="https://myaccount.google.com/apppasswords" target="_blank">App Passwords</a>.</li>
+			<li>In the bottom of the window, click <em>Select app</em> and choose <em>Mail</em> from the list.</li>
+			<li>Click <em>Select device</em> and choose <em>Other...</em> and enter "Carpenter Tutoring" in the box.</li>
+			<li>Click <em>Generate</em>. You will see 16 letters and numbers in a yellow box. Copy this or write it down for the next step.</li>
+			<li>Click <em>Done</em>. Keep in mind you will not be able to see the App Password anymore. If you forget it before the next step, you will have to create a new one.</li>
+		</ol>
+		</p>
+
+		<p>
+
+		<h3>Mail forwarding</h3>
+
+		<ol>
+			<li>On your computer, open <a href="https://mail.google.com" target="_blank">Gmail</a>.</li>
+			<li>In the top right, click settings (⚙️) and then <em>See all settings</em>.</li>
+			<li>Click the <em>Accounts and import</em> or <em>Accounts</em> tab.</li>
+			<li>In the "Send mail as" section, click <em>Add another email address</em>.</li>
+			<li>Enter your name and the address you want to send from. This will be your <a href="/">carpentertutoring.com</a> address. Leave the "Treat as an alias" box checked.</li>
+			<li>Click <em>Next Step</em>.</li>
+			<li>For the "SMTP server" enter <em>smtp.gmail.com</em>. Select <em>465</em> for the port.</li>
+			<li>For the username and password you will enter your personal Gmail address (with "@gmail.com" suffix) and password. If you generated an App Password for 2-Step Verification, you will use the App Password here instead of your Gmail password.</li>
+			<li>Check "Secured connection using SSL (recommended)" and click <em>Add Account</em>.</li>
+			<li>Return to the "Send mail as" section on the settings page and look for "When replying to a message." Check "Reply from the same address the message was sent to." This will ensure you respond to tutoring inquiries with your Carpenter Tutoring address and personal mail with your Gmail address.</li>
+		</ol>
+
+		</p>
+
+		<p>Now you should be able to immediately send mail as your Carpenter Tutoring alias. To test this, compose a new message an check the "From" box. You should see a menu there where you can choose which address to send mail from.</p>
+
+		<p>Thank you for being a part of Carpenter Tutoring!</p>
+	</div>
+
+</section>
+
+<?php include('../../footer.php'); ?>