moparisthebest
/
mail
mirror of https://github.com/moparisthebest/mail
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #177 from whiteout-io/dev/WO-728 

Display text body preview in desktop mode
This commit is contained in:
Tankred Hase 2014-11-12 19:52:33 +01:00
parent 77fc111ee8 dfff273bf3
commit 996730f160
4 changed files with 32 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/sass/base/_config.scss
View File

@ -25,7 +25,7 @@ $color-grey-dark: #333;
$color-grey-medium: #999;
$color-grey-light: #ccc;
$color-grey-lighter: #ddd;
$color-grey-lighterer: #f0eff5;
$color-grey-lighterer: #f4f4f4;
$color-grey-lightest: #f9f9f9;
$color-grey-dark-alpha: rgba(0, 0, 0, 0.80);
@ -33,6 +33,7 @@ $color-grey-dark-alpha: rgba(0, 0, 0, 0.80);
// -------------------------------------------
$color-bg: $color-white;
$color-bg-dark: $color-grey-lighterer;
$color-text: $color-grey-dark;
$color-text-light: $color-grey-medium;
$color-main: $color-blue;

2
src/sass/blocks/layout/_page.scss
View File

@ -14,7 +14,7 @@
display: flex;
flex-direction: column;
padding: 10px 20px;
background: $color-grey-lighterer;
background: $color-bg-dark;
color: $color-text;
}

25
src/sass/blocks/views/_mail-list.scss
View File

@ -109,7 +109,7 @@
@include respond-to(lg) {
height: 100%;
background: $color-border-light;
background: $color-bg-dark;
& > header {
display: none;
@ -265,6 +265,9 @@
font-weight: bold;
padding-right: 90px; // to make room for time
padding-bottom: 8px;
& > span {
display: none;
}
}
&__time {
@include scut-truncate;
@ -326,7 +329,7 @@
$cell-padding-horizontal: 10px;
display: table-row;
background: mix($color-bg, $color-border-light, 70%);
background: $color-bg-dark;
color: $color-grey;
cursor: pointer;
@ -406,12 +409,24 @@
display: table-cell;
border-bottom: 1px solid $color-border-light;
padding: $cell-padding-vertical $cell-padding-horizontal;
width: 16em;
}
&__subject {
@include scut-truncate;
display: table-cell;
border-bottom: 1px solid $color-border-light;
padding: $cell-padding-vertical $cell-padding-horizontal;
& > strong {
font-weight: normal;
}
& > span {
margin-left: 0.2em;
color: $color-text-light;
&:before {
content: '-';
margin-right: 0.2em;
}
}
}
&__time {
display: table-cell;
@ -439,6 +454,12 @@
.mail-list-entry__name {
font-weight: bold;
}
.mail-list-entry__subject {
font-weight: normal;
& > strong {
font-weight: bold;
}
}
}
&--attachment {
.mail-list-entry__attachment > svg {

7
src/tpl/mail-list.html
View File

@ -52,7 +52,12 @@
</li>
</ul>
<h3 class="mail-list-entry__name">{{email.from[0].name || email.from[0].address}}</h3>
<div class="mail-list-entry__subject">{{email.subject || 'No subject'}}</div>
<div class="mail-list-entry__subject">
<strong>{{email.subject || 'No subject'}}</strong>
<span>
{{email.body ? email.body.substr(0, 200) : ''}}
</span>
</div>
<div class="mail-list-entry__attachment">
<svg><use xlink:href="#icon-attachment" /><title>Attachments</title></svg>
</div>