comparison 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
comparison
equal deleted inserted replaced
15:c319291943be 16:8cdcbe0d7dee
1 {% import 'script/css.js' as css %}
2
1 {% block item %} 3 {% block item %}
2 <article> 4 <article id="{{ item.id }}" class="box" onclick="this.classList.toggle('clicked')">
3 <header> 5 <header>
4 {% block header %} 6 {% block header %}
5 <div class="title">{% block blog_title %}{{ item.title_xhtml or item.title or '' }}{% endblock %}</div> 7 <div class="title">{% block blog_title %}{{ item.title_xhtml or item.title or '' }}{% endblock %}</div>
8 {% block metadata %}
9 <div class="metadata">
10 <span class="author">{{item.author}}</span>
11 <span class="blog_data">{{item.published | blog_date}}</span>
12 </div>
13
14 {% endblock metadata %}
6 {% endblock header %} 15 {% endblock header %}
7 </header> 16 </header>
8 17
9 <div class="content"> 18 <div class="content">
10 {% block content %} 19 {% block content %}
11 {{ item.content_xhtml or item.content or ''}} 20 {{ item.content_xhtml or item.content or ''}}
12 {% endblock content %} 21 {% endblock content %}
13 </div> 22 </div>
23
24 <div class="expand_box">
25 <p>
26 Click to to expand…
27 </p>
28 </div>
14 </article> 29 </article>
15 {% endblock item %} 30 {% endblock item %}