typographic details in the overview

themes/default/static/css/main.css

@@ -58,11 +58,11 @@ section#content{
 article{
 	margin: 0 0 2em;
 }
-	article:first-of-type{
+	article:first-child{
 		background-color: beige;
 		padding:2em 3em;
 	}
-	article:first-of-type:before{
+	article:first-child:before{
 		content: "Start of Section";
 		display: block;
 		margin:0 auto;
@@ -73,11 +73,14 @@ article{
 /* big pink boxes for the section titles */
 h1.category{
 	width: calc(100% - 4em);
-	background-color: beige;
-	padding: 2em;
+	background-color: #ec25ec;
+	color:white;
+	border-radius: 1em;
+	padding: 2em 2em 2.5em 2em;
 	margin: 2em 0;
 	font-size: 32px;
 	text-align: center;
+	font-weight: normal;
 }
 
 ul.navprevnext{

themes/default/templates/categories.html

@@ -9,16 +9,20 @@
 
 	{% for category, articles in categories | sort(attribute="slug") %}
 		<a class="nounderline" href="{{ SITEURL }}/{{ category.url }}" title="Permalink to {{ category|striptags }}">
-			<h1 class="category">{{ category }}</h1>
+			{% set c = category|replace("-","</em><br><br>") %}
+			{% set c = '<em>'+c %}
+			<h1 class="category">{{ c }}</h1>
 		</a>
-		{% for article in articles %}
-			<article class="hentry">
-				<header>
-					<h2 class="entry-title"><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="Permalink to {{ article.title|striptags }}">{{ article.title }}</a></h2>
-				</header>
-				<div class="entry-content"> {{ article.summary }} </div>
-				<footer class="post-info"></footer>
-			</article>
-		{% endfor %}
+		<section>
+			{% for article in articles | reverse %}
+				<article class="hentry">
+					<header>
+						<h2 class="entry-title"><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="Permalink to {{ article.title|striptags }}">{{ article.title }}</a></h2>
+					</header>
+					<div class="entry-content"> {{ article.summary }} </div>
+					<footer class="post-info"></footer>
+				</article>
+			{% endfor %}
+		</section>
 	{% endfor %}
 {% endblock %}

themes/default/templates/index.html

@@ -3,6 +3,7 @@
 {% block content_title %}
 {% endblock %}
 
+<section>
 {% for article in articles_page.object_list|sort(attribute="slug")%}
 	<article class="hentry">
 		<header>
@@ -12,4 +13,5 @@
 		<footer class="post-info"></footer>
 	</article></li>
 {% endfor %}
+</section>
 {% endblock content %}