From 855619a1d60a2bb6e73f448c3548fd3924270ac1 Mon Sep 17 00:00:00 2001 From: Andrei Oprea Date: Fri, 11 Sep 2015 15:47:00 +0100 Subject: [PATCH] Bug 1196499 - Update Loop empty state for no conversations. r=Standard8,ui-review=pau,ui-review=sevaan --- browser/components/loop/content/css/contacts.css | 12 ++---------- browser/components/loop/content/css/panel.css | 4 ++-- browser/components/loop/content/js/panel.js | 6 +++--- browser/components/loop/content/js/panel.jsx | 6 +++--- .../loop/content/shared/img/empty_conversations.svg | 2 +- .../components/loop/test/desktop-local/panel_test.js | 4 +++- .../en-US/chrome/browser/loop/loop.properties | 8 ++++---- 7 files changed, 18 insertions(+), 24 deletions(-) diff --git a/browser/components/loop/content/css/contacts.css b/browser/components/loop/content/css/contacts.css index a671e541a69d..3ca9360cddce 100644 --- a/browser/components/loop/content/css/contacts.css +++ b/browser/components/loop/content/css/contacts.css @@ -251,18 +251,10 @@ html[dir="rtl"] .contact-filter { width: 100%; } -.panel-text-medium, -.panel-text-large { +.panel-text-medium{ margin: 3px; color: #4a4a4a; -} - -.panel-text-medium { - font-size: 1.2rem; -} - -.panel-text-large { - font-size: 2.2rem; + font-size: 1.3rem; } .contact > .details > .username { diff --git a/browser/components/loop/content/css/panel.css b/browser/components/loop/content/css/panel.css index ec19839246e4..b49446d948b0 100644 --- a/browser/components/loop/content/css/panel.css +++ b/browser/components/loop/content/css/panel.css @@ -292,8 +292,8 @@ html[dir="rtl"] .tab-view li:nth-child(2).selected ~ .slide-bar { position: relative; top: 50%; transform: translateY(-50%); - padding-top: 75px; - padding-bottom: 10px; + padding-top: 11rem; + padding-bottom: 1rem; background-image: url("../shared/img/empty_conversations.svg"); } diff --git a/browser/components/loop/content/js/panel.js b/browser/components/loop/content/js/panel.js index 92cfbee9bdb3..217341498d10 100644 --- a/browser/components/loop/content/js/panel.js +++ b/browser/components/loop/content/js/panel.js @@ -829,11 +829,11 @@ loop.panel = (function(_, mozL10n) { React.createElement("div", {className: "rooms"}, React.createElement("div", {className: "room-list-empty"}, React.createElement("div", {className: "no-conversations-message"}, - React.createElement("p", {className: "panel-text-large"}, - mozL10n.get("no_conversations_message_heading") + React.createElement("p", {className: "panel-text-medium"}, + mozL10n.get("no_conversations_message_heading2") ), React.createElement("p", {className: "panel-text-medium"}, - mozL10n.get("no_conversations_start_message") + mozL10n.get("no_conversations_start_message2") ) ) ), diff --git a/browser/components/loop/content/js/panel.jsx b/browser/components/loop/content/js/panel.jsx index a9a978873eea..10a6ac7ee1b7 100644 --- a/browser/components/loop/content/js/panel.jsx +++ b/browser/components/loop/content/js/panel.jsx @@ -829,11 +829,11 @@ loop.panel = (function(_, mozL10n) {
-

- {mozL10n.get("no_conversations_message_heading")} +

+ {mozL10n.get("no_conversations_message_heading2")}

- {mozL10n.get("no_conversations_start_message")} + {mozL10n.get("no_conversations_start_message2")}

diff --git a/browser/components/loop/content/shared/img/empty_conversations.svg b/browser/components/loop/content/shared/img/empty_conversations.svg index 384ce98e41a8..8599f3f934f1 100644 --- a/browser/components/loop/content/shared/img/empty_conversations.svg +++ b/browser/components/loop/content/shared/img/empty_conversations.svg @@ -1 +1 @@ - \ No newline at end of file +Hello_Conversations@1x \ No newline at end of file diff --git a/browser/components/loop/test/desktop-local/panel_test.js b/browser/components/loop/test/desktop-local/panel_test.js index 9459613bef5a..cb51b81fe3e4 100644 --- a/browser/components/loop/test/desktop-local/panel_test.js +++ b/browser/components/loop/test/desktop-local/panel_test.js @@ -848,7 +848,9 @@ describe("loop.panel", function() { var view = createTestComponent(); sinon.assert.calledWithExactly(document.mozL10n.get, - "no_conversations_message_heading"); + "no_conversations_message_heading2"); + sinon.assert.calledWithExactly(document.mozL10n.get, + "no_conversations_start_message2"); }); it("should display a loading animation when rooms are pending", function() { diff --git a/browser/locales/en-US/chrome/browser/loop/loop.properties b/browser/locales/en-US/chrome/browser/loop/loop.properties index 9c9eff2117f5..17947ef5bdaa 100644 --- a/browser/locales/en-US/chrome/browser/loop/loop.properties +++ b/browser/locales/en-US/chrome/browser/loop/loop.properties @@ -137,12 +137,12 @@ no_contacts_message_heading2=No contacts yet. ## LOCALIZATION NOTE(no_contacts_import_or_add2): Subheading inviting the user ## to add people to his contact list no_contacts_import_or_add2=Add someone! -## LOCALIZATION NOTE(no_conversations_message_heading): Title shown when user +## LOCALIZATION NOTE(no_conversations_message_heading2): Title shown when user ## has no conversations available. -no_conversations_message_heading=There are no conversations yet -## LOCALIZATION NOTE(no_converastions_start_message): Subheading inviting the +no_conversations_message_heading2=No conversations yet. +## LOCALIZATION NOTE(no_conversations_start_message2): Subheading inviting the ## user to start a new conversation. -no_conversations_start_message=start a new conversation! +no_conversations_start_message2=Start a new one! ## LOCALIZATION NOTE(contacts_no_search_results): Message shown when contacts ## search returned no matching results. contacts_no_search_results=No matching results.