From d48d4f2cba44c60c9126fd69ae473f5e85640c9a Mon Sep 17 00:00:00 2001
From: Matt Marcha <matt@marcha.pro>
Date: Tue, 11 Oct 2022 18:02:43 +1300
Subject: [PATCH] Various small style improvements

---
 css/content.css            | 26 ++++++++++++++-----
 functions.php              |  3 +++
 style.css                  | 53 +++++++++++++++++++++++++++++++-------
 template-parts/content.php |  2 +-
 4 files changed, 66 insertions(+), 18 deletions(-)

diff --git a/css/content.css b/css/content.css
index e1ebcd4..4a8aae9 100644
--- a/css/content.css
+++ b/css/content.css
@@ -64,13 +64,13 @@ main#primary,
 }
 
 main#primary > * {
-    max-width: 980px;
+    max-width: 580px;
     margin-left: auto;
     margin-right: auto;
 }
 
 main#primary > *.alignwide {
-    max-width: 1180px;
+    max-width: 880px;
 }
 
 main#primary > *.alignfull {
@@ -84,7 +84,7 @@ main#primary > *.alignfull {
 }
 
 .page-header {
-    max-width: 1200px;
+    max-width: 600px;
     width: calc(100% - 10px);
     margin: 0 auto;
     text-align: center;
@@ -103,11 +103,16 @@ body {
     margin: 0;
     color: var(--text);
     font-size: 16px;
-    font-family: var(--sans-font);
+    font-family: var(--serif-font);
     line-height: 1.33;
     background-color: var(--bg);
 }
 
+body .entry-content {
+    font-size: 20px;
+    font-weight: 100;
+}
+
 a {
     color: var(--accent);
     text-decoration: underline;
@@ -124,16 +129,17 @@ h3,
 h4,
 h5,
 h6 {
-    font-family: var(--serif-font);
+    font-family: var(--sans-font);
     font-variant: small-caps;
     color: var(--text);
+    font-weight: normal;
 }
 
 h1 {
-    font-size: 2.5rem;
+    font-size: 3rem;
 }
 h2 {
-    font-size: 1.6rem;
+    font-size: 2.2rem;
     margin-top: 1.25em;
     margin-bottom: 1.25em;
 }
@@ -167,6 +173,12 @@ ul {
     margin-bottom: 1em;
 }
 
+.wp-block-image figcaption {
+    text-align: center;
+    font-size: .9em;
+    color: var(--text-light);
+}
+
 .has-small-font-size {
     font-size: 0.8rem !important;
 }
diff --git a/functions.php b/functions.php
index 0e8c6c0..0fdda66 100644
--- a/functions.php
+++ b/functions.php
@@ -83,6 +83,9 @@ add_action( 'wp_enqueue_scripts', 'matt_scripts' );
 // Load only used blocks styles
 add_filter( 'should_load_separate_core_block_assets', '__return_true' );
 
+//remove prefix from archive titles
+add_filter( 'get_the_archive_title_prefix', '__return_empty_string' );
+
 
 /**
  ******** Enhancing scripts **********
diff --git a/style.css b/style.css
index 9870563..088ca7f 100644
--- a/style.css
+++ b/style.css
@@ -25,6 +25,19 @@ html {
 	box-sizing: border-box;
 }
 
+
+/**** General ****/
+
+header {
+ 	font-family: var(--sans-font);
+}
+
+footer {
+	max-width: 900px;
+	margin: 2em auto 0;
+	font-family: var(--sans-font);
+}
+
 /* Header
 --------------------------------------------- */
 
@@ -68,8 +81,9 @@ header#masthead .site-description {
 header#masthead {
 	position: relative;
 	width: 100vw;
-	max-width: 1200px;
+	max-width: 900px;
 	overflow: hidden;
+	margin: auto;
 }
 
 
@@ -118,6 +132,7 @@ header#masthead nav label.menu-toggle:before {
 
 header#masthead nav input.menu-toggle:checked ~ div.menu-main-menu-container {
 	display: block;
+	width: 100vw;
 }
 
 header#masthead nav input.menu-toggle:checked + label.menu-toggle:before {
@@ -131,7 +146,6 @@ header#masthead nav input.menu-toggle:checked + label.menu-toggle:before {
 
 header#masthead div.menu-main-menu-container {
 	position: fixed;
-	width: 100vw;
 	height: 100%;
 	z-index: 9;
 	overflow: scroll;
@@ -181,6 +195,8 @@ main#primary nav.post-navigation .nav-links{
 	flex-wrap: wrap;
 	justify-content: space-between;
 	gap: 0 2em;
+	font-family: var(--sans-font);
+	font-variant: small-caps;
 }
 
 main#primary nav.posts-navigation .nav-links a,
@@ -307,6 +323,14 @@ aside#comments ol.comment-list .comment-meta a {
 /* Archives
 --------------------------------------------- */
 
+.archive-description {
+	font-size: 1.5em;
+	color: var(--text-light);
+	margin: -1.5em auto 1.5em;
+	opacity: .8;
+}
+
+
 .blog article > header a,
 .archive article > header a,
 .blog article > footer a,
@@ -333,39 +357,48 @@ aside#comments ol.comment-list .comment-meta a {
 
 .blog article > header .cat-links,
 .archive article > header .cat-links {
-	margin: 0;
+	margin: 0 0 1.5em 0;
 	padding: 0;
 }
 
 .blog article > header .cat-links a,
 .archive article > header .cat-links a {
-	color: var(--text-light);
+	color: var(--text);
 	text-transform: uppercase;
-	opacity: 0.6;
 	letter-spacing: -1px;
 	font-weight: 100;
 }
 
+.blog article > header .posted-on,
+.archive article > header .posted-on {
+	font-style: italic;
+	font-size: .9em;
+	opacity: .6;
+	margin-bottom: -3em;
+}
+
 .blog article > footer .post-meta-comments,
 .archive article > footer .post-meta-comments {
 	text-align: center;
-		color: var(--text-light);
-		opacity: 0.8;
-	  font-size: 1.1em;
+	opacity: 0.9;
+	 font-size: 1.1em;
+	font-family: var(--sans-font);
 }
+
 .blog article > footer .post-meta-comments a,
 .archive article > footer .post-meta-comments a {
 	color: var(--text-light);
+	text-decoration: underline;
 }
 
 .blog article:after,
 .archive article:after {
 	content: "";
 	display: block;
-	width: 200px;
+	width: 100%;
 	height: 2px;
 	border-bottom: 1px solid var(--accent);
-	margin: 2em auto 3em;
+	margin: 1em auto 3em;
 }
 
 /* Footer
diff --git a/template-parts/content.php b/template-parts/content.php
index f178b91..9b2c702 100644
--- a/template-parts/content.php
+++ b/template-parts/content.php
@@ -10,12 +10,12 @@
 
 <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
     <header>
+	    <?php matt_entry_header(); ?>
         <?php if ( is_singular() ) : ?>
             <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
         <?php else : ?>
             <?php the_title( sprintf( '<h2 class="entry-title"><a href="%s">', esc_url( get_permalink() ) ), '</a></h2>' ); ?>
         <?php endif; ?>
-        <?php matt_entry_header(); ?>
     </header><!-- .entry-header -->
 
     <section class="entry-content">