Mobile theme W.I.P.:

- Add mail display dialog
- Style details widget for mobile theme
- Implement fixed actions for mail display
This commit is contained in:
Hadi Nategh 2016-01-21 10:19:10 +00:00
parent 6a50715f99
commit c0c4099e29
6 changed files with 362 additions and 9 deletions

View File

@ -1946,6 +1946,13 @@ class mail_ui
);
$actions['tracker']['toolbarDefault'] = true;
$actions['forward']['toolbarDefault'] = true;
if (html::$ua_mobile) {
foreach($actions as $key => $action)
{
if (in_array($key,array('calendar', 'infolog' ,'tracker' ))) $actions[$key]['toolbarDefault'] = false;
$actions['save']['children']['save2disk']['toolbarDefault'] = $actions['print']['toolbarDefault'] = false;
}
}
$compose = $actions['composeasnew'];
unset($actions['composeasnew']);
$actions = array_reverse($actions,true);

View File

@ -0,0 +1,84 @@
<?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.display" template="" lang="" group="0" version="1.9.001">
<appicon class="onlyPrint"/>
<html id="msg"/>
<vbox class="mailDisplay">
<hbox class="dialogHeadbar">
<hbox>
<toolbar id="displayToolbar" width="100%" view_range="6" flat_list="true"/>
<description/>
</hbox>
</hbox>
<hbox class="mail-d-h1" width="100%">
<description align="left" id="mail_displaysubject" no_lang="1" readonly="true"/>
</hbox>
<hbox class="mail-d-h2" id="mailDisplayHeadersFrom" disabled="!@FROM" width="100%">
<url-email id="FROM" readonly="true"/>
</hbox>
<hbox class="mail-d-h2" align="right" width="100%">
<date-time id="mail_displaydate" readonly="true"/>
</hbox>
<hbox class="mail-d-h2" id="mailDisplayHeadersTo" disabled="!@TO" width="100%">
<description value="To"/>
<hbox id="TO" class="mail_extraEmails">
</hbox>
<buttononly class="et2_button ui-button" label="Show all Addresses" image="foldertree_nolines_plus" onclick="app.mail.showAllHeader"/>
</hbox>
<details title="show details" toggle_align="left">
<hbox class="mail-d-h2" id="mailDisplayHeadersSender" disabled="!@SENDER" width="100%">
<description value="on behalf of"/>
<url-email id="SENDER" readonly="true"/>
</hbox>
<hbox class="mail-d-h2" id="mailDisplayHeadersCc" disabled="!@CC" width="100%">
<description value="Cc"/>
<hbox id="CC" class="mail_extraEmails">
</hbox>
<buttononly class="et2_button ui-button" label="Show all Addresses" image="foldertree_nolines_plus" onclick="app.mail.showAllHeader"/>
</hbox>
<hbox class="mail-d-h2" id="mailDisplayHeadersBcc" disabled="!@BCC" width="100%">
<description value="Bcc"/>
<hbox id="BCC" class="mail_extraEmails">
</hbox>
<buttononly class="et2_button ui-button" label="Show all Addresses" image="foldertree_nolines_plus" onclick="app.mail.showAllHeader"/>
</hbox>
</details>
</vbox>
<vbox class="mailDisplay">
<iframe frameborder="1" class="mail_displaybody" id="mailDisplayBodySrc" name="mailDisplayBodySrc" scrolling="auto" width="100%"/>
<box class="$cont[mailDisplayAttachmentsClass]">
<grid disabled="@no_griddata" id="mail_displayattachments" class="egwGridView_grid" width="100%">
<columns>
<column disabled="!@showtempname"/>
<column disabled="!@showtempname"/>
<column disabled="!@showtempname"/>
<column disabled="!@showtempname"/>
<column width="70%" />
<column width="11%" />
<column width="3%"/>
<column width="3%"/>
<column width="3%"/>
<column />
</columns>
<rows>
<row class="row attachmentRow" >
<description id="${row}[attachment_number]" />
<description id="${row}[partID]" />
<description id="${row}[type]" />
<description id="${row}[winmailFlag]" />
<description class="useEllipsis et2_link" id="${row}[filename]" expose_view="true" mime="$row_cont[type]" no_lang="1" mime_data="$row_cont[mime_data]" href="$row_cont[mime_url]"/>
<description align="right" id="${row}[size]" />
<buttononly id="${row}[save]" value="save" image="fileexport" onclick="app.mail.saveAttachment"/>
<buttononly id="${row}[saveAsVFS]" value="save" image="filemanager/navbar" onclick="app.mail.saveAttachmentToVFS"/>
<buttononly class="$row_cont[classSaveAllPossiblyDisabled]" id="${row}[save_all]" value="save_all" image="mail/save_all" onclick="app.mail.saveAllAttachmentsToVFS"/>
<buttononly class="$row_cont[classSaveAllPossiblyDisabled]" id="${row}[save_zip]" value="save_zip" image="mail/save_zip" onclick="app.mail.saveAllAttachmentsToZip" label="Save as Zip"/>
</row>
</rows>
</grid>
</box>
</vbox>
</template>
</overlay>

