From c0f62e958c5be315faf3c62c8bb1a2480025f52b Mon Sep 17 00:00:00 2001
From: Adrian Kummerlaender
Date: Sun, 22 Mar 2015 17:13:48 +0100
Subject: Revamped layout to be more minimalistic and readable * removed
 background image and as such it's fixed pixel width ** i.e. the layout is now
 completely dependent on the basic font size and scales accordingly * revamped
 master template and CSS to allow for nodes with varying lengths instead of
 truncating everything depending on the background width * increased font size
 of tag and archive pages * increased overall line height to improve
 readability * improved CSS to e.g. make use of `last-child` instead of adding
 `last` classes during static site generation * removed _microblog_ entries
 from archive as I have more or less stopped using _Twitter_

---
 source/99_result/archive.xsl           |  38 ++-----------
 source/99_result/article/article.xsl   |   4 +-
 source/99_result/category/category.xsl |  27 ++++-----
 source/99_result/main.css              |  98 +++++++++++++++------------------
 source/99_result/media/bottom.png      | Bin 1527 -> 0 bytes
 source/99_result/media/single.png      | Bin 263 -> 0 bytes
 source/99_result/media/top.png         | Bin 1481 -> 0 bytes
 source/99_result/page/page.xsl         |   2 +-
 source/99_result/stream.xsl            |  68 +++++++++++------------
 source/99_result/tag/tag.xsl           |  10 ++--
 10 files changed, 105 insertions(+), 142 deletions(-)
 delete mode 100644 source/99_result/media/bottom.png
 delete mode 100644 source/99_result/media/single.png
 delete mode 100644 source/99_result/media/top.png

(limited to 'source/99_result')

diff --git a/source/99_result/archive.xsl b/source/99_result/archive.xsl
index e00d892..2df82ab 100644
--- a/source/99_result/archive.xsl
+++ b/source/99_result/archive.xsl
@@ -10,36 +10,19 @@
 <xsl:variable name="meta">
 	<datasource type="main"    mode="full" source="02_meta/articles.xml"     target="articles"/>
 	<datasource type="support" mode="full" source="02_meta/meta.xml"         target="meta"/>
-	<datasource type="support" mode="full" source="00_content/microblog.xml" target="microblog"/>
 	<target     mode="plain"   value="archive/index.html"/>
 </xsl:variable>
 
 <xsl:template name="title-text">Archive</xsl:template>
 
-<xsl:template match="datasource">
-	<div class="archiv columns">
-		<xsl:apply-templates />
-	</div>
-</xsl:template>
-
 <xsl:template match="articles">
-	<div class="column">
-		<xsl:text>Past articles:</xsl:text>
-
-		<ol class="topline articlelist archivlist">
-			<xsl:apply-templates select="entry"/>
-		</ol>
-	</div>
-</xsl:template>
-
-<xsl:template match="microblog">
-	<div class="column">
-		<a href="https://twitter.com/KnairdA">Microblog:</a>
+	<h3>
+		<xsl:text>Past articles</xsl:text>
+	</h3>
 
-		<ul class="prettylist sparselist topline">
-			<xsl:apply-templates select="item[substring(text, 1, 1) != '@'][position() &lt;= 9]" />
-		</ul>
-	</div>
+	<ol class="articlelist archivlist">
+		<xsl:apply-templates select="entry"/>
+	</ol>
 </xsl:template>
 
 <xsl:template match="articles/entry">
@@ -57,13 +40,4 @@
 	</li>
 </xsl:template>
 
-<xsl:template match="microblog/item">
-	<li>
-		<em>»</em>
-		<a href="{link}">
-			<xsl:value-of select="text" disable-output-escaping="yes" />
-		</a>
-	</li>
-</xsl:template>
-
 </xsl:stylesheet>
diff --git a/source/99_result/article/article.xsl b/source/99_result/article/article.xsl
index d34df77..70c22a7 100644
--- a/source/99_result/article/article.xsl
+++ b/source/99_result/article/article.xsl
@@ -48,7 +48,9 @@
 		<xsl:apply-templates select="content/node()" mode="xhtml"/>
 	</div>
 
