diff options
| author | Gislene Pereira <gislene01@gmail.com> | 2016-01-19 17:25:40 -0300 |
|---|---|---|
| committer | Gislene Pereira <gislene01@gmail.com> | 2016-01-19 17:25:40 -0300 |
| commit | 7bc660d72730ed02794aadb66f7a37aa7dada60b (patch) | |
| tree | 5cd3596fed047d5d55de1c89ceaf6030d02ca5d3 /web-ui/app | |
| parent | 6c239f13207e53281ad9d930dd1614844d3acdec (diff) | |
Issue #572 - Remove Attachment text, attachment box takes full width +
+ Attachment size color in lighter gray
+ Add space between each attachment
Diffstat (limited to 'web-ui/app')
| -rw-r--r-- | web-ui/app/js/mail_view/ui/attachment_list.js | 6 | ||||
| -rw-r--r-- | web-ui/app/scss/_colors.scss | 3 | ||||
| -rw-r--r-- | web-ui/app/scss/_compose.scss | 16 | ||||
| -rw-r--r-- | web-ui/app/scss/_read.scss | 6 | ||||
| -rw-r--r-- | web-ui/app/templates/compose/compose_box.hbs | 3 |
5 files changed, 28 insertions, 6 deletions
diff --git a/web-ui/app/js/mail_view/ui/attachment_list.js b/web-ui/app/js/mail_view/ui/attachment_list.js index 72782c6b..786fcb1e 100644 --- a/web-ui/app/js/mail_view/ui/attachment_list.js +++ b/web-ui/app/js/mail_view/ui/attachment_list.js @@ -50,8 +50,8 @@ define( this.buildAttachmentListItem = function (attachment) { return '<a href="' + this.attr.attachmentBaseUrl + '/' + attachment.ident + '?filename=' + - attachment.name + '&encoding=' + attachment.encoding + '">' + attachment.name + ' (' + viewHelper.formatSize(attachment.size) + ')' + - '</a>'; + attachment.name + '&encoding=' + attachment.encoding + '">' + attachment.name + ' <span class="attachment-size"> (' + viewHelper.formatSize(attachment.size) + ')' + + '</span></a>'; }; this.addJqueryFileUploadConfig = function() { @@ -88,4 +88,4 @@ define( } return attachmentList; - });
\ No newline at end of file + }); diff --git a/web-ui/app/scss/_colors.scss b/web-ui/app/scss/_colors.scss index 33b4f4e8..f4b7f21d 100644 --- a/web-ui/app/scss/_colors.scss +++ b/web-ui/app/scss/_colors.scss @@ -43,5 +43,6 @@ $wont_be_encrypted: $attention; $recipients_font_color: #AAA; /* Attachments */ -$attachment_text: #333; +$attachment_text: #555; $attachment_icon: lighten($attachment_text, 30); +$attachment_size: lighten($attachment_text, 30); diff --git a/web-ui/app/scss/_compose.scss b/web-ui/app/scss/_compose.scss index bd064015..3e81a06b 100644 --- a/web-ui/app/scss/_compose.scss +++ b/web-ui/app/scss/_compose.scss @@ -45,7 +45,13 @@ span { padding: 3px; + + &.attachment-size { + color: $attachment_size; + cursor: pointer; + } } + label.floatlabel { padding: 0.4rem !important; position: absolute; @@ -117,6 +123,16 @@ margin: 1px; } + + .attachmentsAreaWrap { + padding: 0; + + .attachmentsArea { + padding: 0; + border-top: 0; + } + } + @include recipients; } diff --git a/web-ui/app/scss/_read.scss b/web-ui/app/scss/_read.scss index 3d657ec7..ed462d38 100644 --- a/web-ui/app/scss/_read.scss +++ b/web-ui/app/scss/_read.scss @@ -68,6 +68,10 @@ padding: 15px 30px 0 30px; } +#attachment-list { + margin-top: 6px; +} + .attachmentsAreaWrap { padding: 0 30px; @@ -80,6 +84,7 @@ border: 1px solid #D9D9D9; border-radius: 2px; background-color: #F5F5F5; + margin-bottom: 7px; a { color: $attachment_text; @@ -92,6 +97,7 @@ i.download-icon { color: lighten($attachment_icon, 15); } + color: $attachment_icon; outline: none; } diff --git a/web-ui/app/templates/compose/compose_box.hbs b/web-ui/app/templates/compose/compose_box.hbs index eb204501..06cc099a 100644 --- a/web-ui/app/templates/compose/compose_box.hbs +++ b/web-ui/app/templates/compose/compose_box.hbs @@ -32,11 +32,10 @@ <!-- The container for the uploaded files --> <div class="attachmentsAreaWrap {{#unless attachments}}hide{{/unless}}"> <div class="attachmentsArea column large-12"> - <p><strong><i class="fa fa-paperclip"></i> Attachment(s):</strong></p> <ul id="attachment-list-item"> {{#each attachments }} <li> - <a href="/attachment/{{ this.ident }}?encoding={{ this.encoding }}&filename={{ this.name }}">{{ this.name }} ({{ formatSize this.size}}) + <a href="/attachment/{{ this.ident }}?encoding={{ this.encoding }}&filename={{ this.name }}">{{ this.name }} <span class="attachment-size">({{ formatSize this.size}})</span> <i class="fa fa-arrow-down download-icon"></i></a> </li> {{/each }} |