diff --git a/browser/components/loop/content/js/panel.js b/browser/components/loop/content/js/panel.js index 8d0d92a35178..2f767532ec9b 100644 --- a/browser/components/loop/content/js/panel.js +++ b/browser/components/loop/content/js/panel.js @@ -200,23 +200,31 @@ loop.panel = (function(_, mozL10n) { render: function() { if (this.state.seenToS == "unseen") { + var locale = mozL10n.getLanguage(); var terms_of_use_url = navigator.mozLoop.getLoopCharPref('legal.ToS_url'); var privacy_notice_url = navigator.mozLoop.getLoopCharPref('legal.privacy_url'); - var tosHTML = __("legal_text_and_links3", { - "clientShortname": __("clientShortname2"), + var tosHTML = mozL10n.get("legal_text_and_links3", { + "clientShortname": mozL10n.get("clientShortname2"), "terms_of_use": React.renderComponentToStaticMarkup( React.DOM.a({href: terms_of_use_url, target: "_blank"}, - __("legal_text_tos") + mozL10n.get("legal_text_tos") ) ), "privacy_notice": React.renderComponentToStaticMarkup( React.DOM.a({href: privacy_notice_url, target: "_blank"}, - __("legal_text_privacy") + mozL10n.get("legal_text_privacy") ) ), }); - return React.DOM.p({className: "terms-service", - dangerouslySetInnerHTML: {__html: tosHTML}}); + return React.DOM.div(null, + React.DOM.p({id: "powered-by"}, + mozL10n.get("powered_by_beforeLogo"), + React.DOM.img({id: "powered-by-logo", className: locale}), + mozL10n.get("powered_by_afterLogo") + ), + React.DOM.p({className: "terms-service", + dangerouslySetInnerHTML: {__html: tosHTML}}) + ); } else { return React.DOM.div(null); } diff --git a/browser/components/loop/content/js/panel.jsx b/browser/components/loop/content/js/panel.jsx index ba8c013fbfea..1c73d935df14 100644 --- a/browser/components/loop/content/js/panel.jsx +++ b/browser/components/loop/content/js/panel.jsx @@ -200,23 +200,31 @@ loop.panel = (function(_, mozL10n) { render: function() { if (this.state.seenToS == "unseen") { + var locale = mozL10n.getLanguage(); var terms_of_use_url = navigator.mozLoop.getLoopCharPref('legal.ToS_url'); var privacy_notice_url = navigator.mozLoop.getLoopCharPref('legal.privacy_url'); - var tosHTML = __("legal_text_and_links3", { - "clientShortname": __("clientShortname2"), + var tosHTML = mozL10n.get("legal_text_and_links3", { + "clientShortname": mozL10n.get("clientShortname2"), "terms_of_use": React.renderComponentToStaticMarkup( - {__("legal_text_tos")} + {mozL10n.get("legal_text_tos")} ), "privacy_notice": React.renderComponentToStaticMarkup( - {__("legal_text_privacy")} + {mozL10n.get("legal_text_privacy")} ), }); - return

; + return
+

+ {mozL10n.get("powered_by_beforeLogo")} + + {mozL10n.get("powered_by_afterLogo")} +

+

+
; } else { return
; } diff --git a/browser/components/loop/content/shared/css/panel.css b/browser/components/loop/content/shared/css/panel.css index dabea306b49a..ada7a516128e 100644 --- a/browser/components/loop/content/shared/css/panel.css +++ b/browser/components/loop/content/shared/css/panel.css @@ -473,13 +473,73 @@ body[dir=rtl] .generate-url-spinner { color: #fff; } +#powered-by, .terms-service { color: #888; text-align: center; font-size: .9em; } -.terms-service a { +#powered-by { + border-top: 1px solid #ccc; + padding-top: 1em; + margin-left: -14px; + margin-right: -14px; +} + +#powered-by-logo { + display: inline-block; + margin-left: 10px; + margin-right: 10px; + vertical-align: middle; + background-image: url("../img/telefonica.png"); + background-size: 72px 20px; + width: 72px; + height: 20px; +} + +#powered-by-logo.en-GB, +#powered-by-logo.de-DE { + background-image: url("../img/02.png"); + background-size: 21px 20px; + width: 21px; + height: 20px; +} + +#powered-by-logo.pt-BR { + background-image: url("../img/vivo.png"); + background-size: 53px 26px; + width: 53px; + height: 26px; +} + +#powered-by-logo[class^="es-"] { + background-image: url("../img/movistar.png"); + background-size: 92px 20px; + width: 92px; + height: 20px; +} + +@media (min-resolution: 2dppx) { + #powered-by-logo { + background-image: url("../img/telefonica@2x.png"); + } + + #powered-by-logo.en-GB, + #powered-by-logo.de-DE { + background-image: url("../img/02@2x.png"); + } + + #powered-by-logo.pt-BR { + background-image: url("../img/vivo@2x.png"); + } + + #powered-by-logo[class^="es-"] { + background-image: url("../img/movistar@2x.png"); + } +} + +.terms-service > a { color: #00caee; } diff --git a/browser/components/loop/content/shared/img/02.png b/browser/components/loop/content/shared/img/02.png new file mode 100644 index 000000000000..fbec03c9aa49 Binary files /dev/null and b/browser/components/loop/content/shared/img/02.png differ diff --git a/browser/components/loop/content/shared/img/02@2x.png b/browser/components/loop/content/shared/img/02@2x.png new file mode 100644 index 000000000000..7cb2c79946e5 Binary files /dev/null and b/browser/components/loop/content/shared/img/02@2x.png differ diff --git a/browser/components/loop/content/shared/img/movistar.png b/browser/components/loop/content/shared/img/movistar.png new file mode 100644 index 000000000000..7a293ac9f09d Binary files /dev/null and b/browser/components/loop/content/shared/img/movistar.png differ diff --git a/browser/components/loop/content/shared/img/movistar@2x.png b/browser/components/loop/content/shared/img/movistar@2x.png new file mode 100644 index 000000000000..e48c477cf7cb Binary files /dev/null and b/browser/components/loop/content/shared/img/movistar@2x.png differ diff --git a/browser/components/loop/content/shared/img/telefonica.png b/browser/components/loop/content/shared/img/telefonica.png new file mode 100644 index 000000000000..104990416edc Binary files /dev/null and b/browser/components/loop/content/shared/img/telefonica.png differ diff --git a/browser/components/loop/content/shared/img/telefonica@2x.png b/browser/components/loop/content/shared/img/telefonica@2x.png new file mode 100644 index 000000000000..c07523e76efa Binary files /dev/null and b/browser/components/loop/content/shared/img/telefonica@2x.png differ diff --git a/browser/components/loop/content/shared/img/vivo.png b/browser/components/loop/content/shared/img/vivo.png new file mode 100644 index 000000000000..26d37c291502 Binary files /dev/null and b/browser/components/loop/content/shared/img/vivo.png differ diff --git a/browser/components/loop/content/shared/img/vivo@2x.png b/browser/components/loop/content/shared/img/vivo@2x.png new file mode 100644 index 000000000000..0aee3f8d1935 Binary files /dev/null and b/browser/components/loop/content/shared/img/vivo@2x.png differ diff --git a/browser/components/loop/jar.mn b/browser/components/loop/jar.mn index f7cf4b518d83..d69d0b97baf0 100644 --- a/browser/components/loop/jar.mn +++ b/browser/components/loop/jar.mn @@ -55,6 +55,14 @@ browser.jar: content/browser/loop/shared/img/icons-10x10.svg (content/shared/img/icons-10x10.svg) content/browser/loop/shared/img/icons-14x14.svg (content/shared/img/icons-14x14.svg) content/browser/loop/shared/img/icons-16x16.svg (content/shared/img/icons-16x16.svg) + content/browser/loop/shared/img/movistar.png (content/shared/img/movistar.png) + content/browser/loop/shared/img/movistar@2x.png (content/shared/img/movistar@2x.png) + content/browser/loop/shared/img/vivo.png (content/shared/img/vivo.png) + content/browser/loop/shared/img/vivo@2x.png (content/shared/img/vivo@2x.png) + content/browser/loop/shared/img/02.png (content/shared/img/02.png) + content/browser/loop/shared/img/02@2x.png (content/shared/img/02@2x.png) + content/browser/loop/shared/img/telefonica.png (content/shared/img/telefonica.png) + content/browser/loop/shared/img/telefonica@2x.png (content/shared/img/telefonica@2x.png) # Shared scripts content/browser/loop/shared/js/actions.js (content/shared/js/actions.js)