Add tag cloud to tag index page

Author: mmistakes

assets/css/main.css

@@ -603,6 +603,10 @@ span+.entry-title{margin-top:0;}
 .post-list li:after{clear:both;}
 .post-list a>span{float:right;}
 .post-list .entry-date{font-size:14px;font-size:0.875rem;text-transform:uppercase;}
+.tag-box{list-style:none;margin:0;padding:4px 0;overflow:hidden;*zoom:1;}.tag-box:before,.tag-box:after{display:table;content:"";line-height:0;}
+.tag-box:after{clear:both;}
+.tag-box.inline li{float:left;font-size:14px;font-size:0.875rem;line-height:2.5;}
+.tag-box a{padding:4px 6px;margin:2px;background-color:#e6e6e6;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;text-decoration:none;}.tag-box a span{vertical-align:super;font-size:10px;font-size:0.625rem;}
 .footer-wrapper{*zoom:1;margin:2em auto;text-align:center;font-family:'volkorn',serif;font-size:14px;font-size:0.875rem;font-style:italic;color:#666666;}.footer-wrapper:before,.footer-wrapper:after{display:table;content:"";line-height:0;}
 .footer-wrapper:after{clear:both;}
 .footer-wrapper a{color:#666666;}

assets/less/page.less

@@ -323,6 +323,30 @@ span + .entry-title {
 		text-transform: uppercase;
 	}
 }
+// Tag index
+.tag-box {
+	list-style: none;
+	margin: 0;
+	padding: 4px 0;
+	overflow: hidden;
+	.clearfix();
+	&.inline li {
+		float: left;
+		.font-rem(14);
+		line-height: 2.5;
+	}
+	a { 
+		padding: 4px 6px;
+		margin: 2px;
+		background-color: lighten(@black, 90);
+		.rounded(4px);
+		text-decoration: none;
+		span { 
+			vertical-align: super;
+			.font-rem(10);
+		}
+	}
+}
 
 // Footer
 // --------------------------------------------------

tags.html

@@ -4,6 +4,20 @@
 description: "An archive of posts sorted by tag."
 ---
 
+<ul class="tag-box inline">
+{% assign tags_list = site.tags %}  
+  {% if tags_list.first[0] == null %}
+    {% for tag in tags_list %} 
+    	<li><a href="#{{ tag }}">{{ tag }} <span>{{ site.tags[tag].size }}</span></a></li>
+    {% endfor %}
+  {% else %}
+    {% for tag in tags_list %} 
+    	<li><a href="#{{ tag[0] }}">{{ tag[0] }} <span>{{ tag[1].size }}</span></a></li>
+    {% endfor %}
+  {% endif %}
+{% assign tags_list = nil %}
+</ul>
+
 {% for tag in site.tags %} 
 	<h2 id="{{ tag[0] }}">{{ tag[0] }}</h2>
 	<ul class="post-list">