View File

@ -2595,6 +2595,7 @@ div.mailComposeHeaderSection > table {
}
#mail-display.et2_container {
min-height: initial;
padding: 0;
}
.mailDisplayHeaders,
.mailDisplayAttachments > * {
@ -2602,9 +2603,108 @@ div.mailComposeHeaderSection > table {
}
/*compose dialog*/
body #popupMainDiv {
padding: 8px 8px 0 0;
padding: 1px 8px 0 8px;
background: none;
}
body #popupMainDiv #mail-display .mail-d-h1 {
padding-bottom: 15px;
border-bottom: 1px solid silver;
font-size: 12pt;
padding-top: 10px;
font-weight: bold;
}
body #popupMainDiv #mail-display .mail-d-h2 {
padding-top: 5px;
font-size: 9pt;
color: grey;
}
body #popupMainDiv #mail-display .mail-d-h2 a,
body #popupMainDiv #mail-display .mail-d-h2 span,
body #popupMainDiv #mail-display .mail-d-h2 .et2_label {
color: grey;
font-size: 10pt;
}
body #popupMainDiv #mail-display .mail-d-h2 a#mail-display_FROM > * {
color: black;
padding-top: 15px;
font-size: 9.5;
}
body #popupMainDiv #mail-display span.et2_details_title {
color: #26537c;
font-size: 10pt;
}
body #popupMainDiv #mail-display div#mail-display_mailDisplayHeadersFrom > * {
color: black;
padding-top: 15px;
}
body #popupMainDiv #mail-display .mailDisplayAttachments {
position: initial;
padding: 0;
margin-top: 10px;
}
body #popupMainDiv #mail-display .et2_toolbar,
body #popupMainDiv #mail-display #mail-display_toolbar {
padding: 1px 5px 5px 10px !important;
}
body #popupMainDiv #mail-display .et2_toolbar button,
body #popupMainDiv #mail-display #mail-display_toolbar button {
width: 46px;
height: 46px;
background-size: 18px 18px;
}
body #popupMainDiv #mail-display .et2_toolbar button[id="displayToolbar-delete"],
body #popupMainDiv #mail-display #mail-display_toolbar button[id="displayToolbar-delete"] {
margin-left: 0;
}
body #popupMainDiv #mail-display .et2_toolbar div.et2_toolbar_actionlist,
body #popupMainDiv #mail-display #mail-display_toolbar div.et2_toolbar_actionlist {
margin-left: 50px;
}
body #popupMainDiv #mail-display .et2_toolbar #displayToolbar-actionbox h.ui-state-hover,
body #popupMainDiv #mail-display #mail-display_toolbar #displayToolbar-actionbox h.ui-state-hover {
background: none;
}
body #popupMainDiv #mail-display .et2_toolbar #displayToolbar-actionbox h.ui-toolbar-menulistHeader,
body #popupMainDiv #mail-display #mail-display_toolbar #displayToolbar-actionbox h.ui-toolbar-menulistHeader {
color: transparent;
border: none;
height: 46px;
width: 35px;
padding: 0 !important;
margin-right: 15px;
margin-top: -7px;
}
body #popupMainDiv #mail-display .et2_toolbar #displayToolbar-actionbox h.ui-toolbar-menulistHeader:after,
body #popupMainDiv #mail-display #mail-display_toolbar #displayToolbar-actionbox h.ui-toolbar-menulistHeader:after {
font-size: 18pt;
content: "\205D";
font-weight: bold;
color: white;
}
body #popupMainDiv #mail-display .et2_toolbar #displayToolbar-actionbox span,
body #popupMainDiv #mail-display #mail-display_toolbar #displayToolbar-actionbox span {
display: none;
}
body #popupMainDiv #mail-display .mailDisplay {
position: initial;
margin-top: 20px;
}
body #popupMainDiv #mail-display #mail-display_mailDisplayBodySrc {
display: none;
}
body #popupMainDiv #mail-display #tempPrintDiv div:first-child {
height: auto !important;
}
body #popupMainDiv #mail-display #tempPrintDiv td,
body #popupMainDiv #mail-display #tempPrintDiv textarea {
font-family: Verdana, Arial, Helvetica, sans-serif;
}
body #popupMainDiv #mail-display #tempPrintDiv .td_display {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 120%;
color: black;
background-color: #FFFFFF;
}
body .dtree div.containerTableStyle {
overflow: hidden;
}

View File

