csslint compliance and simplification

themes/etch-custom/assets/css/dark.css

@@ -1,24 +1,19 @@
-{{ if not (eq .Site.Params.dark "on") -}}
 @media (prefers-color-scheme: dark) {
-	{{ end -}}
-
 	html{
-		color: white;
 		background: black;
+		color: white;
 	}
 
 	a {
 		color: #00b1ed;
 	}
 
-	main#content hr {
+	hr {
 		border-color: #5c5c5c;
 	}
-	main#content pre,
+	pre,
-	main#content code {
+	code {
 		border: 1px solid #333;
 	}
 
-	{{- if not (eq .Site.Params.dark "on") -}}
 }
-{{- end -}}

themes/etch-custom/assets/css/main.css

@@ -1,98 +1,87 @@
 html {
+	font-family: sans-serif;
 	font-size: 16px;
 	line-height: 1.5rem;
-	font-family: sans-serif;
 }
 
 body {
-	max-width: 1000px;
 	margin: 0 auto;
-	padding: 0 5rem;
+	max-width: 1000px;
+	padding: 2rem 5rem;
 }
 
-header#banner {
+header nav {
-	margin: 2rem 0 0 0;
-}
-
-header#banner h2 {
-	display: inline;
-	font-size: 1.5rem;
-}
-
-header#banner nav {
 	display: inline-block;
-	padding: 0 0.5rem;
 }
 
-header#banner nav ul {
+header nav ul {
-	list-style-type: none;
 	font-size: 1.25rem;
+	list-style-type: none;
 	margin: 0;
-	padding: 0
+	padding: 0;
 }
 
-header#banner nav ul li {
+header nav ul li {
 	display: inline;
-	margin: 0.25rem;
+	padding: 0 0.25rem;
 }
-
+.home {
-main#content h1,
+	font-size: 1.5rem;
-main#content h2,
+	font-weight: bold;
-main#content h3 {
+	padding: 0 0.4rem 0 0;
-	margin: 1.5rem 0 1rem;
 }
 
 /* index.html styles */
-main#content ul#posts {
+main .posts {
 	list-style-type: none;
 	padding: 0;
 }
 
-main#content ul#posts li {
+main .posts li {
 	margin-bottom: 1rem;
 }
 
 /* single.html styles */
-main#content h1 {
+h1 {
 	font-size: 1.5rem;
 	line-height: 2rem;
+	margin: 1.5rem 0 1rem;
 }
-main#content h2 {
+h2 {
 	font-size: 1.25rem;
+	margin: 1.5rem 0 1rem;
 }
 
-main#content h3 {
+h3 {
 	font-size: 1.125rem;
+	margin: 1.5rem 0 1rem;
 }
 
-main#content img {
+img {
-	max-width: 100%;
 	margin: 0 auto;
+	max-width: 100%;
 }
 
-main#content code {
+code {
 	font-size: 16px;
-}
-
-main#content pre,
-main#content code {
-	border: 1px solid #e3e3e3;
-}
-
-main#content pre code {
-	border: none;
-}
-
-main#content pre {
-	overflow-y: visible;
-	overflow-x: scroll;
-	padding: 0.5rem;
-}
-
-main#content code {
 	padding: 0.1rem 0.25rem;
 }
 
-footer#footer {
+pre,
+code {
+	border: 1px solid #e3e3e3;
+}
+
+pre code {
+	border: none;
+}
+
+pre {
+	overflow-x: scroll;
+	overflow-y: visible;
+	padding: 0.5rem;
+}
+
+footer {
 	margin: 2rem 0;
 }

themes/etch-custom/assets/css/narrow.css

@@ -1,16 +1,20 @@
 @media (max-width: 600px) {
 	body {
 		max-width: 500px;
-		padding: 0 5%;
+		padding: 2rem 5%;
 	}
 
-	header#banner nav {
+	header nav {
 		display: block;
-		padding: 1rem 0 0.5rem;
+		padding: 0 0 0.25rem;
 	}
 
-	header#banner nav ul li {
+	header nav ul li {
 		display: block;
-		padding: 0.25rem 0;
+		padding: 0.5rem 0.25rem;
+	}
+
+	.home {
+		padding-bottom: 1rem;
 	}
 }

themes/etch-custom/layouts/partials/footer.html

@@ -1,4 +1,4 @@
-<footer id="footer">
+<footer id="site-footer">
 	{{ .Site.Params.copyright }}
 	·
 	<a href="{{ .Site.Params.src }}">Website source code</a>

themes/etch-custom/layouts/partials/header.html

@@ -1,7 +1,9 @@
 <header id="banner">
-	<h2><a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a></h2>
 	<nav>
 		<ul>
+			<li class="home">
+				<a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
+			</li>
 			{{ range .Site.Menus.main.ByWeight -}}
 			<li>
 				{{ .Pre }}<a href="{{ .URL }}" title="{{ .Title }}">{{- .Name -}}</a>{{ .Post }}

themes/etch-custom/layouts/partials/posts.html

@@ -4,7 +4,7 @@
 <h2>Posts</h2>
 {{ end -}}
 <p><em>Timestamp format: <code>YYYY-MM-DD</code>, as per <a href="https://www.ietf.org/rfc/rfc3339.txt">RFC 3339</a> and <a href="https://xkcd.com/1179/">ISO 8601</a></em></p>
-<ul id="posts">
+<ul class="posts">
 	{{- range where site.RegularPages "Type" "in" site.Params.mainSections }}
 	<li>
 		<time datetime="{{ .Date.Format "2006-01-02 15:04:05Z07:00" }}">{{ .Date.Format "2006-01-02" }}</time>