Make posts wider in the era of 4K and nicer tag links

Upgrading theme was not straight forward adding `remote_theme` in
config so we do one more manual css change to make posts wider on
larger screens. Still not to wide to read, I hope.

Cleaup tag links to not include ugly `.html`

_layouts/post.html

@@ -17,7 +17,7 @@
     {% if page.image.feature %}<img src="{{ site.url }}/images/{{ page.image.feature }}" class="entry-feature-image" alt="{{ page.title }}">{% endif %}
     <div class="entry-wrapper">
       <header class="entry-header">
-        <span class="entry-tags">{% for tag in page.tags %}<a href="{{ site.url }}/tags.html#{{ tag | cgi_encode }}" title="Pages tagged {{ tag }}" rel="tag">{{ tag }}</a>{% unless forloop.last %} &bull; {% endunless %}{% endfor %}</span>
+        <span class="entry-tags">{% for tag in page.tags %}<a href="{{ site.url }}/tags#{{ tag | cgi_encode }}" title="Pages tagged {{ tag }}" rel="tag">{{ tag }}</a>{% unless forloop.last %} &bull; {% endunless %}{% endfor %}</span>
         <h1 class="entry-title" itemprop="headline">{% if page.headline %}{{ page.headline }}{% else %}{{ page.title }}{% endif %}</h1>
       </header>
       <footer class="entry-meta">

assets/css/main.css

@@ -588,15 +588,15 @@ body{margin:0;padding:0;width:100%;background-color:#ffffff;border-top:5px solid
 .entry-tags{display:block;margin-top:2em;text-transform:uppercase;font-size:16px;font-size:1rem;font-weight:600;}.entry-tags a{color:#333333;}
 span+.entry-title{margin-top:0;}
 .entry-title{font-family:'volkorn',serif;font-style:italic;font-size:36px;font-size:2.25rem;font-weight:700;line-height:1;letter-spacing:-3px;}.entry-title a{color:#000000;}
-@media only screen and (min-width: 48em){.entry-title{max-width:600px;font-size:52px;font-size:3.25rem;}}@media only screen and (min-width: 62.5em){.entry-title{max-width:800px;font-size:68px;font-size:4.25rem;}}
+@media only screen and (min-width: 48em){.entry-title{max-width:600px;font-size:52px;font-size:3.25rem;}}@media only screen and (min-width: 62.5em){.entry-title{max-width:1400px;font-size:68px;font-size:4.25rem;}}
 .entry-wrapper{margin:0 auto 3em;max-width:440px;padding-right:20px;padding-left:20px;*zoom:1;}.entry-wrapper:before,.entry-wrapper:after{display:table;content:"";line-height:0;}
 .entry-wrapper:after{clear:both;}
-@media only screen and (min-width: 48em){.entry-wrapper{max-width:760px;padding-right:60px;padding-left:60px;}}@media only screen and (min-width: 62.5em){.entry-wrapper{max-width:960px;}}
+@media only screen and (min-width: 48em){.entry-wrapper{max-width:1024px;padding-right:60px;padding-left:60px;}}@media only screen and (min-width: 80.5em){.entry-wrapper{max-width:1280px;}}
 .entry-meta{max-width:640px;width:100%;margin-right:auto;margin-bottom:30px;margin-left:auto;display:block;text-transform:uppercase;font-size:14px;font-size:0.875rem;}.entry-meta a{color:#333333;}
 @media only screen and (min-width: 62.5em){.entry-meta{float:left;width:140px;margin:0 40px 40px 0;padding:0;}}.entry-meta>span{padding:0 20px 10px 0;display:inline-block;}@media only screen and (min-width: 62.5em){.entry-meta>span{display:block;padding:8px 0;border-bottom:1px solid #cccccc;border-bottom:1px solid rgba(0, 0, 0, 0.1);}}
 .author-photo{display:none;}@media only screen and (min-width: 62.5em){.author-photo{display:block;width:150px;height:150px;margin-bottom:10px;-webkit-border-radius:150px;-moz-border-radius:150px;border-radius:150px;*zoom:1;}.author-photo:before,.author-photo:after{display:table;content:"";line-height:0;} .author-photo:after{clear:both;}}
 .entry-content{max-width:640px;width:100%;margin-right:auto;margin-left:auto;}.entry-content p:first-child{margin-top:0;}
-@media only screen and (min-width: 62.5em){.entry-content{float:left;}}.entry-content p>a,.entry-content li>a{border-bottom:1px dotted #b3b3b3;}.entry-content p>a:hover,.entry-content li>a:hover{border-bottom-style:solid;}
+@media only screen and (min-width: 80.5em){.entry-content{float:left; max-width: 960px}}.entry-content p>a,.entry-content li>a{border-bottom:1px dotted #b3b3b3;}.entry-content p>a:hover,.entry-content li>a:hover{border-bottom-style:solid;}
 .post-list li>a{border-bottom-width:0;}
 #disqus_thread{margin-top:2em;}
 .pagination{text-align:center;}

assets/less/page.less

@@ -225,12 +225,12 @@ span + .entry-title {
 	padding-left: 20px;
 	.clearfix();
 	@media @medium {
-		max-width: 760px;
+		max-width: 1024px;
 		padding-right: 60px;
 		padding-left: 60px;
 	}
 	@media @large {
-		max-width: 960px;
+		max-width: 1280px;
 	}
 }
 .entry-meta {
@@ -280,7 +280,8 @@ span + .entry-title {
 		margin-top: 0;
 	}
 	@media @large {
-		float: left;
+	    float: left;
+	    max-width: 1024px;
 	}
 	p > a,
 	li > a {
@@ -428,4 +429,4 @@ span + .entry-title {
 		background-color: @white;
 		color: @black;
 	}
-}
+}

tags.html

@@ -1,6 +1,7 @@
 ---
 layout: page
-title: Tag Index
+title: Posts grouped by tag
+permalink: /tags/index.html
 description: "An archive of posts sorted by tag."
 ---
 
@@ -32,4 +33,4 @@ <h2 id="{{ tag[0] }}">{{ tag[0] }}</h2>
 		{% assign pages_list = nil %}
 		{% assign group = nil %}
 	</ul>
-{% endfor %}
+{% endfor %}