Mercurial > libervia-templates
changeset 117:5992b774a6a4
chat/message, input/avatar: moved avatar template in a dedicated macro.
author | Goffi <goffi@goffi.org> |
---|---|
date | Tue, 30 Jan 2018 07:47:26 +0100 |
parents | da8f1ba9034d |
children | c744170fd597 |
files | default/chat/message.html default/components/avatar.html default/forum/view.html default/static/forum.css |
diffstat | 4 files changed, 124 insertions(+), 5 deletions(-) [+] |
line wrap: on
line diff
--- a/default/chat/message.html Tue Jan 30 07:47:23 2018 +0100 +++ b/default/chat/message.html Tue Jan 30 07:47:26 2018 +0100 @@ -1,11 +1,9 @@ +{% import 'components/avatar.html' as avatar with context %} + <p id="{{msg.id}}" class="msg_{{msg.type}} {{'own_msg' if msg.from_ == own_jid.full()}}"> {%- if msg.type != C.MESS_TYPE_INFO %} {%- set author = identities[msg.from_].nick | default(msg.from_) -%} - {%- if identities[msg.from_].avatar_basename is defined %} - <img class="avatar" src="{{cache_path}}{{identities[msg.from_].avatar_basename}}"> - {% else %} - <span class="avatar generated">{{author|first|upper}}</span> - {%- endif -%} + {{ avatar.avatar(msg.from_) }} <span class="msg_header"> <span class="author">{{author}}</span> <span class="date">{{msg.timestamp|date_fmt('auto_day')}}</span>
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/default/components/avatar.html Tue Jan 30 07:47:26 2018 +0100 @@ -0,0 +1,9 @@ +{% macro avatar(jid) %} + {%- if identities is defined -%} + {%- if identities[jid].avatar_basename is defined %} + <img class="avatar" src="{{cache_path}}{{identities[jid].avatar_basename}}"> + {% else %} + <span class="avatar generated">{{author|first|upper}}</span> + {%- endif -%} + {%- endif -%} +{% endmacro %}
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/default/forum/view.html Tue Jan 30 07:47:26 2018 +0100 @@ -0,0 +1,34 @@ +{% if not embedded %}{% extends 'base/base.html' %}{% endif %} +{% set dates_format='relative' if single else 'short' %} +{% import 'blog/macros.html' as blog with context %} +{% import 'input/textbox.html' as textbox with context %} + +{% block body %} + +<div id="blog_items"> + {{ blog.show_items(items, expanded=true) }} +</div> +<div class="forum_topic_answer"> + {{- textbox.comment_or_login(service=service, node=node, placeholder=_("Enter your message here")) -}} +</div> +<nav class="prev_next_links"> + <ul> + {% if newer_url is defined %} + <li class="newer_items"> + <a href="{{newer_url}}"> + <img src="{{media_path}}icons/tango/actions/32/go-previous.png"> + {% trans %}newer messages{% endtrans %} + </a> + </li> + {% endif %} + {% if older_url is defined %} + <li class="older_items"> + <a href="{{older_url}}"> + <img src="{{media_path}}icons/tango/actions/32/go-next.png"> + {% trans %}older messages{% endtrans %} + </a> + </li> + {% endif %} + </ul> +</nav> +{% endblock body %}
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/default/static/forum.css Tue Jan 30 07:47:26 2018 +0100 @@ -0,0 +1,78 @@ +@import 'blog.css'; /* needed as blog/articles.html is included */ + +#forums { + margin: 2em auto 0 auto; + width: 90%; +} + +ul.forum { + box-sizing: border-box; + list-style: none; + display: flex; + margin: 0 auto; +} + +ul.forum>li { + width: 100%; +} + +ul.forum>li>a { + border: 0.7rem solid #ddd; + border-radius: 0.5em; + display: block; + padding: 1rem; + margin-bottom: 1rem; + text-decoration: none; + color: inherit; +} + +a.forum_actif:hover { + background-color: #43d2f6; +} + +p.forum_short-desc { + color: #666; + margin: 0; + font-size: 0.8em; +} + +#forum_topics { + margin-top: 3em; +} + +#forum_topics>div { + box-sizing: border-box; + width: 80%; + margin: 0.5em auto; + padding: 0.2em 2em; + background: #eee; + +} + +#forum_topics>:hover { + background-color: #43d2f6; +} + +#forum_topics img.avatar { + width: 1.5rem; + vertical-align: middle; + padding-right: 1em; +} + +#forum_topics a { + display: block; + text-decoration: none; + color: inherit; +} + +.textbox input { + width: 100%; + box-sizing: border-box; +} + +@media (min-width: 500px) { + .textbox input { + min-width: 26em; + width: auto; + } +}