add rss and social media icons to header

3 files changed, 31 insertions, 8 deletions

diff --git a/_includes/head.html b/_includes/head.html
index 2fe3b2a..3758dc3 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -6,6 +6,7 @@
   <link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
   <link rel="stylesheet" href="{{ "/assets/normalize.css" | relative_url }}">
   <link rel="stylesheet" href="{{ "/assets/skeleton.css" | relative_url }}">
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
   <link rel="stylesheet" href="{{ "/assets/main.css" | relative_url }}">
   {%- feed_meta -%}
   {%- if jekyll.environment == 'production' and site.google_analytics -%}
diff --git a/_includes/header.html b/_includes/header.html
index 2d9f4c8..4ce71f8 100644
--- a/_includes/header.html
+++ b/_includes/header.html
@@ -1,14 +1,25 @@
 <header id="title-header" role="banner">
   <div class="row">
-    <div class="six columns">
+    <div class="eight columns">
       <h5 class="title">
         <a href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>
       </h5>
     </div>
-    <!--
-    <div class="six columns">
-      subscribe <a href="{{ "/feed.xml" | relative_url }}">via RSS</a>
+
+    <div class="four columns">
+      <div class="social">
+        <a>RSS/Social:</a>
+        <a href="{{ 'feed.xml' | relative_url }}">
+          <i class="fas fa-rss"></i>
+        </a>
+        <a href="https://github.com/{{ site.github_username }}">
+          <i class="fab fa-github"></i>
+        </a>
+        <a href="https://twitter.com/{{ site.twitter_username }}">
+          <i class="fab fa-twitter"></i>
+        </a>
+      </div>
     </div>
-    -->
+
   </div>
 </header>
diff --git a/assets/main.css b/assets/main.css
index 6dfcdd9..99b30aa 100644
--- a/assets/main.css
+++ b/assets/main.css
@@ -3,13 +3,14 @@ ul {
 }
 
 #title-header  {
-    padding-top: 1rem;
-    padding-bottom: 3rem;
     border-bottom: 1px solid #AAA;
 }
 
 #title-header .title {
-    margin: 0;
+    margin-top: 2rem;
+    margin-bottom: 2rem;
+    margin-left: 0;
+    margin-right: 0;
 }
 
 #title-header .title a {
@@ -17,6 +18,16 @@ ul {
     text-decoration: none;
 }
 
+#title-header .social {
+    margin-top: 1rem;
+}
+
+#title-header .social a {
+    color: #AAA;
+    text-decoration: none;
+    margin-right: 1em;
+}
+
 #posts-list {
     margin-top: 3rem;
     list-style: none;