mirror of
https://github.com/EGroupware/egroupware.git
synced 2025-01-27 16:29:22 +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() {
|
jQuery('#mail-compose').on ('load',function() {
|
||||||
if (textAreaWidget && textAreaWidget.ckeditor)
|
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
|
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 {
|
#mail-display.et2_container {
|
||||||
min-height: initial;
|
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,
|
.mailDisplayHeaders,
|
||||||
.mailDisplayAttachments > * {
|
.mailDisplayAttachments > * {
|
||||||
font-size: large !important;
|
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 {
|
#mail-index table.egwGridView_outer tbody span.et2_date_ro.et2_label {
|
||||||
font-size: 9px;
|
font-size: 9px;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1750,15 +1750,63 @@ div.mailComposeHeaderSection > table {
|
|||||||
min-height: initial;
|
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 > * {
|
.mailDisplayHeaders, .mailDisplayAttachments > * {
|
||||||
font-size: large !important;
|
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 {
|
#mail-index {
|
||||||
table.egwGridView_outer tbody {
|
table.egwGridView_outer tbody {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user