summaryrefslogtreecommitdiff
path: root/web-ui
diff options
context:
space:
mode:
authorReinaldo de Souza Jr <juniorz@gmail.com>2015-11-11 14:25:04 -0200
committerReinaldo de Souza Jr <juniorz@gmail.com>2015-11-11 14:25:44 -0200
commite5cd25e3284b4901d9b61171acf8f03138709f26 (patch)
tree9089ecf9f1227b4d44909ad0b920d7f5d38c8da0 /web-ui
parenta8dfb9547561567813247484f18e15e7c40352b4 (diff)
Align second line of email addresses to the beginning of the first line
Fixes #514
Diffstat (limited to 'web-ui')
-rw-r--r--web-ui/app/js/mail_view/ui/recipients/recipients.js5
-rw-r--r--web-ui/app/scss/_mixins.scss14
-rw-r--r--web-ui/app/templates/compose/recipients.hbs24
3 files changed, 34 insertions, 9 deletions
diff --git a/web-ui/app/js/mail_view/ui/recipients/recipients.js b/web-ui/app/js/mail_view/ui/recipients/recipients.js
index 3d756bd5..2caa8d14 100644
--- a/web-ui/app/js/mail_view/ui/recipients/recipients.js
+++ b/web-ui/app/js/mail_view/ui/recipients/recipients.js
@@ -32,7 +32,8 @@ define(
function recipients() {
this.defaultAttrs({
- navigationHandler: '.recipients-navigation-handler'
+ navigationHandler: '.recipients-navigation-handler',
+ recipientsList: '.recipients-list'
});
function getAddresses(recipients) {
@@ -85,7 +86,7 @@ define(
};
this.addRecipient = function(recipient) {
- var newRecipient = Recipient.prototype.renderAndPrepend(this.$node, recipient);
+ var newRecipient = Recipient.prototype.renderAndPrepend(this.$node.find(this.attr.recipientsList), recipient);
this.attr.recipients.push(newRecipient);
};
diff --git a/web-ui/app/scss/_mixins.scss b/web-ui/app/scss/_mixins.scss
index 0e1edf66..1f3e618e 100644
--- a/web-ui/app/scss/_mixins.scss
+++ b/web-ui/app/scss/_mixins.scss
@@ -176,13 +176,25 @@
box-sizing: border-box;
position: relative;
- .recipients-label {
+ .compose-column-label {
width: 5%;
+ display: inline-block;
+ }
+
+ .compose-column-recipients {
+ width: 95%;
+ display: inline-block;
+ }
+
+ .recipients-label {
+ width: 100%;
+ height: 100%;
}
.recipients-navigation-handler {
z-index: -1;
position: absolute;
+ top: -200px;
}
.twitter-typeahead {
diff --git a/web-ui/app/templates/compose/recipients.hbs b/web-ui/app/templates/compose/recipients.hbs
index effe48e2..6dbed714 100644
--- a/web-ui/app/templates/compose/recipients.hbs
+++ b/web-ui/app/templates/compose/recipients.hbs
@@ -1,19 +1,31 @@
<div id="recipients-fields" style="display:none">
<div id='recipients-to-area' class="recipients-area input-container columns large-12 no-padding">
<input class="recipients-navigation-handler"/>
- <label for="recipients-to-box" class="recipients-label column large-1">{{t 'TO'}}: </label>
- <input id='recipients-to-box' class="recipients-input" type="text" tabindex="1"/>
+ <div class='compose-column-label'>
+ <label for="recipients-to-box" class="recipients-label column large-1">{{t 'TO'}}: </label>
+ </div>
+ <div class='recipients-list compose-column-recipients'>
+ <input id='recipients-to-box' class="recipients-input" type="text" tabindex="1"/>
+ </div>
</div>
<div id="recipients-cc-area" class="recipients-area input-container columns large-12 no-padding">
<input class="recipients-navigation-handler"/>
- <label for="recipients-cc-box" class="recipients-label column large-1">{{t 'CC'}}: </label>
- <input id='recipients-cc-box' class="recipients-input" type="text" tabindex="2"/>
+ <div class='compose-column-label'>
+ <label for="recipients-cc-box" class="recipients-label column large-1">{{t 'CC'}}: </label>
+ </div>
+ <div class='recipients-list compose-column-recipients'>
+ <input id='recipients-cc-box' class="recipients-input" type="text" tabindex="2"/>
+ </div>
</div>
<div id="recipients-bcc-area" class="recipients-area input-container columns large-12 no-padding">
<input class="recipients-navigation-handler"/>
- <label for ="recipients-bcc-box" class="recipients-label column large-1">{{t 'BCC'}}: </label>
- <input id='recipients-bcc-box' class="recipients-input" type="text" tabindex="3"/>
+ <div class='compose-column-label'>
+ <label for ="recipients-bcc-box" class="recipients-label column large-1">{{t 'BCC'}}: </label>
+ </div>
+ <div class='recipients-list compose-column-recipients'>
+ <input id='recipients-bcc-box' class="recipients-input" type="text" tabindex="3"/>
+ </div>
</div>
</div>