Mercurial > libervia-templates
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 %} |