Mercurial > libervia-templates
view 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 |
line wrap: on
line source
{% block item %} {% if item.language and locale and locale.language != item.language %} {# we may display items in different language in a specific way #} {% set other_lang = " other_lang" %} {% endif %} <article id="{{item.id}}" class="init box{{other_lang}}"> {# following message is displayed if item lang is different from page locale #} {% if other_lang is defined %} <div class="info"><p>{% trans language=locale.language_name %}This message is not in {{language}}, click to display anyway{% endtrans %}</p></div> {% endif %} {# we put a reduce button at the top #} <div class="expand_box box_top" onclick="clicked_mh_fix('{{item.id}}')"> <p> <span class='hide'>{% trans %}Click to reduce…{% endtrans %}</span> </p> </div> <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">{{identities[item.author_jid].nick | default(item.author)}}</span> <span class="blog_data">{% trans days=item.published|date_days %}{{days}} days ago{% endtrans %}</span> </div> {% endblock metadata %} {% endblock header %} </header> <div class="content{{' text' if not item.content_xhtml}}"> {% block content %} {{ item.content_xhtml or item.content or ''}} {% endblock content %} </div> {# and the bottom button to expand/reduce the article #} <div class="expand_box box_bottom" onclick="clicked_mh_fix('{{item.id}}')"> <p> <span class='show'>{% trans %}Click to expand…{% endtrans %}</span> <span class='hide'>{% trans %}Click to reduce…{% endtrans %}</span> </p> </div> </article> {% endblock item %}