@ -1743,6 +1743,7 @@ div.mailComposeHeaderSection > table {
#mail-display.et2_container {
min-height: initial;
padding: 0;
}
.mailDisplayHeaders, .mailDisplayAttachments > * {
@ -1751,8 +1752,112 @@ div.mailComposeHeaderSection > table {
/*compose dialog*/
body {
#popupMainDiv {
padding: 8px 8px 0 0;
padding: 1px 8px 0 8px;
background: none;
#mail-display{
.mail-d-h1{
padding-bottom: 15px;
border-bottom: 1px solid silver;
font-size: 12pt;
padding-top: 10px;
font-weight: bold;
}
.mail-d-h2{
padding-top: 5px;
font-size: 9pt;
color: grey;
a,span,.et2_label {
color: grey;
.mob-fontsize-n;
}
a#mail-display_FROM>* {
color:black;
padding-top: 15px;
font-size: 9.5;
}
}
span.et2_details_title {
color:#26537c;
.mob-fontsize-n;
}
div#mail-display_mailDisplayHeadersFrom>*, {
color:black;
padding-top: 15px;
}
.mailDisplayAttachments {
position: initial;
padding: 0;
margin-top: 10px;
}
.et2_toolbar,#mail-display_toolbar {
padding: 1px 5px 5px 10px !important;
button {
width:46px;
height:46px;
background-size: 18px 18px;
}
button[id="displayToolbar-delete"] {
margin-left: 0;
}
div.et2_toolbar_actionlist {
margin-left: 50px;
}
#displayToolbar-actionbox {
h.ui-state-hover {
background:none;
}
h.ui-toolbar-menulistHeader {
color:transparent;
border: none;
height: 46px;
width: 35px;
padding: 0 !important;
margin-right: 15px;
margin-top: -7px;
&:hover {
}
&:after {
font-size:18pt;
content:"\205D";
font-weight: bold;
color:white;
}
}
span {
display: none;
}
}
}
.mailDisplay {
position: initial;
margin-top: 20px;
}
#mail-display_mailDisplayBodySrc {
display: none;
}
#tempPrintDiv {
div:first-child {
height:auto !important;
}
td, textarea {
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.td_display {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 120%;
color: black;
background-color: #FFFFFF;
}
}
}
}
.dtree {

View File

@ -7326,17 +7326,36 @@ span.egw_tutorial_title {
.egw_fw_mobile_popup_container span.egw_fw_mobile_popup_close {
width: 50px;
height: 50px;
float: right;
float: left;
background-image: url('../images/cancelled.png');
/*url(../images/topmenu_items/mobile/menu_active.png);*/
-webkit-filter: contrast(2);
background-repeat: no-repeat;
z-index: 1000;
padding-right: 5px;
top: 0;
right: 2px;
top: 2px;
left: 10px;
background-position: 3px 7px;
position: absolute;
}
.egw_fw_mobile_popup_container span.egw_fw_mobile_popup_close.loaded {
background-image: none;
}
.egw_fw_mobile_popup_container span.egw_fw_mobile_popup_close.loaded:after {
content: "\2190";
font-size: 24pt;
color: white;
padding-left: 5px;
}
.dialogHeadbar {
height: 50px;
box-shadow: 0px 1px 1px 1px silver;
position: fixed;
width: 100%;
background: #0c5da5;
top: 0;
right: 0;
}
#mail-display {
min-height: initial !important;
}
@ -7857,4 +7876,9 @@ span.egw_tutorial_title {
body .dtree .containerTableStyle {
overflow: auto;
}
body .et2_details .et2_details_toggle:after {
width: 24px;
height: 24px;
font-size: 18pt;
}
}

View File

@ -813,16 +813,40 @@
span.egw_fw_mobile_popup_close {
width: 50px;
height: 50px;
float:right;
float:left;
background-image: url('../images/cancelled.png');/*url(../images/topmenu_items/mobile/menu_active.png);*/
-webkit-filter: contrast(2);
background-repeat: no-repeat;
z-index: 1000;
padding-right: 5px;
top:0;
right:2px;
top:2px;
left: 10px;
background-position: 3px 7px;
position: absolute;
}
span.egw_fw_mobile_popup_close.loaded {
&:after {
content: "\2190";
font-size: 24pt;
color: white;
padding-left: 5px;
}
background-image: none;
}
}
//###################################
//# #
//# popup dialog headbar #
//# #
//###################################
.dialogHeadbar {
height: 50px;
box-shadow: 0px 1px 1px 1px silver;
position: fixed;
width: 100%;
background: #0c5da5;
top:0;
right:0;
}
//###################################
@ -1437,5 +1461,14 @@
overflow: auto;
}
}
.et2_details {
.et2_details_toggle {
&:after{
width:24px;
height: 24px;
font-size: 18pt;
}
}
}
}
}