1
0
mirror of https://github.com/moparisthebest/mail synced 2024-11-29 20:32:15 -05:00

implement inputs for address headers in write

This commit is contained in:
Tankred Hase 2013-09-14 18:20:25 +02:00
parent 0693c38532
commit 74f52ef52c
5 changed files with 38 additions and 22 deletions

View File

@ -17,9 +17,12 @@ body, input, button {
.address {
margin-left: 0.3em;
padding: 0.25em 1em;
}
.address-verified {
color: $lightgrey-color;
background-color: $blue-color;
padding: 0.25em 1em;
border-radius: 1em;
box-shadow: 1px 1px 0px $blue-box-shadow-color;
}
@ -38,8 +41,4 @@ body, input, button {
.mail-text-body {
line-height: 1.5em;
p {
margin-bottom: 1em;
}
}

View File

@ -9,6 +9,16 @@
margin-bottom: 20px;
}
input {
font-size: 1em;
border: 0!important;
outline: 0px;
}
.address-input {
width: 90%;
}
.subject-box {
margin: 20px 0;
width: inherit;
@ -25,12 +35,8 @@
}
.subject {
border: 0!important;
font-weight: bold;
font-size: 1em;
width: 100%;
color: $default-text-color;
outline: 0px;
}
.attachment-btn {

View File

@ -122,9 +122,9 @@ define(function(require) {
this.displayDate = '23.08.13';
this.longDisplayDate = 'Wednesday, 23.08.2013 19:23';
this.subject = "Welcome Max"; // Subject line
this.body = "Hi Max,\n" +
"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n" +
"Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet,\n" +
this.body = "Hi Max,\n\n" +
"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n\n" +
"Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet.\n\n" +
"Best regards\nYour whiteout team"; // plaintext body
};

View File

@ -17,11 +17,11 @@
<p class="date">{{selected.longDisplayDate}}</p>
<div class="address-headers">
<p>From: <span class="address">{{selected.from[0].name || selected.from[0].address}}</span></p>
<p>To: <span class="address" ng-repeat="t in selected.to">{{t.address}} </span></p>
<p>From: <span class="address address-verified">{{selected.from[0].name || selected.from[0].address}}</span></p>
<p>To: <span class="address address-verified" ng-repeat="t in selected.to">{{t.address}} </span></p>
<div ng-switch="selected.cc !== undefined">
<p ng-switch-when="true">
CC: <span class="address" ng-repeat="t in selected.cc">{{t.address}} </span>
CC: <span class="address address-verified" ng-repeat="t in selected.cc">{{t.address}} </span>
</p>
</div>
</div><!--/.address-headers-->
@ -29,6 +29,11 @@
<div class="seperator-line"></div>
<div class="mail-text-body">
<p ng-repeat="part in selected.bodyDisplayParts">{{part}}</p>
<p ng-repeat="part in selected.bodyDisplayParts track by $index">
<span ng-switch="part.length === 0">
<span ng-switch-when="true"><br></span>
<span ng-switch-when="false">{{part}}</span>
</span>
</p>
</div>
</div><!--/.read-message-->

View File

@ -2,13 +2,19 @@
<p class="title">New Mail</p>
<div class="address-headers">
<p>To: <span class="address">Max Musterman</span></p>
<p>CC: <span class="address">Alice Example</span> <span class="address">Hans Wurst</span></p>
<p>
<span>To:</span>
<input ng-model="to" class="address-input" tabindex="1">
</p>
<p>
<span>CC:</span>
<input ng-model="cc" class="address-input" tabindex="2">
</p>
</div><!--/.address-headers-->
<div class="subject-box">
<div class="subject-line">
<input ng-model="subject" class="subject" spellcheck="true" tabindex="1" placeholder="Subject" ng-change="updatePreview()">
<input ng-model="subject" class="subject" spellcheck="true" tabindex="3" placeholder="Subject" ng-change="updatePreview()">
</div>
<div class="attachment-btn btn-shadow">
<div class="icon-attachment"></div>
@ -16,13 +22,13 @@
</div><!--/.subject-box-->
<div class="mail-text-body">
<p ng-model="body" contentEditable="true" ng-change="updatePreview()" focus-me ></p>
<p ng-model="body" contentEditable="true" ng-change="updatePreview()" focus-me tabindex="4"></p>
<div class="encrypt-preview">
<p>-----BEGIN ENCRYPTED PREVIEW-----<br>{{ciphertextPreview}}<br>-----END ENCRYPTED PREVIEW-----</p>
<p>--<br>{{signature}}</p>
<p><br>--<br>{{signature}}</p>
</div><!--/.encrypt-preview-->
</div><!--/.mail-text-body-->
<div class="send-btn btn-shadow">Send securely</div>
<div class="send-btn btn-shadow" tabindex="5">Send securely</div>
</div>