[IMP] mail: mail composer design
bzr revid: fva@openerp.com-20121023155827-au8m4bzz3hlfie3v
This commit is contained in:
Frédéric van der Essen
parent
f0b2ead07a
commit
5ca5acef41
|
|
@ -84,7 +84,6 @@ Main Features
|
|||
'css': [
|
||||
'static/src/css/mail.css',
|
||||
'static/src/css/mail_group.css',
|
||||
'static/src/css/mail_compose_message.css',
|
||||
],
|
||||
'js': [
|
||||
'static/lib/jquery.expander/jquery.expander.js',
|
||||
|
|
|
|||
|
|
@ -72,6 +72,11 @@
|
|||
padding: 4px;
|
||||
padding-bottom:1px;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg .oe_msg_content .oe_msg_title{
|
||||
font-size: 16px;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg .oe_msg_icons{
|
||||
float: right;
|
||||
margin-top: 4px;
|
||||
|
|
@ -123,6 +128,7 @@
|
|||
margin: 0px;
|
||||
padding: 0px;
|
||||
resize: vertical;
|
||||
padding: 4px;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg.oe_msg_composer_compact, .openerp .oe_mail .oe_msg.oe_msg_expandable{
|
||||
padding:4px;
|
||||
|
|
@ -139,6 +145,90 @@
|
|||
.openerp .oe_mail .oe_msg.oe_msg_read .oe_read{
|
||||
display:none;
|
||||
}
|
||||
/* ---------------- MESSAGE QUICK COMPOSER --------------- */
|
||||
|
||||
.openerp .oe_mail .oe_msg_composer .oe_msg_footer{
|
||||
padding-right:4px;
|
||||
padding-top: 2px;
|
||||
padding-bottom:6px;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_attachments.oe_hidden{
|
||||
margin:0px;
|
||||
border: none;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_attachments{
|
||||
margin-bottom: 4px;
|
||||
margin-right: 0px;
|
||||
font-size: 12px;
|
||||
border-radius: 2px;
|
||||
border: solid 1px rgba(124,123,173,0.14);
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_attachments .oe_attachment{
|
||||
padding: 2px;
|
||||
padding-left: 4px;
|
||||
padding-right: 4px;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_attachments .oe_attachment .oe_e{
|
||||
font-size: 23px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_attachments .oe_attachment .oe_e:hover{
|
||||
text-decoration: none;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_attachments .oe_attachment:nth-child(odd){
|
||||
background:white;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_attachments .oe_attachment:nth-child(even){
|
||||
background: #F4F5FA;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_footer button{
|
||||
display: inline;
|
||||
height: 24px;
|
||||
font-size: 12px;
|
||||
line-height: 12px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_footer button.oe_attach{
|
||||
width: 24px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_footer button.oe_attach .oe_e{
|
||||
position: relative;
|
||||
top: -1px;
|
||||
left: -9px;
|
||||
}
|
||||
.openerp .oe_mail .oe_hidden_input_file, .openerp .oe_mail .oe_hidden_input_file form{
|
||||
display:inline;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_footer button.oe_full{
|
||||
width:24px;
|
||||
overflow:hidden;
|
||||
float: right;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_footer button.oe_full .oe_e{
|
||||
position: relative;
|
||||
top: -1px;
|
||||
left: -9px;
|
||||
}
|
||||
.openerp .oe_mail button.oe_attach, .openerp .oe_mail button.oe_full{
|
||||
background: transparent;
|
||||
color: #7C7BAD;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
text-shadow: none;
|
||||
}
|
||||
.openerp .oe_mail .oe_msg_footer .oe_attachment_file .oe_form_binary_file{
|
||||
display: inline-block;
|
||||
margin-left: -23px;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
margin-top: -6px;
|
||||
}
|
||||
.openerp .oe_mail .oe_mail_list_recipients{
|
||||
font-size: 12px;
|
||||
margin-top: 4px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
/* ---------------- HIDDEN MESSAGES ------------------ */
|
||||
|
||||
|
|
|
|||
|
|
@ -1,166 +0,0 @@
|
|||
/* ------------------------------ */
|
||||
/* Compose Message */
|
||||
/* ------------------------------ */
|
||||
|
||||
.openerp .oe_msg_content .oe_mail_compose_message_footer {
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.openerp .oe_msg_content .oe_mail_compose_message_footer button.oe_mail_compose_message_button_send {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.openerp .oe_mail .oe_mail_compose_textarea
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.openerp .oe_mail .oe_mail_compose_textarea .oe_mail_post_header,
|
||||
.openerp .oe_mail .oe_mail_compose_textarea .oe_mail_post_footer,
|
||||
{
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.openerp .oe_mail .oe_mail_compose_textarea a.oe_cancel {
|
||||
position: absolute;
|
||||
right: -8px;
|
||||
top: -8px;
|
||||
}
|
||||
.openerp .oe_mail .oe_mail_compose_textarea a.oe_cancel:first-of-type {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.openerp .oe_mail .oe_mail_compose_textarea button.oe_full {
|
||||
float: right;
|
||||
position: relative;
|
||||
right: -10px;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------ */
|
||||
/* mail.compose.message : list_recipients
|
||||
/* ------------------------------------------------------------ */
|
||||
|
||||
.openerp .oe_mail .oe_mail_list_recipients {
|
||||
display: inline;
|
||||
}
|
||||
.openerp .oe_mail .oe_mail_list_recipients .oe_all_follower {
|
||||
color: blue;
|
||||
}
|
||||
.openerp .oe_mail .oe_mail_list_recipients .oe_partner_follower a {
|
||||
color: red;
|
||||
}
|
||||
.openerp .oe_mail .oe_mail_list_recipients .oe_hidden,
|
||||
.openerp .oe_mail .oe_mail_list_recipients .oe_more_hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------ */
|
||||
/* mail.compose.message : attachment
|
||||
/* ------------------------------------------------------------ */
|
||||
|
||||
.openerp .oe_mail .oe_attachment_file {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.openerp .oe_mail .oe_attachment_file .oe_add {
|
||||
float: left;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
left: +2px;
|
||||
top: +7px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* attachment button: override of openerp values */
|
||||
.openerp .oe_mail .oe_attachment_file .oe_add button,
|
||||
.openerp .oe_mail .oe_attachment_file .oe_add input.oe_insert_file {
|
||||
position: absolute;
|
||||
bottom: +0px;
|
||||
left: +0px;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
.openerp .oe_mail .oe_attachment_file .oe_add input.oe_insert_file {
|
||||
z-index:2;
|
||||
width: 300px;
|
||||
left: -100px;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
color: transparent;
|
||||
}
|
||||
.openerp .oe_mail .oe_attachment_file .oe_add button span {
|
||||
position: relative;
|
||||
bottom: +4px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.openerp .oe_mail .oe_msg_attachments input {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.openerp .oe_mail .oe_mail_compose_attachment_list {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------ */
|
||||
/* mail.compose.message
|
||||
/* ------------------------------------------------------------ */
|
||||
|
||||
|
||||
/* default textarea (oe_mail_compose_textarea), and body textarea for compose form view */
|
||||
.openerp .oe_mail.oe_semantic_html_override .oe_mail_compose_textarea textarea.field_text,
|
||||
.openerp .oe_mail div.oe_mail_compose_message_body textarea.field_text {
|
||||
width: 100%;
|
||||
min-height: 120px;
|
||||
height: auto;
|
||||
padding: 4px;
|
||||
font-size: 12px;
|
||||
border: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
/* not top textarea */
|
||||
.openerp .oe_mail.oe_semantic_html_override .oe_semantic_html_override .oe_mail_compose_textarea textarea.field_text {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
/* form_view: delete white background */
|
||||
.openerp .oe_msg_content div.oe_formview {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.openerp .oe_msg_content div.oe_form_nosheet {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.openerp .oe_msg_content table.oe_form_group {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.openerp .oe_msg_content table.oe_form_field,
|
||||
.openerp .oe_msg_content div.oe_form_field {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.openerp .oe_msg_content td.oe_form_group_cell {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
/* subject: change width */
|
||||
.openerp .oe_msg_content .oe_form .oe_form_field input[type='text'] {
|
||||
width: 472px;
|
||||
}
|
||||
|
||||
/* body_html: cleditor */
|
||||
.openerp .oe_msg_content div.cleditorMain {
|
||||
border: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
/* destination_partner_ids */
|
||||
.openerp .oe_msg_content div.text-core {
|
||||
height: 22px !important;
|
||||
width: 472px;
|
||||
}
|
||||
|
|
@ -198,6 +198,7 @@ openerp.mail = function(session) {
|
|||
/* when a user click on the upload button, send file read on_attachment_loaded
|
||||
*/
|
||||
on_attachment_change: function (event) {
|
||||
console.log('attach');
|
||||
event.stopPropagation();
|
||||
var self = this;
|
||||
var $target = $(event.target);
|
||||
|
|
@ -304,9 +305,9 @@ openerp.mail = function(session) {
|
|||
// set the function called when attachments are added
|
||||
this.$render_expandable.on('change', 'input.oe_form_binary_file', self.on_attachment_change );
|
||||
|
||||
this.$render_expandable.on('click', 'a.oe_cancel', self.on_cancel );
|
||||
this.$render_expandable.on('click', 'button.oe_post', function(){self.on_message_post()} );
|
||||
this.$render_expandable.on('click', 'button.oe_full', function(){self.on_compose_fullmail()} );
|
||||
this.$render_expandable.on('click', '.oe_cancel', self.on_cancel );
|
||||
this.$render_expandable.on('click', '.oe_post', function(){self.on_message_post()} );
|
||||
this.$render_expandable.on('click', '.oe_full', function(){self.on_compose_fullmail()} );
|
||||
|
||||
// auto close
|
||||
this.$render_expandable.on('blur', 'textarea', this.on_compose_expandable);
|
||||
|
|
@ -365,6 +366,7 @@ openerp.mail = function(session) {
|
|||
|
||||
/*post a message and fetch the message*/
|
||||
on_message_post: function (body) {
|
||||
console.log('post');
|
||||
var self = this;
|
||||
|
||||
if (! body) {
|
||||
|
|
|
|||
|
|
@ -21,14 +21,14 @@
|
|||
</div>
|
||||
<div class="oe_msg_center">
|
||||
<div class="oe_msg_content">
|
||||
<textarea class="field_text" placeholder="Add your comment here..."/>
|
||||
<t t-call="mail.thread.list_recipients"/>
|
||||
<textarea class="field_text" placeholder=""/>
|
||||
</div><div class="oe_msg_footer">
|
||||
<div class="oe_msg_attachment_list"/>
|
||||
<button class="oe_post">Post</button>
|
||||
<t t-call="mail.compose_message.add_attachment"/>
|
||||
<t t-call="mail.thread.list_recipients"/>
|
||||
<!--<a class="oe_cancel oe_e">X</a>-->
|
||||
<button class="oe_full oe_right">Full</button>
|
||||
<button class="oe_full"><span class='oe_e'>&ograve</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
-->
|
||||
<t t-name="mail.compose_message.compact">
|
||||
<div class="oe_msg oe_msg_composer_compact">
|
||||
<textarea class="field_text oe_compact" placeholder="Add your comment here..."/>
|
||||
<textarea class="field_text oe_compact" placeholder="Write a reply..."/>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
|
|
@ -50,10 +50,10 @@
|
|||
Small template to be inserted in the composition for add attachments
|
||||
-->
|
||||
<t t-name="mail.compose_message.add_attachment">
|
||||
<div class="oe_attachment_file">
|
||||
<div class="oe_add">
|
||||
<span class="oe_attachment_file">
|
||||
<span class="oe_add">
|
||||
<!-- uploader of file -->
|
||||
<button><span class="oe_e">p</span></button>
|
||||
<button class="oe_attach"><span class="oe_e">'</span></button>
|
||||
<t t-call="HiddenInputFile">
|
||||
<t t-set="fileupload_id" t-value="widget.fileupload_id"/>
|
||||
<t t-set="fileupload_action">/web/binary/upload_attachment</t>
|
||||
|
|
@ -61,8 +61,8 @@
|
|||
<input type="hidden" name="id" value="0"/>
|
||||
<input type="hidden" name="session_id" t-att-value="widget.session.session_id"/>
|
||||
</t>
|
||||
</div>
|
||||
</div>
|
||||
</span>
|
||||
</span>
|
||||
</t>
|
||||
|
||||
<!--
|
||||
|
|
@ -70,9 +70,9 @@
|
|||
Template used to display attachments in a mail.message
|
||||
-->
|
||||
<t t-name="mail.thread.message.attachments">
|
||||
<ul t-attf-class="oe_msg_attachments #{widget.attachment_ids[0]?'':'oe_hidden'}">
|
||||
<div t-attf-class="oe_msg_attachments #{widget.attachment_ids[0]?'':'oe_hidden'}">
|
||||
<t t-foreach="widget.attachment_ids" t-as="attachment">
|
||||
<li>
|
||||
<div class="oe_attachment">
|
||||
<span t-if="(attachment.upload or attachment.percent_loaded<100)" t-attf-title="{(attachment.name || attachment.filename) + (attachment.date?' \n('+attachment.date+')':'' )}" t-attf-name="{attachment.name || attachment.filename}">
|
||||
<div class="oe_upload_in_process">
|
||||
<span>...Upload in progress...</span>
|
||||
|
|
@ -83,11 +83,11 @@
|
|||
<t t-raw="attachment.name || attachment.filename"/>
|
||||
</a>
|
||||
<t t-if="(widget.show_delete_attachment and (!attachment.upload or attachment.percent_loaded>=100))">
|
||||
<a class="oe_right oe_mail_attachment_delete" title="Delete this attachment" t-attf-data-id="{attachment.id}">x</a>
|
||||
<a class="oe_right oe_mail_attachment_delete oe_e" title="Delete this attachment" t-attf-data-id="{attachment.id}">[</a>
|
||||
</t>
|
||||
</li>
|
||||
</div>
|
||||
</t>
|
||||
</ul>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
<t t-name="mail.thread.message.private">
|
||||
|
|
@ -103,8 +103,8 @@
|
|||
-->
|
||||
<t t-name="mail.thread.list_recipients">
|
||||
<div class="oe_mail_list_recipients">
|
||||
Post to:
|
||||
<span t-if="!widget.is_private" class="oe_all_follower">All Followers</span>
|
||||
To:
|
||||
<span t-if="!widget.is_private" class="oe_all_follower">Everyone</span>
|
||||
<t t-if="!widget.is_private and widget.partner_ids.length"> and </t>
|
||||
<t t-set="inc" t-value="0"/>
|
||||
<t t-if="widget.partner_ids.length" t-foreach="widget.partner_ids" t-as="partner"><span t-attf-class="oe_partner_follower #{inc>=3?'oe_hidden':''}"><t t-if="inc" t-raw="', '"/><a t-attf-href="#model=res.partner&id=#{partner[0]}"><t t-raw="partner[1]"/></a></span><t t-set="inc" t-value="inc+1"/>
|
||||
|
|
|
|||
Loading…
Reference in New Issue