improvement and restoration of the message view - refs #2681
parent
e5cf341244
commit
5a7045a05c
@ -0,0 +1,87 @@ |
|||||||
|
.email-head { |
||||||
|
background-color: #fff; |
||||||
|
.email-head-subject { |
||||||
|
padding: 25px 25px; |
||||||
|
border-bottom: 1px solid #e6e6f2; |
||||||
|
.icons{ |
||||||
|
font-size: 14px; |
||||||
|
float: right; |
||||||
|
.icon{ |
||||||
|
color: #71738d; |
||||||
|
vertical-align: middle; |
||||||
|
} |
||||||
|
} |
||||||
|
.title { |
||||||
|
display: block; |
||||||
|
font-size: 1.769rem; |
||||||
|
font-weight: 500; |
||||||
|
color: #3d405c; |
||||||
|
a{ |
||||||
|
.icon{ |
||||||
|
color: silver; |
||||||
|
font-size: 14px; |
||||||
|
margin-right: 6px; |
||||||
|
vertical-align: middle; |
||||||
|
line-height: 31px; |
||||||
|
position: relative; |
||||||
|
top: -1px; |
||||||
|
} |
||||||
|
&.active{ |
||||||
|
.icon{ |
||||||
|
color: #ffc600; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.email-head-sender { |
||||||
|
padding: 13px 25px; |
||||||
|
line-height: 40px; |
||||||
|
.date { |
||||||
|
float: right; |
||||||
|
font-size: 12px; |
||||||
|
} |
||||||
|
.avatar{ |
||||||
|
float: left; |
||||||
|
margin-right: 10px; |
||||||
|
width: 2.25rem; |
||||||
|
height: 2.25rem; |
||||||
|
border-radius: 50%; |
||||||
|
border: 2px solid #e6e6f2; |
||||||
|
background: #F7F9FA; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
.sender{ |
||||||
|
font-size: 1.15rem; |
||||||
|
.email{ |
||||||
|
font-size: 12px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.email-body{ |
||||||
|
background-color: #fff; |
||||||
|
border-top: 1px solid #e6e6f2; |
||||||
|
padding: 30px 28px; |
||||||
|
} |
||||||
|
.email-attachments{ |
||||||
|
background-color: #fff; |
||||||
|
padding: 25px 28px; |
||||||
|
border-top: 1px solid #e6e6f2; |
||||||
|
.title{ |
||||||
|
display: block; |
||||||
|
font-weight: 500; |
||||||
|
} |
||||||
|
ul{ |
||||||
|
list-style: none; |
||||||
|
margin: 15px 0 0; |
||||||
|
padding: 0; |
||||||
|
li{ |
||||||
|
line-height: 23px; |
||||||
|
a{ |
||||||
|
color: #404040; |
||||||
|
font-weight: 500; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,62 @@ |
|||||||
|
{% extends '@ChamiloTheme/Layout/layout_one_col.html.twig' %} |
||||||
|
{% block content %} |
||||||
|
|
||||||
|
{% autoescape false %} |
||||||
|
<div id="message_{{ message.id }}" data-status="{{ message.status }}" class="mail-email"> |
||||||
|
<div class="email-head"> |
||||||
|
<div class="email-head-subject"> |
||||||
|
<div class="title"> |
||||||
|
<a class="active" href="#"> |
||||||
|
<span class="icon"> |
||||||
|
<i class="fas fa-star"></i> |
||||||
|
</span> |
||||||
|
</a> |
||||||
|
<span> |
||||||
|
{{ message.title }} |
||||||
|
</span> |
||||||
|
<div class="icons"> |
||||||
|
<div class="btn-group" role="group" > |
||||||
|
<a href="{{ message.url.back }}" class="btn btn-outline-secondary icon"><i class="fas fa-arrow-circle-left"></i> {{ 'Back'|trans }}</a> |
||||||
|
<a href="#" onclick="window.print();" class="btn btn-outline-secondary icon"><i class="fas fa-print"></i> {{ 'Print'|trans }}</a> |
||||||
|
<a href="{{ message.url.new_message }}" class="btn btn-outline-secondary icon"><i class="fas fa-reply"></i> {{ 'Reply'|trans }}</a> |
||||||
|
<a href="{{ message.url.delete }}" class="btn btn-outline-secondary icon"><i class="fas fa-trash"></i> {{ 'Delete'|trans }}</a> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="email-head-sender"> |
||||||
|
<div class="date">{{ message.date }}</div> |
||||||
|
<div class="avatar"> |
||||||
|
<img src="{{ message.form_user.avatar }}" alt="Avatar" class="rounded-circle user-avatar-md"> |
||||||
|
</div> |
||||||
|
<div class="sender"> |
||||||
|
<a href="{{ _p.web }}main/social/profile.php?u={{ message.form_user.id }}">{{ message.form_user.name }}</a> |
||||||
|
<div class="email">{{ message.form_user.email }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="email-body"> |
||||||
|
{{ message.content }} |
||||||
|
</div> |
||||||
|
|
||||||
|
{% if message.attachments %} |
||||||
|
<div class="email-attachments"> |
||||||
|
<div class="title">{{ 'Attachments'|trans }} <span>({{ message.attachments.quantity }} {{ 'Files'|trans }}, {{ message.attachments.total_size }})</span></div> |
||||||
|
<ul> |
||||||
|
{% for item in message.attachments.files %} |
||||||
|
<li> |
||||||
|
<a href="{{ item.url }}"> |
||||||
|
<i class="fas fa-paperclip"></i> {{ item.filename }} |
||||||
|
<span>({{ item.size }})</span> |
||||||
|
</a> |
||||||
|
</li> |
||||||
|
{% endfor %} |
||||||
|
</ul> |
||||||
|
</div> |
||||||
|
{% endif %} |
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
{% endautoescape %} |
||||||
|
{% endblock %} |
Loading…
Reference in new issue