-	<div id="isso-thread"></div>
+	<div id="isso-thread">
+		<xsl:text> </xsl:text>
+	</div>
 
 	<script type="text/javascript" src="/comments/js/embed.min.js" data-isso-avatar="false" data-isso-vote="false" data-isso-css="false">
 		<xsl:text> </xsl:text>
diff --git a/source/99_result/category/category.xsl b/source/99_result/category/category.xsl
index e0532aa..adbf98b 100644
--- a/source/99_result/category/category.xsl
+++ b/source/99_result/category/category.xsl
@@ -20,25 +20,14 @@
 	<xsl:value-of select="/datasource/category/entry/@handle"/>
 </xsl:template>
 
-<xsl:template match="entry/page">
-	<li>
-		<em>»</em>
-		<a href="/page/{@handle}">
-			<strong><xsl:value-of select="title"/></strong>
-			<p>
-				<xsl:apply-templates select="digest/node()" mode="xhtml"/>
-			</p>
-		</a>
-	</li>
-</xsl:template>
-
 <xsl:template match="category/entry">
 	<h3>
 		<xsl:text>All pages categorized as &#187;</xsl:text>
 		<xsl:value-of select="@handle"/>
 		<xsl:text>&#171;</xsl:text>
 	</h3>
-	<div class="archiv columns">
+
+	<div class="columns">
 		<ul class="prettylist">
 			<xsl:apply-templates select="page">
 				<xsl:sort select="digest/@size" data-type="number" order="descending"/>
@@ -47,4 +36,16 @@
 	</div>
 </xsl:template>
 
+<xsl:template match="entry/page">
+	<li>
+		<em>»</em>
+		<a href="/page/{@handle}">
+			<strong><xsl:value-of select="title"/></strong>
+			<p>
+				<xsl:apply-templates select="digest/node()" mode="xhtml"/>
+			</p>
+		</a>
+	</li>
+</xsl:template>
+
 </xsl:stylesheet>
