From 7a191606cbf5cd290dad1f89cc6f007a87b40231 Mon Sep 17 00:00:00 2001
From: Adam Carpenter <atc@53hor.net>
Date: Sat, 14 Mar 2020 21:03:04 -0400
Subject: changed up theming, added fonts, logo, etc

---
 src/html/index.html | 250 +++++++++++++++++++++++++++-------------------------
 1 file changed, 132 insertions(+), 118 deletions(-)

(limited to 'src/html/index.html')

diff --git a/src/html/index.html b/src/html/index.html
index 777d1ef..08a7c84 100644
--- a/src/html/index.html
+++ b/src/html/index.html
@@ -19,7 +19,7 @@
 		<nav class="navbar is-fixed-top">
 			<div class="navbar-brand">
 				<a class="navbar-item" href="#">
-					Carpenter Tutoring
+					<img src="/logo.png">
 				</a>
 				<a role="button" class="navbar-burger" data-target="navMenu" aria-label="menu" aria-expanded="false">
 					<span aria-hidden="true"></span>
@@ -37,12 +37,12 @@
 					<a class="navbar-item" href="#about">
 						About
 					</a>
-					<a class="navbar-item" href="#testimonials">
-						Testimonials
-					</a>
-					<a class="navbar-item" href="#contact">
-						Contact Me
-					</a>
+					<!--<a class="navbar-item" href="#testimonials">
+			 Testimonials
+			 </a>-->
+			 <a class="navbar-item" href="#contact">
+				 Contact Me
+			 </a>
 				</div>
 			</div>
 		</nav>
@@ -50,7 +50,7 @@
 		<!-- title, slogan, phone -->
 		<section class="section">
 			<div class="container">
-				<div class="box has-text-right banner">
+				<div class="box has-text-right banner darkteal">
 					<h1 class="title">
 						Carpenter Tutoring
 					</h1>
@@ -67,12 +67,11 @@
 		</section>
 
 		<!-- intro blurb, logo -->
-		<section class="section">
+		<section class="section quiet">
 			<div class="container">
 				<div class="columns">
 					<div class="column">
-						<div class="box">
-							<p>
+							<h2 class="subtitle">
 							Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 							Mauris eget lobortis erat. Vivamus venenatis nec quam vitae
 							vulputate. Class aptent taciti sociosqu ad litora torquent
@@ -82,12 +81,13 @@
 							Phasellus accumsan vitae elit sed fringilla. Nulla
 							porttitor magna eget ipsum ultricies malesuada quis a
 							ipsum.
-							</p>
-						</div>
+							</h2>
 					</div>
-					<div class="column is-narrow">
-						<div class="box translucent">
-							LOGO
+					<div class="column is-one-third">
+						<div class="box">
+							<figure class="image">
+								<img src="/amy.jpg">
+							</figure>
 						</div>
 					</div>
 				</div>
@@ -96,125 +96,140 @@
 
 		<!-- offerings tiles -->
 		<section class="section" id="offerings">
-			<div class="tile is-ancestor">
+			<div class="container">
+				<div class="tile is-ancestor">
 
-				<div class="tile is-parent is-vertical">
-					<div class="tile is-child">
-						<div class="box">
-							<p>
-							Subject Tutoring
-							</p>
-							<p>
-							Tutoring for specific courses or disciplines. Click
-							here for a full list of courses covered.
-							</p>
+					<div class="tile is-parent is-vertical">
+						<div class="tile is-child">
+							<div class="box darkgray">
+								<div class="box darkteal">
+									<p>
+									Subject Tutoring
+									</p>
+									<p>
+									Tutoring for specific courses or disciplines. Click
+									here for a full list of courses covered.
+									</p>
+								</div>
+							</div>
 						</div>
-					</div>
-					<div class="tile is-child">
-						<div class="box">
-							<p>
-							Time Management
-							</p>
-							<p>
-							Personalized plans for managing academics,
-							extracurriculars, and other commitments.
-							</p>
+						<div class="tile is-child">
+							<div class="box darkgray">
+								<div class="box green">
+									<p>
+									Time Management
+									</p>
+									<p>
+									Personalized plans for managing academics,
+									extracurriculars, and other commitments.
+									</p>
+								</div>
+							</div>
 						</div>
 					</div>
-				</div>
 
 
-				<div class="tile is-parent is-vertical">
-					<div class="tile is-child">
-						<div class="box">
-							<p>
-							Study Skills
-							</p>
-							<p>
-							Learn how to make the most of your study time.
-							</p>
+					<div class="tile is-parent is-vertical">
+						<div class="tile is-child">
+							<div class="box darkgray">
+								<div class="box darkgreen">
+									<p>
+									Study Skills
+									</p>
+									<p>
+									Learn how to make the most of your study time.
+									</p>
+								</div>
+							</div>
 						</div>
