Merge pull request #94 from wikitongues/style-footer

Style footer
wikitongues · Jul 19, 2024 · 3ab9308 · 3ab9308
2 parents 7983919 + 6f9926a
commit 3ab9308
Show file tree

Hide file tree

Showing 3 changed files with 183 additions and 79 deletions.
diff --git a/footer.php b/footer.php
@@ -1,49 +1,48 @@
 <section class="wt_newsletter">
+	<h2>Stay in touch</h2>
 	<?php echo get_field('newsletter_signup_embed', 'options'); ?>
 </section>
 
 <footer class="wt_footer">
 
-	<section class="wt_footer__section">
-		<!-- footer navigation -->
-		<?php
-			wp_nav_menu(
-				array( 
-					'theme_location' => 'footer-menu',
-					'container' => 'nav',
-					'container_class' => 'wt_footer__nav'
-				)
-			); 
-		?>
+	<section class="wt_footer__logo">
+		<a href="<?php bloginfo('url'); ?>">
+			<img src="<?php the_field('footer_logo', 'options'); ?>" alt="Wikitongues Logo">
+		</a>
+	</section>
 
-		<!-- contact information -->
+	<section class="wt_footer__section" id="content">
+		<?php wp_nav_menu(
+			array( 
+				'theme_location' => 'footer-menu',
+				'container' => 'nav',
+				'container_class' => 'wt_footer__nav'
+			)
+		); ?>
 		<aside class="wt_footer__meta">
-			<a class="wt_footer__logo" href="<?php bloginfo('url'); ?>">
-				<img src="<?php the_field('footer_logo', 'options'); ?>"
-				     alt="Wikitongues Logo">
-			</a>
-			<p class="wt_footer__address">
-				<?php the_field('wikitongues_address', 'options'); ?>
-			</p>
-			<p class="wt_footer__contact">
-				<?php the_field('wikitongues_email', 'options'); ?><br />
-				<?php the_field('wikitongues_phone', 'options'); ?>
-			</p>
+			<section>
+				<div>
+				<p class="wt_footer__address">
+					<?php the_field('wikitongues_address', 'options'); ?>
+				</p>
+				<p class="wt_footer__contact">
+					<?php the_field('wikitongues_email', 'options'); ?><br />
+					<?php the_field('wikitongues_phone', 'options'); ?>
+				</p>
+				</div>
+				<div>
+				<a class="wt_footer__candid" href="https://www.guidestar.org/profile/shared/8eef7d54-d184-4013-aad1-0e3ada544f64" target="_blank"><img src="https://widgets.guidestar.org/TransparencySeal/9488075" /></a>
+				</div>
+			</section>
 		</aside>
-
-		<!-- clear floats -->
-		<div class="clear"></div>
 	</section>
 
-	<!-- land acknowledgement and copyright notice -->
-	<section class="wt_footer__section">
+	<section class="wt_footer__section" id="colophon">
 		<p class="wt_footer__land-acknowledgement">
 			<?php the_field('land_acknowledgement', 'options'); ?>
+			<br>
+			<span class="wt_footer__copyright">&#169; Copyright <?php echo date('Y'); ?> Wikitongues, All Rights Reserved</span>
 		</p>
-		<p class="wt_footer__copyright">
-			<span>&#169; Copyright <?php echo date('Y'); ?> Wikitongues, All Rights Reserved</span>
-		</p>
-		<a class="wt_footer__candid" href="https://www.guidestar.org/profile/shared/8eef7d54-d184-4013-aad1-0e3ada544f64" target="_blank"><img src="https://widgets.guidestar.org/TransparencySeal/9488075" /></a>
 	</section>
 
 	<?php wp_footer(); ?>

diff --git a/stylus/main.css b/stylus/main.css
@@ -2005,6 +2005,15 @@ text
   background: #9581c2;
   text-align: center;
 }