diff --git a/source/99_result/main.css b/source/99_result/main.css
index 239a260..9d5977f 100644
--- a/source/99_result/main.css
+++ b/source/99_result/main.css
@@ -1,40 +1,41 @@
-body{margin:0;padding:0;font:1em Droid Sans,sans-serif,Verdana,Arial,FreeSans;color:#272828;word-wrap:break-word}
-p{margin:0;line-height:1.5em}
+body{margin:0;padding:0;font:1em Droid Sans,sans-serif;color:#272828;word-wrap:break-word}
+a, a:visited{color:#272822}
+p{margin:0;line-height:1.75em}
 ul{margin:0;padding:0;list-style:none}
 blockquote{border-left:.4em solid #e3e8e8;margin-left:0;padding-left:1em}
 pre{padding:1em;border-radius:.75em;color:#f8f8f2;background:#272822;white-space:pre-wrap}
 code{margin:0 .1em;padding:0 .5em;border:.1em solid #e3e8e8;background-color:#f8f8f8;border-radius:.3em}
-#wrapper{width:870px;margin:2em auto;background:url(media/top.png) no-repeat top center,url(media/bottom.png) no-repeat bottom center,url(media/single.png) repeat top center}
-#content{width:720px;margin:0 auto;padding-top:70px;padding-bottom:70px}
-#navigation{overflow:hidden;border-bottom:.3em solid #e3e8e8;padding:.1em 0}
-#navigation h1{color:#F80;font-size:1.2em;font-weight:normal;float:left;padding:0 .2em 0 0;margin:0}
-#navigation ul{float:right}
-#main{overflow:hidden}
-#main .article{border-bottom:.3em dotted #e3e8e8;padding-bottom:.5em;margin-top:1em;text-align:justify}
-#main .last{border:none}
-#main p{margin-bottom:.7em;text-align:justify}
-#main h2{font-size:1.4em;margin:0;color:#F80}
-#main h2 a{font-size:.8em;text-decoration:none !important;color:#272828;font-weight:normal;display:inline-block;vertical-align:middle;max-width:95%}
-#main h2 a:hover{text-decoration:underline !important}
-#main h3, #main h4{font-size:1.05em;font-weight:normal;padding-bottom:.2em;margin-bottom:.5em;border-bottom:.1em solid #e3e8e8}
-#main .article a{text-decoration:underline;color:#272828}
-#main .article a:hover{color:black}
-#main .article ul{float:none;margin-left:2em;text-align:left}
-#main .article ul li{list-style-type:circle;float:none}
-#main .article ul li a{background:0}
-#main .article .info{font-size:.8em;margin-bottom:.5em;margin-left:1.5em}
-#main .article .info a{text-decoration:none;color:#272828}
-#main .article .info a:hover{text-decoration:underline}
-#main .article table{border-collapse:collapse;border-left:.4em solid #e3e8e8;margin:1em}
-#main .article table thead{border-bottom:.1em solid #272828}
-#main .article table tr{border-bottom:.1em solid #272828}
-#main .article table tr:last-child{border-bottom:0}
-#main .article table tr th{font-weight:normal;padding:.2em 1em}
-#main .article table tr td{padding:.2em 1em}
-#main .footnotes {border-top:.3em dotted #e3e8e8}
-#main img{padding:.2em;border:.1em solid #e3e8e8;display:block;margin-left:auto;margin-right:auto}
-#main img.full{max-width:100%}
-#main img.clear{border:0}
+.full{width:100%}
+.center{width:45em;margin:0 auto;overflow:hidden}
+.border_bottom{border-bottom:.3em solid #e3e8e8}
+.border_top{border-top:.3em solid #e3e8e8}
+#navigation{padding:2em 0 0 0}
+#navigation h1{color:#F80;font-size:1.4em;font-weight:normal;float:left;padding:0 .2em 0 0;margin:0}
+#navigation ul{float:right;font-size:1.1em}
+#content p{margin-bottom:.7em;text-align:justify}
+#content h2{font-size:1.4em;margin:0;color:#F80}
+#content h2 a, h2 span{font-size:.8em;text-decoration:none !important;color:#272828;font-weight:normal;display:inline-block;vertical-align:middle;max-width:95%}
+#content h2 a:hover{text-decoration:underline !important}
+#content h3, #content h4{font-size:1.05em;font-weight:normal;padding-bottom:.2em;margin-bottom:.5em;border-bottom:.1em solid #e3e8e8}
+#content .article{border-bottom:.3em dotted #e3e8e8;padding-bottom:.5em;margin-top:1em;text-align:justify}
+#content .article:last-child{border:none}
+#content .article a{text-decoration:underline;color:#272828}
+#content .article a:hover{color:black}
+#content .article ul{float:none;margin-left:2em;text-align:left}
+#content .article ul li{list-style-type:circle;float:none}
+#content .article ul li a{background:0}
+#content .article .info{font-size:.9em;margin-bottom:.5em;margin-left:1.4em}
+#content .article .info a{text-decoration:none;color:#272828}
+#content .article .info a:hover{text-decoration:underline}
+#content .article table{border-collapse:collapse;border-left:.4em solid #e3e8e8;margin:1em}
+#content .article table thead{border-bottom:.1em solid #272828}
+#content .article table tr{border-bottom:.1em solid #272828}
+#content .article table tr:last-child{border-bottom:0}
+#content .article table tr th{font-weight:normal;padding:.2em 1em}
+#content .article table tr td{padding:.2em 1em}
+#content .footnotes {border-top:.3em dotted #e3e8e8}
+#content img{padding:.2em;border:.1em solid #e3e8e8;display:block;margin-left:auto;margin-right:auto;max-width:100%}
+#content img.clear{border:0}
 #pagination{height:1.5em;margin-top:.5em}
 #pagination span.disabled{display:none}
 #pagination span a{text-decoration:none;color:#272828}
@@ -43,7 +44,7 @@ code{margin:0 .1em;padding:0 .5em;border:.1em solid #e3e8e8;background-color:#f8
 #pagination span a.pagination-next{float:right}
 #tags{overflow:hidden;border-top:.3em solid #e3e8e8;padding:.2em 0 0 0}
 #tags li:first-child {margin-left:0}
-#footer{border-top:.3em solid #e3e8e8;height:1.5em;padding-top:.3em}
+#footer{padding-top:.3em}
 #footer a{text-decoration:none;color:#272828}
 #footer a:hover{text-decoration:underline}
 #footer ul{float:right;padding:0}
@@ -68,11 +69,7 @@ code{margin:0 .1em;padding:0 .5em;border:.1em solid #e3e8e8;background-color:#f8
 #isso-root .isso-comment-footer .edit{display:none}
 #isso-root .isso-comment-footer .downvote{display:none}
 #isso-root .isso-comment-footer .upvote{display:none}
-.archiv{margin-top:1em}
-.topline{margin-top:.2em;border-top:.1em solid #e3e8e8}
 .columns{column-count:2;-moz-column-count:2;-webkit-column-count:2;column-gap:1em;-moz-column-gap:1em;-webkit-column-gap:1em}
-.columns a{color:#272828;text-decoration:none}
-.columns a:hover{text-decoration:underline}
 .column{-webkit-column-break-inside:avoid;break-inside:avoid-column;overflow:hidden}
 .buttonlist{overflow:hidden}
 .buttonlist li{float:left;background:#e3e8e8;border-radius:.3em;padding:.2em;margin:0 0 .2em .2em}
@@ -80,31 +77,26 @@ code{margin:0 .1em;padding:0 .5em;border:.1em solid #e3e8e8;background-color:#f8
 .buttonlist li a:hover{text-decoration:underline}
 .articlelist {padding:.3em;list-style:none}
 .articlelist li{background:#e3e8e8;border-radius:.3em;margin:.2em;padding:.2em}
-.articlelist li a{color:#272828;text-decoration:none}
+.articlelist li a{text-decoration:none}
 .articlelist li a:hover{text-decoration:underline}
-.archivlist li{background:0;padding-left:1em;font-size:.8em}
+.archivlist li{background:0;padding-left:1em}
 .archivlist li.dateitem{padding:0;font-weight:bold}
-.sparselist li{padding:.5em}
 .prettylist li{display:inline-block;padding:.5em 0}
-.prettylist li a{margin-left:.2em}
+.prettylist li a{margin-left:.2em;color:#272828;text-decoration:none}
+.prettylist li a:hover{text-decoration:underline}
 .prettylist li p{margin:0 !important}
 .prettylist li em{font-style:normal;font-size:1.4em;color:#F80}
 .commentlist ol{margin-top:.2em;border-top:.1em solid #e3e8e8}
 .commentlist ol li{background:0;font-size:.8em}
 .commentlist ol li.dateitem{padding:0;font-weight:bold}
-
-@media screen and (max-width:870px){
-	#wrapper{width:100%;margin:0;background:0}
-	#content{margin:.3em auto;padding:0}
-}
-@media screen and (max-width:725px){
-	#content{width:98%}
-	#main img{width:98%}
-	#main .article h2 a{max-width:90%}
+@media screen and (max-width:46em){
+	#content .article h2 a{max-width:90%}
+	#navigation{padding:.3em 0 0 0}
+	.center{width:98%}
 	.columns{column-count:1;-moz-column-count:1;-webkit-column-count:1}
-	.columns .column{width:100%}
+	.column{width:100%}
 }
-@media screen and (max-width:429px){
+@media screen and (max-width:30em){
 	#navigation h1{float:none}
 	#navigation ul{float:none}
 }
diff --git a/source/99_result/media/bottom.png b/source/99_result/media/bottom.png
deleted file mode 100644
index ff2afa7..0000000
Binary files a/source/99_result/media/bottom.png and /dev/null differ
diff --git a/source/99_result/media/single.png b/source/99_result/media/single.png
deleted file mode 100644
index 514d39a..0000000
Binary files a/source/99_result/media/single.png and /dev/null differ
diff --git a/source/99_result/media/top.png b/source/99_result/media/top.png
deleted file mode 100644
index ca71f84..0000000
Binary files a/source/99_result/media/top.png and /dev/null differ
diff --git a/source/99_result/page/page.xsl b/source/99_result/page/page.xsl
index 5e29cdb..672e7d8 100644
--- a/source/99_result/page/page.xsl
+++ b/source/99_result/page/page.xsl
@@ -19,7 +19,7 @@
 </xsl:template>
 
 <xsl:template match="page/entry">
-	<div class="last article">
+	<div class="article">
 		<h2>
 			<xsl:text>» </xsl:text>
 			<a href="/page/{@handle}">
diff --git a/source/99_result/stream.xsl b/source/99_result/stream.xsl
index d71b094..5469ff4 100644
--- a/source/99_result/stream.xsl
+++ b/source/99_result/stream.xsl
@@ -28,6 +28,37 @@
 	</xsl:choose>
 </xsl:template>
 
+<xsl:template match="page/entry">
+	<div>
+		<xsl:apply-templates select="article"/>
+	</div>
+
+	<div id="pagination">
+		<xsl:if test="@index > 0">
+			<span>
+				<a class="pagination-previous" href="/{@index - 1}">
+					<xsl:text>« newer</xsl:text>
+				</a>
+			</span>
+		</xsl:if>
+		<xsl:if test="@index &lt; @total - 1">
+			<span>
+				<a class="pagination-next" href="/{@index + 1}">
+					<xsl:text>older »</xsl:text>
+				</a>
+			</span>
+		</xsl:if>
+	</div>
+</xsl:template>
+
+<xsl:template match="entry/article">
+	<xsl:variable name="handle" select="@handle"/>
+
+	<div class="article">
+		<xsl:apply-templates select="$root/articles/entry[@handle = $handle]" mode="resolve"/>
+	</div>
+</xsl:template>
+
 <xsl:template match="articles/entry" mode="resolve">
 	<h2>
 		<xsl:text>» </xsl:text>
@@ -54,42 +85,5 @@
 	<xsl:apply-templates select="content/node()" mode="xhtml"/>
 </xsl:template>
 
-<xsl:template match="page/entry">
-	<xsl:apply-templates />
-
-	<div id="pagination">
-		<xsl:if test="@index > 0">
-			<span>
-				<a class="pagination-previous" href="/{@index - 1}">
-					<xsl:text>« newer</xsl:text>
-				</a>
-			</span>
-		</xsl:if>
-		<xsl:if test="@index &lt; @total - 1">
-			<span>
-				<a class="pagination-next" href="/{@index + 1}">
-					<xsl:text>older »</xsl:text>
-				</a>
-			</span>
-		</xsl:if>
-	</div>
-</xsl:template>
-
-<xsl:template match="page/entry/article">
-	<xsl:variable name="handle" select="@handle"/>
-
-	<xsl:choose>
-		<xsl:when test="position() = last()">
-			<div class="last article">
-				<xsl:apply-templates select="$root/articles/entry[@handle = $handle]" mode="resolve"/>
-			</div>
-		</xsl:when>
-		<xsl:otherwise>
-			<div class="article">
-				<xsl:apply-templates select="$root/articles/entry[@handle = $handle]" mode="resolve"/>
-			</div>
-		</xsl:otherwise>
-	</xsl:choose>
-</xsl:template>
 
 </xsl:stylesheet>
diff --git a/source/99_result/tag/tag.xsl b/source/99_result/tag/tag.xsl
index 39469f7..7162b64 100644
--- a/source/99_result/tag/tag.xsl
+++ b/source/99_result/tag/tag.xsl
@@ -18,15 +18,15 @@
 </xsl:template>
 
 <xsl:template match="tag/entry">
-	<div class="archiv">
+	<h3>
 		<xsl:text>All articles tagged as &#187;</xsl:text>
 		<xsl:value-of select="@handle"/>
 		<xsl:text>&#171;</xsl:text>
+	</h3>
 
-		<ol class="topline articlelist archivlist">
-			<xsl:apply-templates />
-		</ol>
-	</div>
+	<ol class="articlelist archivlist">
+		<xsl:apply-templates />
+	</ol>
 </xsl:template>
 
 <xsl:template match="tag/entry/article">
-- 
cgit v1.2.3