Mercurial > libervia-templates
comparison default/blog/item.html @ 44:580670430fa2
blog/item: expand/reduce improvments:
- only expand_box is now clickable, not the whole article anymore, avoiding unwanted click
- when in .clicked state, message is "Click to reduce" instead of "expand"
- in .clicked state, expand_box is only visible on :hover
- in .clicked state, and expand_box is available at top and bottom
author | Goffi <goffi@goffi.org> |
---|---|
date | Thu, 13 Jul 2017 19:23:02 +0200 |
parents | 0c6aa1c81252 |
children | f19e9f5e43b0 |
comparison
equal
deleted
inserted
replaced
43:f8798d691acf | 44:580670430fa2 |
---|---|
3 {% if item.language and locale and locale.language != item.language %} | 3 {% if item.language and locale and locale.language != item.language %} |
4 {# we may display items in different language in a specific way #} | 4 {# we may display items in different language in a specific way #} |
5 {% set other_lang = " other_lang" %} | 5 {% set other_lang = " other_lang" %} |
6 {% endif %} | 6 {% endif %} |
7 | 7 |
8 <article id="{{ item.id }}" class="init box{{other_lang}}" onclick="clicked_mh_fix(this)"> | 8 <article id="{{item.id}}" class="init box{{other_lang}}"> |
9 | |
10 {# following message is displayed if item lang is different from page locale #} | |
9 {% if other_lang is defined %} | 11 {% if other_lang is defined %} |
10 <div class="info"><p>{% trans language=locale.language_name %}This message is not in {{language}}, click to display anyway{% endtrans %}</p></div> | 12 <div class="info"><p>{% trans language=locale.language_name %}This message is not in {{language}}, click to display anyway{% endtrans %}</p></div> |
11 {% endif %} | 13 {% endif %} |
14 | |
15 {# we put a reduce button at the top #} | |
16 <div class="expand_box box_top" onclick="clicked_mh_fix('{{item.id}}')"> | |
17 <p> | |
18 <span class='hide'>{% trans %}Click to reduce…{% endtrans %}</span> | |
19 </p> | |
20 </div> | |
12 | 21 |
13 <header> | 22 <header> |
14 {% block header %} | 23 {% block header %} |
15 <div class="title">{% block blog_title %}{{ item.title_xhtml or item.title or '' }}{% endblock %}</div> | 24 <div class="title">{% block blog_title %}{{ item.title_xhtml or item.title or '' }}{% endblock %}</div> |
16 {% block metadata %} | 25 {% block metadata %} |
27 {% block content %} | 36 {% block content %} |
28 {{ item.content_xhtml or item.content or ''}} | 37 {{ item.content_xhtml or item.content or ''}} |
29 {% endblock content %} | 38 {% endblock content %} |
30 </div> | 39 </div> |
31 | 40 |
32 <div class="expand_box"> | 41 {# and the bottom button to expand/reduce the article #} |
42 <div class="expand_box box_bottom" onclick="clicked_mh_fix('{{item.id}}')"> | |
33 <p> | 43 <p> |
34 {% trans %}Click to to expand…{% endtrans %} | 44 <span class='show'>{% trans %}Click to expand…{% endtrans %}</span> |
45 <span class='hide'>{% trans %}Click to reduce…{% endtrans %}</span> | |
35 </p> | 46 </p> |
36 </div> | 47 </div> |
37 | 48 |
38 </article> | 49 </article> |
39 | 50 |