mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-12-22 14:41:29 +01:00
Mobile theme WIP: Implement new look for mail compose dialog
This commit is contained in:
Hadi Nategh
parent
cbfb3816a9
commit
d62c9038dc
@ -251,7 +251,10 @@ app.classes.mail = AppJS.extend(
|
||||
jQuery('#mail-compose').on ('load',function() {
|
||||
if (textAreaWidget && textAreaWidget.ckeditor)
|
||||
{
|
||||
textAreaWidget.ckeditor.on('instanceReady', function(){that.compose_fieldExpander();});
|
||||
textAreaWidget.ckeditor.on('instanceReady', function(){
|
||||
that.compose_fieldExpander();
|
||||
if (egwIsMobile()) jQuery(jQuery('iframe.cke_wysiwyg_frame')[0].contentWindow.document.body).css({margin:'0'})
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
112
mail/templates/mobile/compose.xet
Normal file
112
mail/templates/mobile/compose.xet
Normal file
@ -0,0 +1,112 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!DOCTYPE overlay PUBLIC "-//Stylite AG//eTemplate 2//EN" "http://www.egroupware.org/etemplate2.dtd">
|
||||
<!-- $Id$ -->
|
||||
<overlay>
|
||||
<template id="mail.compose" template="" lang="" group="0" version="1.9.001">
|
||||
<vbox class="mailCompose mailComposeHeaderSection" width="100%">
|
||||
<toolbar id="composeToolbar" width="et2_fullWidth" view_range="3" flat_list="false"/>
|
||||
<hbox class="mail-compose_toolbar_assist" width="100%">
|
||||
<vfs-select class="$cont[vfsNotAvailable] compose_egw_icons" id="selectFromVFSForCompose" onchange="app.mail.vfsUploadForCompose" button_caption=""/>
|
||||
<file class="mail-compose_fileselector" statustext="Select file to attach to message" multiple='true' progress='attachments' onFinish="app.mail.uploadForCompose" onStart="app.mail.composeUploadStart" id="uploadForCompose" drop_target ="mail-compose"/>
|
||||
<checkbox statustext="check to save as infolog on send" id="to_infolog" options="on,off"/>
|
||||
<checkbox statustext="check to save as trackerentry on send" id="to_tracker" options="on,off"/>
|
||||
<checkbox statustext="check to save as calendar event on send" id="to_calendar" options="on,off"/>
|
||||
<checkbox statustext="check to recieve a notification when the message is read (note: not all clients support this and/or the reciever may not authorize the notification)" id="disposition" options="on,off"/>
|
||||
<menulist>
|
||||
<menupopup id="priority"/>
|
||||
</menulist>
|
||||
</hbox>
|
||||
|
||||
<grid width="100%" resize_ratio="0">
|
||||
<columns>
|
||||
<column widtd="10%"/>
|
||||
<column width="80%"/>
|
||||
<column width="10%"/>
|
||||
</columns>
|
||||
<rows>
|
||||
<row class="mailComposeHeaders" >
|
||||
<description value="From"/>
|
||||
<menupopup id="mailaccount" onchange="app.mail.submitOnChange" class="et2_fullWidth"/>
|
||||
<vbox>
|
||||
<description id="replyto_expander" value="Reply to" class="et2_button_text" onclick="app.mail.compose_fieldExpander"/>
|
||||
<description id="folder_expander" value="Folder" class="et2_button_text" onclick="app.mail.compose_fieldExpander"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="composeID"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="serverID"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="processedmail_id"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="mode"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" id="lastDrafted"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="references"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="in-reply-to"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="thread-topic"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="thread-index"/>
|
||||
<textbox class="mail-index_quotaDisplayNone" readonly="true" id="list-id"/>
|
||||
</vbox>
|
||||
</row>
|
||||
<row class="mailComposeHeaders mailComposeJQueryReplyto">
|
||||
<description value="Reply to"/>
|
||||
<taglist-email id="replyto" width="100%" maxSelection="1" onclick="app.mail.address_click"/>
|
||||
<description/>
|
||||
</row>
|
||||
<row class="mailComposeHeaders mailComposeJQueryFolder">
|
||||
<description value="Folder"/>
|
||||
<taglist id="folder" autocomplete_url="mail.mail_compose.ajax_searchFolder" autocomplete_params="" allowFreeEntries="false" onclick="app.mail.address_click"/>
|
||||
<description/>
|
||||
</row>
|
||||
<row class="mailComposeHeaders" >
|
||||
<description value="To"/>
|
||||
<taglist-email id="to" width="100%" onclick="app.mail.address_click" include_lists="true" onchange="app.mail.recipients_onchange"/>
|
||||
<vbox>
|
||||
<description id="cc_expander" value="Cc" class="et2_button_text" onclick="app.mail.compose_fieldExpander"/>
|
||||
<description id="bcc_expander" value="Bcc" class="et2_button_text" onclick="app.mail.compose_fieldExpander"/>
|
||||
</vbox>
|
||||
</row>
|
||||
<row class="mailComposeHeaders mailComposeJQueryCc">
|
||||
<description value="Cc"/>
|
||||
<taglist-email id="cc" width="100%" onclick="app.mail.address_click" include_lists="true" onchange="app.mail.recipients_onchange"/>
|
||||
<description/>
|
||||
</row>
|
||||
<row class="mailComposeHeaders mailComposeJQueryBcc">
|
||||
<description value="Bcc"/>
|
||||
<taglist-email id="bcc" width="100%" onclick="app.mail.address_click" include_lists="true" onchange="app.mail.recipients_onchange"/>
|
||||
<description/>
|
||||
</row>
|
||||
<row class="mailComposeHeaders subjectContainer">
|
||||
<textbox span="2" align="left" width="100%" id="subject" blur="Subject" height="25" onchange="app.mail.subject2title"/>
|
||||
<checkbox statustext="Change editor type" label="HTML" id="mimeType" onchange="app.mail.submitOnChange" options=",, ,disable" tabindex="7"/>
|
||||
</row>
|
||||
</rows>
|
||||
</grid>
|
||||
</vbox>
|
||||
<vbox class="mailComposeBodySection" width="99%">
|
||||
<hbox disabled="@is_plain" class="mailComposeBody mailComposeHtmlContainer">
|
||||
<htmlarea span="all" name="mail_htmltext" id="mail_htmltext" imageUpload="link_to" expand_toolbar="true" height="478px" width="100%" resize_ratio="0"/>
|
||||
</hbox>
|
||||
<hbox disabled="@is_html" class="mailComposeBody mailComposeTextContainer">
|
||||
<textbox multiline="true" rows="40" cols="120" width="100%" span="all" no_lang="1" name="mail_plaintext" id="mail_plaintext" resize_ratio="0"/>
|
||||
</hbox>
|
||||
<vbox class="et2_file mailUploadSection" disabled="@no_griddata">
|
||||
<hbox>
|
||||
<select id="filemode" label="Send files as" onchange="app.mail.check_sharing_filemode"/>
|
||||
<date id="expiration" label="Expiration" blur="EPL only" data_format="Y-m-d"/>
|
||||
<passwd id="password" blur="password protect" statustext="Only makes sense, if you transport password through a different channel / outside of this mail to recipients!"/>
|
||||
</hbox>
|
||||
<grid id="attachments" width="100%" maxheight="165" class="egwGridView_grid" resize_ratio="0">
|
||||
<columns>
|
||||
<column disabled="!@showtempname" width="10%"/>
|
||||
<column width="85%"/>
|
||||
<column width="8%"/>
|
||||
<column width="" />
|
||||
</columns>
|
||||
<rows>
|
||||
<row class="row attachmentRow">
|
||||
<description id="${row}[tmp_name]"/>
|
||||
<description class="useEllipsis et2_link" id="${row}[name]" no_lang="1" onclick="app.mail.displayUploadedFile"/>
|
||||
<vfs-size align="right" id="${row}[size]" />
|
||||
<button id="delete[$row_cont[tmp_name]]" value="Delete" image="delete"/>
|
||||
</row>
|
||||
</rows>
|
||||
</grid>
|
||||
</vbox>
|
||||
</vbox>
|
||||
</template>
|
||||
</overlay>
|
||||
@ -2599,19 +2599,65 @@ div.mailComposeHeaderSection > table {
|
||||
#mail-display.et2_container {
|
||||
min-height: initial;
|
||||
}
|
||||
/*Make Font size readable in mobile theme*/
|
||||
#mail-compose .mailComposeHeaders span,
|
||||
#mail-compose .mailComposeHeadersSection span,
|
||||
div.mailDisplayHeaders > span:first-child,
|
||||
div.mailComposeHeaders > span:first-child,
|
||||
div.mailComposeBody,
|
||||
div.mailPreviewHeaders > * {
|
||||
font-size: small !important;
|
||||
}
|
||||
.mailDisplayHeaders,
|
||||
.mailDisplayAttachments > * {
|
||||
font-size: large !important;
|
||||
}
|
||||
/*compose dialog*/
|
||||
body #popupMainDiv {
|
||||
padding: 8px 8px 0 0;
|
||||
background: none;
|
||||
}
|
||||
body #mail-compose .cke_chrome {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
body #mail-compose span#cke_1_top {
|
||||
display: none;
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table {
|
||||
padding: 0;
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders.subjectContainer td:first-child::after {
|
||||
content: '';
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders {
|
||||
border-bottom: 1px solid silver;
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span {
|
||||
font-size: 10pt;
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders .subjectContainer:first-child::after {
|
||||
content: ':';
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders:first-child {
|
||||
border-top: 1px solid silver;
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span#mail-compose_cc_expander,
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span#mail-compose_cc_expander,
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span#mail-compose_bcc_expander,
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span#mail-compose_bcc_expander,
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span#mail-compose_folder_expander,
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span#mail-compose_folder_expander,
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span#mail-compose_replyto_expander,
|
||||
body #mail-compose .mailComposeHeaderSection > table tr.mailComposeHeaders span#mail-compose_replyto_expander {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #26537c;
|
||||
text-decoration: underline;
|
||||
font-size: 10pt;
|
||||
width: 65px;
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table div.et2_taglist > *,
|
||||
body #mail-compose .mailComposeHeaderSection > table #mail-compose_subject,
|
||||
body #mail-compose .mailComposeHeaderSection > table #mail-compose_mailaccount {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
font-size: 10pt;
|
||||
}
|
||||
body #mail-compose .mailComposeHeaderSection > table #mail-compose_subject:focus {
|
||||
outline-color: transparent;
|
||||
}
|
||||
#mail-index table.egwGridView_outer tbody span.et2_date_ro.et2_label {
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
@ -1750,15 +1750,63 @@ div.mailComposeHeaderSection > table {
|
||||
min-height: initial;
|
||||
}
|
||||
|
||||
|
||||
/*Make Font size readable in mobile theme*/
|
||||
#mail-compose .mailComposeHeaders span, #mail-compose .mailComposeHeadersSection span,
|
||||
div.mailDisplayHeaders > span:first-child, div.mailComposeHeaders > span:first-child, div.mailComposeBody, div.mailPreviewHeaders > *{
|
||||
font-size: small !important;
|
||||
}
|
||||
.mailDisplayHeaders, .mailDisplayAttachments > * {
|
||||
font-size: large !important;
|
||||
}
|
||||
/*compose dialog*/
|
||||
body {
|
||||
#popupMainDiv {
|
||||
padding: 8px 8px 0 0;
|
||||
background: none;
|
||||
}
|
||||
#mail-compose {
|
||||
.cke_chrome {
|
||||
border:none;
|
||||
box-shadow: none;
|
||||
}
|
||||
span#cke_1_top {
|
||||
display: none;
|
||||
}
|
||||
.mailComposeHeaderSection > table {
|
||||
padding: 0;
|
||||
tr.mailComposeHeaders.subjectContainer td:first-child::after {
|
||||
content: '';
|
||||
}
|
||||
tr.mailComposeHeaders {
|
||||
span {
|
||||
.mob-fontsize-n;
|
||||
}
|
||||
border-bottom: 1px solid silver;
|
||||
.subjectContainer:first-child::after{
|
||||
content: ':';
|
||||
}
|
||||
&:first-child {
|
||||
border-top: 1px solid silver;
|
||||
}
|
||||
span#mail-compose_cc_expander, span#mail-compose_cc_expander,
|
||||
span#mail-compose_bcc_expander, span#mail-compose_bcc_expander,
|
||||
span#mail-compose_folder_expander, span#mail-compose_folder_expander,
|
||||
span#mail-compose_replyto_expander, span#mail-compose_replyto_expander
|
||||
{
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #26537c;
|
||||
text-decoration: underline;
|
||||
.mob-fontsize-n;
|
||||
width: 65px;
|
||||
}
|
||||
}
|
||||
div.et2_taglist > *, #mail-compose_subject, #mail-compose_mailaccount {
|
||||
border:none;
|
||||
box-shadow: none;
|
||||
.mob-fontsize-n;
|
||||
}
|
||||
#mail-compose_subject:focus {
|
||||
outline-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#mail-index {
|
||||
table.egwGridView_outer tbody {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user