Making color variables and formatting footer a bit more

site/_layouts/default.html

@@ -23,18 +23,17 @@ layout: skeleton
 <footer>
   <div class="content-bound">
     <p class="copyright">Copyright &copy; <span class="copyright-date">2012</span> Logan McGrath. All rights reserved.</p>
-    <div class="generated-by-hakyll">
-      <p>
-        Site proudly generated by <a href="http://jaspervdj.be/hakyll">Hakyll</a>.
-      </p>
-      <p>
-        $if(sourceFileName)$
-        Generated from <a href="$gitWebUrl$/blob/$gitSha1$/$sourceFilePath$">$sourceFileName$</a>
-        $else$
-        This page was rendered from derived content
-        $endif$
-        at commit <a class="commit-link" href="$gitWebUrl$/commit/$gitSha1$">[$gitSha1$] $gitMessage$</a>$if(isChanged)$ with local changes$endif$.
-      </p>
-    </div>
+    <p class="generated-by-hakyll">
+      Site proudly generated by <a href="http://jaspervdj.be/hakyll">Hakyll</a>.
+    </p>
+    <p class="source-commit">
+      This page was rendered from
+      $if(sourceFileName)$
+      <a href="$gitWebUrl$/blob/$gitSha1$/$sourceFilePath$">$sourceFileName$</a>
+      $else$
+      derived data
+      $endif$
+      at commit <a class="commit-link" href="$gitWebUrl$/commit/$gitSha1$">[$gitSha1$] $gitMessage$</a>$if(isChanged)$ with local changes$endif$.
+    </p>
   </div>
 </footer>

site/css/_variables.scss

@@ -8,6 +8,7 @@ $code-font-size: 0.75rem; // because JetBrains Mono runs a bit big
 
 $color-green: darkgreen;
 $color-text: darkslategray;
+$color-text-dark: darken($color-green, 10%);
 $color-text-light: slategray;
 $color-emphasize: $color-green;
 $color-highlight: gold;
@@ -15,6 +16,7 @@ $color-hover: yellow;
 $color-aside: beige;
 $color-hyperlink: dodgerblue;
 $color-background: ivory;
+$color-scrollbar: cadetblue;
 
 $border-ginormous-width: 0.5rem;
 $border-very-thick-width: 0.4rem;

site/css/elements/_asides.scss

@@ -24,7 +24,7 @@ aside {
     }
 
     figcaption {
-      color: darken($color-green, 10%);
+      color: $color-text-dark;
       font-size: 1rem;
       text-align: center;
       padding: 0.5rem;

site/css/elements/_code.scss

@@ -60,17 +60,16 @@ div.sourceCode {
 code.sourceCode {
   font-size: 0;
   display: block;
-  position: relative;
-  margin: 0 1rem;
+  margin: 0 3rem;
 
   .numberLines & {
-    padding-left: 3rem;
+    padding-left: 0;
     counter-reset: line-number;
   }
 
   > span {
     background-color: beige;
-    display: block;
+    display: flex;
     width: 100%;
     padding: 0 0.5rem;
     font-size: $code-font-size;

site/css/elements/_containers.scss

@@ -33,7 +33,7 @@
     width: 0.5rem;
   }
   &::-webkit-scrollbar-thumb {
-    background-color: cadetblue;
+    background-color: $color-scrollbar;
     border-radius: 0.5rem;
   }
 }

site/css/layout/_footer.scss

@@ -15,6 +15,11 @@ body > footer {
     font-size: 0.9rem;
   }
   .generated-by-hakyll {
-    font-size: 0.8rem
+    font-size: 0.8rem;
+  }
+  .source-commit {
+    color: $color-text-light;
+    font-size: 0.8rem;
+    font-style: italic;
   }
 }