diff default/blog/item.html @ 16:8cdcbe0d7dee

blog: various appareance improvments: - use new .box classe - article as a maxium size and is expandable on click - display comments in a different way - author and date are now visible - responsive design - placeholders on comment input - transitions - various other improvments
author Goffi <goffi@goffi.org>
date Thu, 04 May 2017 01:00:23 +0200
parents 9a31d2c02f47
children 8fa2fd2e928e
line wrap: on
line diff
--- a/default/blog/item.html	Thu May 04 00:55:06 2017 +0200
+++ b/default/blog/item.html	Thu May 04 01:00:23 2017 +0200
@@ -1,8 +1,17 @@
+{% import 'script/css.js' as css %}
+
 {% block item %}
-<article>
+<article id="{{ item.id }}" class="box" onclick="this.classList.toggle('clicked')">
     <header>
         {% block header %}
         <div class="title">{% block blog_title %}{{ item.title_xhtml or item.title or '' }}{% endblock %}</div>
+            {% block metadata %}
+            <div class="metadata">
+            <span class="author">{{item.author}}</span>
+            <span class="blog_data">{{item.published | blog_date}}</span>
+            </div>
+
+            {% endblock metadata %}
         {% endblock header %}
     </header>
 
@@ -11,5 +20,11 @@
         {{ item.content_xhtml or item.content or ''}}
         {% endblock content %}
     </div>
+
+    <div class="expand_box">
+        <p>
+            Click to to expand…
+        </p>
+    </div>
 </article>
 {% endblock item %}