-					</div>
-					<div class="tile is-child">
-						<div class="box">
-							<p>
-							Academic Coaching
-							</p>
-							<p>
-							Time management and study skills blended with
-							continuing accountability.
-							</p>
+						<div class="tile is-child">
+							<div class="box darkgray">
+								<div class="box darkerteal">
+									<p>
+									Academic Coaching
+									</p>
+									<p>
+									Time management and study skills blended with
+									continuing accountability.
+									</p>
+								</div>
+							</div>
 						</div>
 					</div>
-				</div>
 
 
-				<div class="tile is-parent is-vertical">
-					<div class="tile is-child">
-						<div class="box">
-							<p>
-							College Prep
-							</p>
-							<p>
-							ACT &amp; SAT preparation and assistance with
-							college application essays.
-							</p>
+					<div class="tile is-parent is-vertical">
+						<div class="tile is-child">
+							<div class="box darkgray">
+								<div class="box darkteal">
+									<p>
+									College Prep
+									</p>
+									<p>
+									ACT &amp; SAT preparation and assistance with
+									college application essays.
+									</p>
+								</div>
+							</div>
 						</div>
-					</div>
-					<div class="tile is-child">
-						<div class="box">
-							<p>
-							College-Level Writing
-							</p>
-							<p>
-							Get a head start on meeting professors'
-							expectations.
-							</p>
+						<div class="tile is-child">
+							<div class="box darkgray">
+								<div class="box green">
+									<p>
+									College-Level Writing
+									</p>
+									<p>
+									Get a head start on meeting professors'
+									expectations.
+									</p>
+								</div>
+							</div>
 						</div>
 					</div>
-				</div>
 
 
-				<div class="tile is-parent is-vertical">
-					<div class="tile is-child">
-						<div class="box">
-							<p>
-							Group Webinars
-							</p>
-							<p>
-							Participate in general workshops and pre-planned
-							courses from the comfort of home.
-							</p>
+					<div class="tile is-parent is-vertical">
+						<div class="tile is-child">
+							<div class="box darkgray">
+								<div class="box darkgreen">
+									<p>
+									Group Webinars
+									</p>
+									<p>
+									Participate in general workshops and pre-planned
+									courses from the comfort of home.
+									</p>
+								</div>
+							</div>
 						</div>
-					</div>
-					<div class="tile is-child">
-						<div class="box">
-							<p>
-							Parent Consultations
-							</p>
-							<p>
-							For parents seeking advice for facilitating their child's learning.
-							</p>
+						<div class="tile is-child">
+							<div class="box darkgray">
+								<div class="box darkerteal">
+									<p>
+									Parent Consultations
+									</p>
+									<p>
+									For parents seeking advice for facilitating their child's learning.
+									</p>
+								</div>
+							</div>
 						</div>
 					</div>
-				</div>
 
+				</div>
 			</div>
 		</section>
 
 		<!-- about pic and text -->
-		<section class="section" id="about">
+		<section class="section quiet" id="about">
 			<div class="container">
 				<div class="columns">
 					<div class="column is-one-third">
-						<div class="box">
 							<figure class="image">
-								<img src="/amy.jpg">
+								<img src="/logo.png">
 							</figure>
-						</div>
 					</div>
 					<div class="column">
-						<div class="box">
 							<div class="content">
 								<p>
 								School is tricky, and there is no universal pathway
@@ -256,25 +271,24 @@
 								<p>
 								-- Amy Carpenter
 								</p>
-							</div>
 						</div>
 					</div>
 				</div>
 		</section>
 
 		<!-- testimonial bubbles -->
-		<section class="section" id="testimonials">
-			<div class="container">
-				<div class="blurb">
-					<p>
-					Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-					Mauris eget lobortis erat. Vivamus venenatis nec quam vitae
-					vulputate. Class aptent taciti sociosqu ad litora torquent
-					per conubia nostra, per inceptos himenaeos. 
-					</p>
-				</div>
-			</div>
-		</section>
+		<!--<section class="section" id="testimonials">
+		<div class="container">
+		<div class="blurb">
+		<p>
+		Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+		Mauris eget lobortis erat. Vivamus venenatis nec quam vitae
+		vulputate. Class aptent taciti sociosqu ad litora torquent
+		per conubia nostra, per inceptos himenaeos. 
+		</p>
+		</div>
+		</div>
+		</section>-->
 
 		<!-- contact box, additional contact and tutoring info -->
 		<section class="section" id="contact">
@@ -334,6 +348,6 @@
 			</div>
 		</footer>
 
-		<script src="js/nav-toggle.js"></script>
+		<script src="/js/nav-toggle.js"></script>
 	</body>
 </html>
-- 
cgit v1.2.3