+.wt_newsletter h2 {
+  font-family: 'Schnyder Wide M Web';
+  font-weight: 300;
+  font-style: normal;
+  font-stretch: normal;
+  font-size: 6.08rem;
+  color: #101010;
+  margin-bottom: 3rem;
+}
 .wt_newsletter form>div {
   display: flex;
   justify-content: center;
@@ -2065,7 +2074,7 @@ text
   cursor: pointer;
 }
 .wt_footer {
-  padding: 6rem;
+  padding: 2rem 4rem;
   background: #101010;
   font-family: 'Graphik Web';
   font-weight: 400;
@@ -2075,13 +2084,35 @@ text
   line-height: 1.3;
   color: #fffcef;
   font-size: 1.28rem !important;
+  display: inline-block;
+  width: 100%;
 }
-.wt_footer__section:first-of-type {
+.wt_footer__logo {
+  width: 100%;
+  display: inline-block;
+  margin-bottom: 8px;
+  border-bottom: 1px dotted #3814a5;
+}
+.wt_footer__logo a {
+  display: inline-block;
+  float: right;
+}
+.wt_footer__logo img {
+  max-width: 250px;
+}
+.wt_footer__section {
+  float: left;
+  display: flex;
+  width: 100%;
+  justify-content: center;
+}
+.wt_footer__section#content {
   display: flex;
   flex-direction: row;
 }
-.wt_footer__section:last-of-type {
+.wt_footer__section#colophon {
   text-align: center;
+  margin: 2rem 0 3rem 0;
 }
 .wt_footer__nav {
   flex-grow: 3;
@@ -2100,40 +2131,51 @@ text
   line-height: 1.3;
   color: #fffcef;
   text-decoration: none;
-  font-size: 1.28rem !important;
+  text-transform: initial;
 }
 .wt_footer__nav >ul>li {
   margin-right: 3rem;
 }
 .wt_footer__nav >ul>li>a {
-  font-weight: 600 !important;
+  font-weight: bold;
 }
 .wt_footer__nav .sub-menu {
-  margin-top: 1.5rem;
+  margin-top: 0.5rem;
+}
+.wt_footer__nav .sub-menu a {
+  font-size: 1em;
+  padding: 0.2rem 0;
+  display: inline-block;
 }
 .wt_footer__meta {
   flex-grow: initial;
   text-align: right;
 }
-.wt_footer__logo img {
-  max-width: 150px;
+.wt_footer__meta section {
+  display: inline-block;
+  clear: both;
+  float: left;
 }
-.wt_footer__address {
-  margin: 1.5rem 0;
+.wt_footer__meta section div {
+  float: left;
+}
+.wt_footer__meta section div:first-of-type {
+  margin-right: 16px;
 }
-.wt_footer__land-acknowledgement {
-  margin: 3rem 0 1.5rem;
+.wt_footer__address {
+  margin: 0 0 1.5rem 0;
 }
 .wt_footer__land-acknowledgement a {
   color: #fffcef;
 }
 .wt_footer__copyright {
-  font-weight: 700 !important;
+  font-weight: 700;
+  margin-top: 8px;
+  display: inline-block;
 }
 .wt_footer__candid {
   display: inline-block;
-  width: 90px;
-  margin-top: 2rem;
+  width: 100px;
 }
 .wt_footer__candid img {
   width: 100%;
@@ -2145,15 +2187,13 @@ text
   }
   .wt_footer__nav {
     width: 100%;
-    text-align: center;
   }
   .wt_footer__nav>ul {
     justify-content: center;
   }
   .wt_footer__meta {
     margin: 6rem auto;
     width: 100%;
-    text-align: center;
   }
 }
 @media all and (max-width: 768px) {
@@ -2170,16 +2210,30 @@ text
   .wt_newsletter form input[type="submit"] {
     width: 100%;
   }
+  .wt_footer__logo {
+    display: flex;
+    justify-content: center;
+    margin: 1.5rem 0;
+  }
+  .wt_footer__section#content {
+    flex-direction: column;
+  }
   .wt_footer__nav>ul {
     display: block;
+    font-size: 1.2em;
   }
   .wt_footer__nav>ul>li {
-    margin-top: 3rem;
+    margin-top: 2rem;
     margin-right: 0rem;
   }
   .wt_footer__nav>ul>li:first-of-type {
     margin-top: 0;
   }
+  .wt_footer__meta {
+    margin: 2rem auto 0;
+    display: flex;
+    justify-content: center;
+  }
 }
 .wt_button--wide {
   width: 100%;