Mobile theme W.I.P.:

- Implement mail body preview
This commit is contained in:
Hadi Nategh 2016-02-19 09:42:09 +00:00
parent ab23ecb7f5
commit 701cea7c51
4 changed files with 39 additions and 11 deletions

View File

@ -916,7 +916,7 @@ body {
/*height: 20px !important;*/ /*height: 20px !important;*/
} }
#mail-index div#mail-index_nm tr.mail td img { #mail-index div#mail-index_nm tr.mail td img {
height: 12px; max-height: 50px;
-webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
-moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
@ -1891,6 +1891,13 @@ tr.forwarded span.status_img {
font-size: 12px; font-size: 12px;
font-family: Arial; font-family: Arial;
} }
.bodypreview {
font-size: 10px;
font-style: italic;
font-weight: normal;
font-family: Arial;
color: grey;
}
TR.sieveRowActive { TR.sieveRowActive {
font-size: 11px; font-size: 11px;
height: 20px; height: 20px;
@ -2599,7 +2606,7 @@ div.mailComposeHeaderSection > table {
transition: all 0.1s ease-out; transition: all 0.1s ease-out;
} }
/* tablets and smartphones */ /* tablets and smartphones */
@media only screen and (max-device-width: 1024px) { @media all {
div.mailDisplayContainer { div.mailDisplayContainer {
margin-top: 30px; margin-top: 30px;
margin-left: 0; margin-left: 0;
@ -2877,6 +2884,7 @@ div.mailComposeHeaderSection > table {
} }
#mail-index table.egwGridView_outer tbody tr span.status_img { #mail-index table.egwGridView_outer tbody tr span.status_img {
padding: 0 2px 2px 0; padding: 0 2px 2px 0;
display: inline;
} }
#mail-index table.egwGridView_outer tbody tr span.deleted.status_img { #mail-index table.egwGridView_outer tbody tr span.deleted.status_img {
background-image: url(images/kmmsgdel.png); background-image: url(images/kmmsgdel.png);
@ -2899,4 +2907,14 @@ div.mailComposeHeaderSection > table {
#mail-index table.egwGridView_outer tbody tr span.forwarded.status_img { #mail-index table.egwGridView_outer tbody tr span.forwarded.status_img {
background-image: url(images/kmmsgforwarded.png); background-image: url(images/kmmsgforwarded.png);
} }
#mail-index table.egwGridView_outer tbody tr span.bodypreview {
max-height: 12px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-left: 2px;
font-style: normal;
font-size: 8pt;
padding-top: 5px;
}
} }

View File

@ -18,7 +18,7 @@
@import (less) "../pixelegg/app.css"; @import (less) "../pixelegg/app.css";
/* tablets and smartphones */ /* tablets and smartphones */
@media only screen and (max-device-width:1024px) { @media all {
div.mailDisplayContainer{ div.mailDisplayContainer{
margin-top: 30px; margin-top: 30px;
margin-left:0; margin-left:0;
@ -316,7 +316,8 @@
text-decoration : line-through; text-decoration : line-through;
} }
span.status_img { span.status_img {
padding:0 2px 2px 0; padding:0 2px 2px 0;
display:inline;
} }
span.deleted.status_img { span.deleted.status_img {
background-image: url(images/kmmsgdel.png); background-image: url(images/kmmsgdel.png);
@ -339,6 +340,16 @@
span.forwarded.status_img { span.forwarded.status_img {
background-image: url(images/kmmsgforwarded.png); background-image: url(images/kmmsgforwarded.png);
} }
span.bodypreview {
max-height: 12px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-left: 2px;
font-style: normal;
font-size: 8pt;
padding-top: 5px;
}
} }
} }
} }

View File

@ -21,6 +21,7 @@
<description class="status_img $row_cont[class]"/> <description class="status_img $row_cont[class]"/>
<description id="${row}[subject]" no_lang="1" class="$row_cont[class]" /> <description id="${row}[subject]" no_lang="1" class="$row_cont[class]" />
</hbox> </hbox>
<description id="${row}[bodypreview]" no_lang="1" class='et2_label bodypreview'/>
</vbox> </vbox>
<vbox> <vbox>
<hbox> <hbox>

View File

@ -904,7 +904,7 @@ body {
/*height: 20px !important;*/ /*height: 20px !important;*/
} }
#mail-index div#mail-index_nm tr.mail td img { #mail-index div#mail-index_nm tr.mail td img {
height: 12px; max-height: 50px;
-webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
-moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
@ -922,7 +922,7 @@ body {
background-repeat: repeat-x; background-repeat: repeat-x;
} }
#mail-index div#mail-index_nm tr.mail div span { #mail-index div#mail-index_nm tr.mail div span {
max-height: 50px; height: 12px;
-webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
-moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
@ -1880,13 +1880,11 @@ tr.forwarded span.status_img {
font-family: Arial; font-family: Arial;
} }
.bodypreview { .bodypreview {
white-space: normal !important; font-size: 10px;
max-height: 25px !important;
font-size: 11px;
font-style: italic; font-style: italic;
font-weight : normal !important; font-weight: normal;
font-family: Arial; font-family: Arial;
color: grey !important; color: grey;
} }
TR.sieveRowActive { TR.sieveRowActive {
font-size: 11px; font-size: 11px;