From cd7f2eea6033dbe6b3b92c655e5b740d631125da Mon Sep 17 00:00:00 2001
From: Hadi Nategh
Date: Mon, 25 Jul 2022 16:35:50 +0200
Subject: [PATCH] WIP Mail styling: - Make display dialog similar to preview
---
mail/inc/class.mail_ui.inc.php | 11 +-
mail/templates/default/app.css | 52 ++------
mail/templates/default/display.xet | 187 ++++++++++++++++++-----------
mail/templates/default/index.xet | 2 +-
mail/templates/pixelegg/app.css | 80 ++----------
mail/templates/pixelegg/app.less | 32 +----
6 files changed, 147 insertions(+), 217 deletions(-)
diff --git a/mail/inc/class.mail_ui.inc.php b/mail/inc/class.mail_ui.inc.php
index c5293e7f8e..12af56559e 100644
--- a/mail/inc/class.mail_ui.inc.php
+++ b/mail/inc/class.mail_ui.inc.php
@@ -2277,7 +2277,7 @@ $filter['before']= date("d-M-Y", $cutoffdate2);
foreach($envelope[$field] as $field_data)
{
//error_log(__METHOD__.__LINE__.array2string($field_data));
- $content[$field][] = $field_data;
+ $content[strtolower($field)][] = $field_data;
$sel_options[$field][] = array(
// taglist requires these - not optional
'id' => $field_data,
@@ -2301,10 +2301,13 @@ $filter['before']= date("d-M-Y", $cutoffdate2);
if (!empty($partID)) $linkData['_partID']=$partID;
if ($htmlOptions != $this->mail_bo->htmlOptions) $linkData['_htmloptions']=$htmlOptions;
$content['mailDisplayBodySrc'] = Egw::link('/index.php',$linkData);
- $content['mail_displayattachments'] = $attachmentHTMLBlock;
+ if (!empty($attachmentHTMLBlock))
+ {
+ $content['mail_displayattachments'] = $attachmentHTMLBlock;
+ $content['attachmentsBlockTitle'] = count($attachmentHTMLBlock).' '.Lang('attachments');
+ }
+
$content['mail_id']=$rowID;
- $content['mailDisplayContainerClass']=!empty($attachments)?"mailDisplayContainer mailDisplayContainerFixedHeight":"mailDisplayContainer mailDisplayContainerFullHeight";
- $content['mailDisplayAttachmentsClass']=!empty($attachments)?"mailDisplayAttachments":"mail_DisplayNone";
// DRAG attachments actions
$etpl->setElementAttribute('mail_displayattachments', 'actions', array(
diff --git a/mail/templates/default/app.css b/mail/templates/default/app.css
index 2e15600de2..8d4d10984b 100644
--- a/mail/templates/default/app.css
+++ b/mail/templates/default/app.css
@@ -445,6 +445,7 @@ div.mail-compose_fileselector {
position: relative;
background-color: white;
width: 100%;
+ height: 100%;
}
#mail-index_mail-index-preview {
overflow: hidden;
@@ -459,7 +460,7 @@ div.mail-compose_fileselector {
#mail-index_mailPreview > div, #mail-index_mailPreview > * {
padding-left: 8px !important;
}
-#mail-index_mailPreview_subject {
+#mail-index_mailPreview_subject, #mail-display_mail_displaysubject {
margin-bottom: 1em;
font-size: 1.2em;
}
@@ -567,36 +568,14 @@ div.mail-compose_fileselector {
}
#mail-display {
- min-height: 768px;
- margin: 0;
padding: 5px;
}
-#mail-display_mail_displaysubject {
- font-size: 14px;
-}
-
-.mailDisplayContainer, .mailDisplayAttachments {
- display: block;
- display: -moz-inline-stack;
- display: -moz-box;
- /*width: 99%;*/
- overflow: hidden;
- left: 8px;
- right: 8px;
-}
.mailDisplayContainer {
- position: fixed;
- overflow: hidden;
- border: 1px solid silver;
- top: 120px;
-}
-.mailDisplayContainerFixedHeight {
- bottom: 123px;
- overflow: hidden;
-}
-.mailDisplayContainerFullHeight {
- bottom: 108px;
+ height: 100%;
+ padding-top: 1em;
+ border-top: 1px solid silver;
+ margin-top: 1em;
}
.mailDisplayBody {
height:100%;
@@ -618,10 +597,7 @@ div.mail-compose_fileselector {
#mail-display_mailDisplayBodySrc {
height:100%;
}
-div.mail-display > div:first-parent > div.first-parent
-{
- height: 99%;
-}
+
.mailDisplayHeaders {
overflow: hidden;
right: 8px;
@@ -634,10 +610,6 @@ div.mail-display > div:first-parent > div.first-parent
}
-div.mailDisplayHeaders > div:first-parent {
- overflow: hidden;
-}
-
div.mailDisplayHeaders > span:first-child, div.mailPreviewHeaders > span:first-child {
width: 7em;
display: inline-block;
@@ -692,7 +664,6 @@ div.mailDisplayHeaders div.mail_extraEmails.visible {
.mailPreviewHeaders :first-child, .mailDisplayHeaders :first-child {
flex: 0 0 auto;
color: #7a7a7a;
- text-align: end;
}
div.mailPreviewHeaders div.mail_extraEmails {
@@ -849,7 +820,7 @@ blockquote blockquote blockquote blockquote blockquote blockquote{
pre {
width:99% !important;
}
- div.mailDisplayContainer {
+ .mailDisplayContainer {
border-top: none;
overflow: visible !important;
position: static !important;
@@ -874,19 +845,16 @@ blockquote blockquote blockquote blockquote blockquote blockquote{
div.mailDisplayHeaders {
padding-top: 10px;
}
- div.mailDisplayContainer.mailvelopeTopContainer {
+ .mailDisplayContainer.mailvelopeTopContainer {
top:190px;
}
- div.mailDisplayContainer.mailvelopeTopContainer > iframe {
+ .mailDisplayContainer.mailvelopeTopContainer > iframe {
position: static;
min-width: 860px;
}
.mail_extraEmails > a {
display: inline-block;
}
- div.mail_extraEmails + img.et2_button.et2_button_icon.ui-button.et2_clickable {
- display: none !important;
- }
.et2_email:after {
content: " | ";
}
diff --git a/mail/templates/default/display.xet b/mail/templates/default/display.xet
index d18412e586..bc64f3ba86 100644
--- a/mail/templates/default/display.xet
+++ b/mail/templates/default/display.xet
@@ -7,77 +7,124 @@
-
-
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
diff --git a/mail/templates/default/index.xet b/mail/templates/default/index.xet
index ac07c51314..0177eb40fb 100644
--- a/mail/templates/default/index.xet
+++ b/mail/templates/default/index.xet
@@ -113,7 +113,7 @@
-
+
diff --git a/mail/templates/pixelegg/app.css b/mail/templates/pixelegg/app.css
index 82ed1b76ee..462eeebd6d 100755
--- a/mail/templates/pixelegg/app.css
+++ b/mail/templates/pixelegg/app.css
@@ -442,6 +442,7 @@ div.mail-compose_fileselector {
position: relative;
background-color: white;
width: 100%;
+ height: 100%;
}
#mail-index_mail-index-preview {
overflow: hidden;
@@ -460,7 +461,8 @@ div.mail-compose_fileselector {
#mail-index_mailPreview > * {
padding-left: 8px !important;
}
-#mail-index_mailPreview_subject {
+#mail-index_mailPreview_subject,
+#mail-display_mail_displaysubject {
margin-bottom: 1em;
font-size: 1.2em;
}
@@ -571,35 +573,13 @@ div.mail-compose_fileselector {
display: none !important;
}
#mail-display {
- min-height: 768px;
- margin: 0;
padding: 5px;
}
-#mail-display_mail_displaysubject {
- font-size: 14px;
-}
-.mailDisplayContainer,
-.mailDisplayAttachments {
- display: block;
- display: -moz-inline-stack;
- display: -moz-box;
- /*width: 99%;*/
- overflow: hidden;
- left: 8px;
- right: 8px;
-}
.mailDisplayContainer {
- position: fixed;
- overflow: hidden;
- border: 1px solid silver;
- top: 120px;
-}
-.mailDisplayContainerFixedHeight {
- bottom: 123px;
- overflow: hidden;
-}
-.mailDisplayContainerFullHeight {
- bottom: 108px;
+ height: 100%;
+ padding-top: 1em;
+ border-top: 1px solid silver;
+ margin-top: 1em;
}
.mailDisplayBody {
height: 100%;
@@ -621,9 +601,6 @@ div.mail-compose_fileselector {
#mail-display_mailDisplayBodySrc {
height: 100%;
}
-div.mail-display > div:first-parent > div.first-parent {
- height: 99%;
-}
.mailDisplayHeaders {
overflow: hidden;
right: 8px;
@@ -633,9 +610,6 @@ div.mail-display > div:first-parent > div.first-parent {
position: absolute;
top: 12px;
}
-div.mailDisplayHeaders > div:first-parent {
- overflow: hidden;
-}
div.mailDisplayHeaders > span:first-child,
div.mailPreviewHeaders > span:first-child {
width: 7em;
@@ -684,7 +658,6 @@ div.mailDisplayHeaders div.mail_extraEmails.visible {
.mailDisplayHeaders :first-child {
flex: 0 0 auto;
color: #7a7a7a;
- text-align: end;
}
div.mailPreviewHeaders div.mail_extraEmails {
display: inline-block;
@@ -835,7 +808,7 @@ blockquote blockquote blockquote blockquote blockquote blockquote {
pre {
width: 99% !important;
}
- div.mailDisplayContainer {
+ .mailDisplayContainer {
border-top: none;
overflow: visible !important;
position: static !important;
@@ -858,19 +831,16 @@ blockquote blockquote blockquote blockquote blockquote blockquote {
div.mailDisplayHeaders {
padding-top: 10px;
}
- div.mailDisplayContainer.mailvelopeTopContainer {
+ .mailDisplayContainer.mailvelopeTopContainer {
top: 190px;
}
- div.mailDisplayContainer.mailvelopeTopContainer > iframe {
+ .mailDisplayContainer.mailvelopeTopContainer > iframe {
position: static;
min-width: 860px;
}
.mail_extraEmails > a {
display: inline-block;
}
- div.mail_extraEmails + img.et2_button.et2_button_icon.ui-button.et2_clickable {
- display: none !important;
- }
.et2_email:after {
content: " | ";
}
@@ -1015,6 +985,7 @@ div#mail-index_nm.splitter-pane {
min-width: 3.7em !important;
}
#popupMainDiv {
+ height: 99%;
padding: 5px;
}
#popupMainDiv .et2_grid tr td {
@@ -1042,10 +1013,6 @@ iframe#mail-display_mailDisplayBodySrc {
height: 99%;
/*border: 4px solid yellow;*/
}
-/*Border around iframe*/
-.mailDisplayContainer {
- border: 0px;
-}
body {
background-color: white;
}
@@ -1350,7 +1317,6 @@ body {
* ##################################################################################
*/
#mail-display {
- min-height: 768px;
padding: 5px;
}
#mail-display .mailDisplayAttachments {
@@ -1904,30 +1870,6 @@ div.mailPreviewHeaders img.et2_button_icon {
}
/*######################################################*/
/*Diplay : View */
-.mailDisplayContainer,
-.mailDisplayAttachments {
- display: block;
- display: -moz-inline-stack;
- display: -moz-box;
- width: 99%;
- overflow: hidden;
- overflow-y: auto;
- left: 3px;
- right: 3px;
- z-index: 100;
-}
-.mailDisplayContainer {
- position: fixed;
- overflow: hidden;
- overflow-y: auto;
- border-top: 2px solid silver;
- top: 120px;
- bottom: 108px;
- border-bottom: 1px solid silver;
- width: 98%;
- background-color: white;
- margin-left: 10px;
-}
.mailDisplayHeaders {
overflow: hidden;
}
diff --git a/mail/templates/pixelegg/app.less b/mail/templates/pixelegg/app.less
index 4ff824f862..dcede0e631 100755
--- a/mail/templates/pixelegg/app.less
+++ b/mail/templates/pixelegg/app.less
@@ -18,6 +18,7 @@
#popupMainDiv{
+ height: 99%;
padding: 5px;
.et2_grid{
tr{
@@ -51,10 +52,6 @@ iframe#mail-display_mailDisplayBodySrc{
/*border: 4px solid yellow;*/
}
-/*Border around iframe*/
-.mailDisplayContainer{
- border: 0px;
-}
body {
background-color: white;
@@ -377,11 +374,7 @@ body {
*/
#mail-display {
- // gesamtbreite
-
- min-height: 768px;
padding: 5px;
-
.mailDisplayAttachments {
// background-color:#efefdf;
max-height: 12%;
@@ -1002,29 +995,6 @@ div.mailPreviewHeaders img.et2_button_icon {
/*######################################################*/
/*Diplay : View */
-.mailDisplayContainer, .mailDisplayAttachments {
- display: block;
- display: -moz-inline-stack;
- display: -moz-box;
- width: 99%;
- overflow: hidden;
- overflow-y: auto;
- left: 3px;
- right: 3px;
- z-index: 100;
-}
-.mailDisplayContainer {
- position: fixed;
- overflow: hidden;
- overflow-y: auto;
- border-top: 2px solid silver;
- top: 120px;
- bottom: 108px;
- border-bottom: 1px solid silver;
- width: 98%;
- background-color: white;
- margin-left: 10px;
-}
.mailDisplayHeaders {
overflow: hidden;