Update style of tags in tag list

zhaohaifeng · Dec 24, 2014 · 39fb94c · 39fb94c
1 parent b5f65ab
commit 39fb94c
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 9 deletions.
diff --git a/_sass/_page.scss b/_sass/_page.scss
@@ -172,22 +172,24 @@ body {
 	.tag {
 		display: inline-block;
 		margin: 4px;
-		padding: 2px 6px;
-		background-color: lighten($base-color,60);
 		color: $white;
 		@include rounded(3px);
 		color: $white;
 		span {
-			vertical-align: super;
-			@include font-rem(10);
+			float: left;
+			padding: 2px 6px;
+		}
+		.term {
+			background-color: lighten($base-color,60);
+			@include border-radius(0,0,3px,3px);
+		}
+		.count {
+			background-color: lighten($base-color,40);
+			@include border-radius(3px,3px,0,0);
 		}
 		&:hover {
 			background-color: lighten($base-color,50);
 		}
-		&:active {
-			@include translate(0, 1px);
-	        @include box-shadow(0 0 1px rgba($base-color,0.2));
-		}
 	}
 	.entry-reading-time {
 		float: right;

diff --git a/tags/index.html b/tags/index.html
@@ -11,7 +11,7 @@
 <ul class="entry-meta inline-list">
   {% for item in (0..site.tags.size) %}{% unless forloop.last %}
     {% capture this_word %}{{ tags_list[item] | strip_newlines }}{% endcapture %}
-  	<li><a href="#{{ this_word }}" class="tag">{{ this_word }} <span>{{ site.tags[this_word].size }}</span></a></li>
+  	<li><a href="#{{ this_word }}" class="tag"><span class="term">{{ this_word }}</span> <span class="count">{{ site.tags[this_word].size }}</span></a></li>
   {% endunless %}{% endfor %}
 </ul>