From 118bfc6346a1004212284ff9799d0afcd2c80540 Mon Sep 17 00:00:00 2001
From: Raymond Wanyoike <raymond.wanyoike@gmail.com>
Date: Tue, 29 Nov 2016 14:54:27 +0300
Subject: [PATCH] Visual improvements

---
 alchemy/static/css/style.css   | 75 ++++++++++++++++++++--------------
 alchemy/templates/article.html |  8 ++--
 alchemy/templates/base.html    | 28 ++++++-------
 alchemy/templates/index.html   |  4 +-
 4 files changed, 64 insertions(+), 51 deletions(-)

diff --git a/alchemy/static/css/style.css b/alchemy/static/css/style.css
index a7c2220..1b065db 100644
--- a/alchemy/static/css/style.css
+++ b/alchemy/static/css/style.css
@@ -46,7 +46,6 @@ h4,
 h5,
 h6 {
   font-family: Montserrat, 'Helvetica Neue', sans-serif;
-  font-weight: bold;
 }
 
 a {
@@ -74,6 +73,34 @@ blockquote {
   padding-bottom: 10px;
 }
 
+.header img {
+  margin: 20px 0;
+}
+
+.header h1 {
+  font-size: 3em;
+}
+
+.header p {
+  margin-top: 20px;
+}
+
+.header hr {
+  border-color: #ddd;
+  margin: 15px 0;
+}
+
+.header ul {
+  font-family: Montserrat, 'Helvetica Neue', sans-serif;
+  font-size: 1.1em;
+  margin-bottom: 0;
+  text-transform: lowercase;
+}
+
+.header li {
+  margin-bottom: 10px;
+}
+
 .main {
   background-color: #fff;
   padding: 20px 0;
@@ -84,8 +111,16 @@ blockquote {
   padding: 20px 0;
 }
 
-.highlight pre {
-  border: 1px solid #ddd;
+.footer ul {
+  margin-bottom: 0;
+}
+
+.page-header {
+  margin-top: 0;
+}
+
+.page-header h1 {
+  line-height: 1.3;
 }
 
 .pagination > li > a,
@@ -93,34 +128,13 @@ blockquote {
   color: #333;
 }
 
-.header img {
-  margin: 20px 0;
+.highlight pre {
+  border: 1px solid #ddd;
 }
 
-.header h1 {
-  font-size: 3em;
-}
-
-.header p {
-  font-size: 1.1em;
-  margin-top: 20px;
-}
-
-.header ul {
-  font-family: Montserrat, 'Helvetica Neue', sans-serif;
-  margin-bottom: 0;
-}
-
-.header li {
-  margin-bottom: 10px;
-}
-
-.page-header {
-  margin-top: 0;
-}
-
-.teaser h2 {
+.teaser h4 {
   margin-top: 0;
+  line-height: 1.3;
 }
 
 .teaser p {
@@ -136,13 +150,14 @@ blockquote {
 .article > p,
 .article > blockquote,
 .article > .highlight {
-  margin: 30px 0;
+  margin: 20px 0;
 }
 
 .article > h2 {
-  margin-top: 50px;
+  margin-top: 30px;
 }
 
+
 .article a {
   text-decoration: underline
 }
diff --git a/alchemy/templates/article.html b/alchemy/templates/article.html
index 542e4c6..38c91f9 100644
--- a/alchemy/templates/article.html
+++ b/alchemy/templates/article.html
@@ -18,16 +18,16 @@
   <header>
     <ul class="list-inline">
       <li class="text-muted" title="{{ article.date.isoformat() }}">
-        <i class="fa fa-fw fa-clock-o"></i>
+        <i class="fa fa-clock-o"></i>
         {{ article.locale_date }}
       </li>
       <li>
-        <i class="fa fa-fw fa-folder-open"></i>
+        <i class="fa fa-folder-open-o"></i>
         <a href="{{ SITEURL }}/{{ article.category.url }}">{{ article.category }}</a>
       </li>
       {% if article.tags %}
       <li>
-        <i class="fa fa-fw fa-tags"></i>
+        <i class="fa fa-files-o"></i>
         {% for tag in article.tags %}
         <a href="{{ SITEURL }}/{{ tag.url }}">#{{ tag }}</a>{% if not loop.last %}, {% endif %}
         {% endfor %}
@@ -35,7 +35,7 @@
       {% endif %}
       {% if not HIDE_AUTHORS and article.authors %}
       <li>
-        <i class="fa fa-fw fa-users"></i>
+        <i class="fa fa-user-o"></i>
         {% for author in article.authors %}
         <a href="{{ SITEURL }}/{{ author.url }}">{{ author }}</a>{% if not loop.last %}, {% endif %}
         {% endfor %}
diff --git a/alchemy/templates/base.html b/alchemy/templates/base.html
index ca47687..f621783 100644
--- a/alchemy/templates/base.html
+++ b/alchemy/templates/base.html
@@ -90,7 +90,7 @@
             {% if (LINKS or (DISPLAY_PAGES_ON_MENU and PAGES)) and loop.first %}
             <li class="text-muted">|</li>
             {% endif %}
-            <li><a class="fa fa-fw fa-lg fa-{{ icon }}" href="{{ link }}" target="_blank"></a></li>
+            <li><a class="fa fa-lg fa-{{ icon }}" href="{{ link }}" target="_blank"></a></li>
             {% endfor %}
           </ul>
           {% endif %}
@@ -108,22 +108,20 @@
     </div>
   </div>
 
-  <footer class="footer">
+  <footer class="footer text-muted">
     <div class="container">
       <div class="row">
-        <div class="col-sm-6">
-          <nav class="list-inline">
-            {% if not HIDE_AUTHORS %}
-            <li><a href="{{ SITEURL }}/authors.html">Authors</a></li>
-            {% endif %}
-            <li><a href="{{ SITEURL }}/archives.html">Archives</a></li>
-            <li><a href="{{ SITEURL }}/categories.html">Categories</a></li>
-            {% if tags|length %}
-            <li><a href="{{ SITEURL }}/tags.html">Tags</a></li>
-            {% endif %}
-          </nav>
-        </div>
-        <div class="col-sm-6 hidden-xs text-right text-muted">
+       <ul class="col-sm-6 list-inline">
+          {% if not HIDE_AUTHORS %}
+          <li><a href="{{ SITEURL }}/authors.html">Authors</a></li>
+          {% endif %}
+          <li><a href="{{ SITEURL }}/archives.html">Archives</a></li>
+          <li><a href="{{ SITEURL }}/categories.html">Categories</a></li>
+          {% if tags|length %}
+          <li><a href="{{ SITEURL }}/tags.html">Tags</a></li>
+          {% endif %}
+        </ul>
+        <div class="col-sm-6 hidden-xs text-right">
           Generated by <a href="https://github.com/getpelican/pelican" target="_blank">Pelican</a> using <a href="https://github.com/nairobilug/pelican-alchemy" target="_blank">&#x2728; alchemy</a>
         </div>
       </div>
diff --git a/alchemy/templates/index.html b/alchemy/templates/index.html
index b69a7e3..04ab23b 100644
--- a/alchemy/templates/index.html
+++ b/alchemy/templates/index.html
@@ -18,7 +18,7 @@ All Articles
 {% block content %}
 {% for article in articles_page.object_list %}
 <article class="row teaser">
-  <header class="col-sm-4 hidden-xs text-right text-muted">
+  <header class="col-sm-4 hidden-xs text-muted">
     <div title="{{ article.date.isoformat() }}">
       {{ article.locale_date }}
     </div>
@@ -34,7 +34,7 @@ All Articles
     {% endif %}
   </header>
   <div class="col-sm-8">
-    <h2><a href="{{ SITEURL }}/{{ article.url }}">{{ article.title }}</a></h2>
+    <h4><a href="{{ SITEURL }}/{{ article.url }}">{{ article.title }}</a></h4>
     {{ article.summary|striptags }}
   </div>
 </article>