Changing how categories and tags are rendered in the UI - issue#3

Author: kunallimaye

_config.yml

@@ -26,7 +26,7 @@ defaults:
       layout: "post"
 
 # Custom variables
-version: "1.1.0"
+version: "1.0.0"
 
 # Options
 custom_header: false

_layouts/post.html

@@ -5,18 +5,14 @@
 	<h2>{{ page.title }}</h2>
 	<time datetime="{{ page.date | date_to_xmlschema }}" class="by-line">{{ page.date | date_to_string }}</time>
 	{% for category in page.categories %}
-	<a href="/categories/#{{ category }}">
-		<span class="label label-category">
-				{{ category | replace:'-', ' ' }}
-			</span>
-		</a>
-		<span> &nbsp;</span>
+	<a href="/categories/#{{ category }}" class="label label-category">
+			{{ category | replace:'-', ' ' }}
+	</a>
 	{% endfor %}
 	{% for tag in page.tags %}
-	<a href="/tags/#{{ tag }}">
-		<span class="label label-tag">{{ tag | replace:'-', ' ' }}</span>
+	<a href="/tags/#{{ tag }}" class="label label-tag">
+		{{ tag | replace:'-', ' ' }}
 	</a>
-	<span> &nbsp;</span>
 	{% endfor %}
 	<div class="content">
 

_posts/2014-08-24-working-on-github-projects.md

@@ -2,19 +2,20 @@
 layout: post
 title: Working with projects on Github
 categories:
-  - technical
+    - technical
 tags:
-  - github
+    - github
 ---
 
 # Collaborating on Github projects
+
 Its safe to say that [github](http://github.com) is one of the most widely used source code management systems for software development.
 
-Every-time I start working on a new project on github, I always turn to good old [Google](www.google.com) to _get me started_ for the same set of questions.
+Every time I start working on a new project on github, I always turn to good old [Google](www.google.com) to *get me started* for the same set of questions.
 
 So here are the steps that I follow to start working on a project on github:
 
-### 1. [Fork the project code](http://help.github.com/articles/fork-a-repo)
+### 1.	[Fork the project code](http://help.github.com/articles/fork-a-repo)
 
 ```bash
    # Original project
@@ -23,7 +24,7 @@ So here are the steps that I follow to start working on a project on github:
    https://github.com/finiteloopme/apiman
 ```
 
-### 2. Clone your fork
+### 2.	Clone your fork
 
 ```bash
    # Clone the project locally
@@ -34,7 +35,7 @@ So here are the steps that I follow to start working on a project on github:
    git remote add upstream https://github.com/apiman/apiman
 ```
 
-### 3. Contribute fixes and/or features to the project
+### 3.	Contribute fixes and/or features to the project
 
 ```bash
    # Create a branch for a specific issue
@@ -51,4 +52,4 @@ So here are the steps that I follow to start working on a project on github:
    git push origin apiman-issue123
 ```
 
-### 4. Generate a [pull-request](http://help.github.com/articles/using-pull-requests) for your changes
+### 4.	Generate a [pull-request](http://help.github.com/articles/using-pull-requests) for your changes

_sass/custom.scss

@@ -8,6 +8,7 @@ $tag-color: #C0C0C0;
 
 .label-category {
    background-color: $category-color;
+   margin-right: 5px;
 }
 .label-category:hover {
    background-color: darken($category-color, 5%);
@@ -16,6 +17,7 @@ $tag-color: #C0C0C0;
 
 .label-tag {
    background-color: $tag-color;
+   margin-right: 5px;
 }
 .label-tag:hover {
    background-color: darken($tag-color, 5%);

_sass/layout.scss

@@ -169,13 +169,13 @@
   }
 
 .by-line {
-  /*display: block;*/
+  display: block;
   color: lighten($text-color, 25%);
   line-height: 1.5em; /* 24px/16px */
   margin-bottom: 1.5em; /* 24px/16px */
   font-weight: 200;
   @media (min-width: 940px) {
-    /*display: block;*/
+    display: block;
     color: lighten($text-color, 25%);
     line-height: 1.3334em; /* 24px/18px */
     margin-bottom: 1.3334em; /* 24px/18px */

index.html

@@ -7,21 +7,17 @@
 	{% for post in paginator.posts %}
 
 	  <li class="post">
-	  	<h2><a href="{% if site.baseurl == "/" %}{{ post.url }}{% else %}{{ post.url | prepend: site.baseurl }}{% endif %}">{{ post.title }}</a></h2>
+	  	<h2><a href="{% if site.baseurl == "/" %}{{ post.url }}{% else %}{{ post.url | prepend: site.baseurl }}{% endif %}">{{ post.title}}</a></h2>
 	  	<time datetime="{{ post.date | date_to_xmlschema }}" class="by-line">{{ post.date | date_to_string }}</time>
 		{% for category in post.categories %}
-		<a href="/categories/#{{ category }}">
-			<span class="label label-category">
+			<a href="/categories/#{{ category }}" class="label label-category">
 	                {{ category | replace:'-', ' ' }}
-				</span>
 			</a>
-			<span> &nbsp;</span>
 		{% endfor %}
 		{% for tag in post.tags %}
-		<a href="/tags/#{{ tag }}">
-			<span class="label label-tag">{{ tag | replace:'-', ' ' }}</span>
+		<a href="/tags/#{{ tag }}" class="label label-tag">
+			{{ tag | replace:'-', ' ' }}
 		</a>
-		<span> &nbsp;</span>
 		{% endfor %}
 	  	<p>{{ post.content | strip_html | truncatewords:50 }}</p>
 	  </li>