add content, adjust styles

src/content/posts/first-impressions-of-hugo.md

@@ -1,6 +1,6 @@
-+++
+---
-date = "2017-02-11T16:15:16-05:00"
+date: "2017-02-11T16:15:16-05:00"
-title = "First impressions of Hugo"
+title: "Site redesign!"
-+++
+---
-
+I rebuilt the site with a from-scratch Hugo theme. Styles are assembled from LESS with a Gulp task runner.
-It's pretty great!
+Afterwards, static assets are revision-hashed, and markup is reformatted.

src/themes/eos/layouts/_default/single.html

@@ -1,6 +1,6 @@
 {{ define "main" }}
   <article>
-    <h1>{{ .Title }}</h1>
+    <h2>{{ .Title }}</h2>
     {{ .Content }}
   </article>
 {{ end }}

src/themes/eos/static/css/bundle.css

@@ -14,6 +14,7 @@ html {
   overflow: hidden;
   color: white;
   text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.5);
+  line-height: 1.2;
 }
 a {
   color: inherit;
@@ -37,8 +38,16 @@ h4 {
   font-size: inherit;
   font-weight: bold;
   border-bottom: 0.1em dotted;
+  margin-bottom: -0.1em;
   margin-top: 1em;
 }
+h1 {
+  text-align: center;
+}
+h3 {
+  border-bottom: none;
+  margin-bottom: 0;
+}
 header {
   background-color: white;
   color: #20282a;
@@ -46,8 +55,11 @@ header {
 header nav a {
   text-decoration: none;
 }
-header nav a:hover {
+header nav a:hover,
-  text-decoration: underline;
+header nav a:focus {
+  color: white;
+  background-color: #20282a;
+  outline: none;
 }
 header nav a:before {
   content: '[';

src/themes/eos/styles/basics.less

@@ -16,6 +16,7 @@ html {
   overflow: hidden;
   color: @color-text;
   text-shadow: 0 0 0.1em fade(@color-text, 50%);
+  line-height: 1.2;
 }
 a {
   color: inherit;
@@ -32,15 +33,26 @@ h1, h2, h3, h4 {
   font-size: inherit;
   font-weight: bold;
   border-bottom: 0.1em dotted;
+  margin-bottom: -0.1em;
   margin-top: 1em;
 }
+h1 {
+  text-align: center;
+}
+h3 {
+  border-bottom: none;
+  margin-bottom: 0;
+}
+
 header {
   background-color: @color-text;
   color: #20282a;
   nav a {
     text-decoration: none;
-    &:hover {
+    &:hover, &:focus {
-      text-decoration: underline;
+      color: @color-text;
+      background-color: #20282a;
+      outline: none;
     }
     &:before {
       content: '[';

src/themes/eos/styles/layout.less

@@ -44,7 +44,7 @@ body {
     perspective-origin: ~'calc(100vw - 31vh) 45vh';
   }
   .wrapper {
-  transform: rotateZ(1.3deg) rotateX(-8.8deg) rotateY(-9.3deg) scale(0.3) translate3d(-56.2vh, 86.1vh, 46.3vh);
+    transform: rotateZ(1.3deg) rotateX(-8.8deg) rotateY(-9.3deg) scale(0.3) translate3d(-56.2vh, 86.1vh, 46.3vh);
     transform-origin: top right;
     padding: 1vh;
     width: 100vh;