Bug 1069965: add a visual separator between available and blocked contacts. r=paolo
authorMike de Boer <mdeboer@mozilla.com>
Fri, 19 Sep 2014 17:02:03 +0200
changeset 206253 1a986002b2648cb9b540064c4cf8fe18656c5bbb
parent 206252 b26c709330d601cd9d66ad110b5f3de4ed5e111f
child 206254 92d6f9e6cbc397bc5130b094a89605d0a5584866
push id27519
push userkwierso@gmail.com
push dateFri, 19 Sep 2014 23:56:39 +0000
treeherdermozilla-central@a85324dfc960 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerspaolo
bugs1069965
milestone35.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1069965: add a visual separator between available and blocked contacts. r=paolo
browser/components/loop/content/js/contacts.js
browser/components/loop/content/js/contacts.jsx
browser/components/loop/content/shared/css/common.css
browser/locales/en-US/chrome/browser/loop/loop.properties
--- a/browser/components/loop/content/js/contacts.js
+++ b/browser/components/loop/content/js/contacts.js
@@ -171,16 +171,19 @@ loop.contacts = (function(_, mozL10n) {
         React.DOM.div({className: "listWrapper"}, 
           React.DOM.div({ref: "listSlider", className: "listPanels"}, 
             React.DOM.div({className: "faded"}, 
               React.DOM.ul(null, 
                 shownContacts.available ?
                   shownContacts.available.sort(this.sortContacts).map(viewForItem) :
                   null, 
                 shownContacts.blocked ?
+                  React.DOM.h3({className: "header"}, mozL10n.get("contacts_blocked_contacts")) :
+                  null, 
+                shownContacts.blocked ?
                   shownContacts.blocked.sort(this.sortContacts).map(viewForItem) :
                   null
               )
             )
           )
         )
       );
     }
--- a/browser/components/loop/content/js/contacts.jsx
+++ b/browser/components/loop/content/js/contacts.jsx
@@ -171,16 +171,19 @@ loop.contacts = (function(_, mozL10n) {
         <div className="listWrapper">
           <div ref="listSlider" className="listPanels">
             <div className="faded">
               <ul>
                 {shownContacts.available ?
                   shownContacts.available.sort(this.sortContacts).map(viewForItem) :
                   null}
                 {shownContacts.blocked ?
+                  <h3 className="header">{mozL10n.get("contacts_blocked_contacts")}</h3> :
+                  null}
+                {shownContacts.blocked ?
                   shownContacts.blocked.sort(this.sortContacts).map(viewForItem) :
                   null}
               </ul>
             </div>
           </div>
         </div>
       );
     }
--- a/browser/components/loop/content/shared/css/common.css
+++ b/browser/components/loop/content/shared/css/common.css
@@ -395,15 +395,15 @@ p {
   background: transparent url(../img/firefox-logo.png) no-repeat center center;
   background-size: contain;
 }
 
 .header {
   padding: 5px 10px;
   color: #888;
   margin: 0;
-  border-bottom: 1px solid #CCC;
+  border-top: 1px solid #CCC;
   background: #EEE;
   display: flex;
   align-items: center;
   flex-direction: row;
   height: 24px;
 }
--- a/browser/locales/en-US/chrome/browser/loop/loop.properties
+++ b/browser/locales/en-US/chrome/browser/loop/loop.properties
@@ -80,16 +80,19 @@ contacts_search_placesholder=Search…
 ## for where this appears on the UI
 new_contact_button=New Contact
 ## LOCALIZATION NOTE (new_contact_name_placeholder, new_contact_email_placeholder):
 ## These are the placeholders for the fields for entering a new contact
 ## See https://people.mozilla.org/~dhenein/labs/loop-mvp-spec/#contacts
 ## and click the 'New Contact' button to see the fields.
 new_contact_name_placeholder=Name
 new_contact_email_placeholder=Email
+
+contacts_blocked_contacts=Blocked Contacts
+
 ## LOCALIZATION NOTE (add_contact_button):
 ## This is the button to actually add the new contact
 ## See https://people.mozilla.org/~dhenein/labs/loop-mvp-spec/#contacts
 ## and click the 'New Contact' button to see the fields.
 add_contact_button=Add Contact
 ### LOCALIZATION NOTE (valid_email_text_description): This is displayed when
 ### the user enters an invalid email address, preventing the addition of the
 ### contact.