Bug 1568866 - Update send to device panel for skyline r=markh

Differential Revision: https://phabricator.services.mozilla.com/D40049

--HG--
extra : moz-landing-system : lando
This commit is contained in:
Vijay Budhram 2019-08-06 15:00:30 +00:00
parent 93e82cb323
commit 88444d1f53
6 changed files with 47 additions and 0 deletions

View File

@ -253,6 +253,20 @@ var gSync = {
},
showSendToDeviceViewFromFxaMenu(anchor) {
const { status } = UIState.get();
if (status === UIState.STATUS_NOT_CONFIGURED) {
PanelUI.showSubView("PanelUI-fxa-menu-sendtab-not-configured", anchor);
return;
}
if (
this.sendTabConfiguredAndLoading ||
this.sendTabTargets.length <= 0
) {
PanelUI.showSubView("PanelUI-fxa-menu-sendtab-no-devices", anchor);
return;
}
this.showSendToDeviceView(anchor);
this.emitFxaToolbarTelemetry("send_tab", anchor);
},

View File

@ -794,6 +794,26 @@
oncommand="gSync.openSendFromFxaMenu(this);"/>
</vbox>
</panelview>
<panelview id="PanelUI-fxa-menu-sendtab-not-configured" flex="1" class="PanelUI-subView">
<vbox id="PanelUI-fxa-sendtab-not-configured" align="center" class="panel-subview-body">
<image class="fxaSendToDeviceLogo" role="presentation"/>
<label class="PanelUI-fxa-service-description-label">&fxa.service.sendTab.description;</label>
<toolbarbutton id="PanelUI-fxa-menu-sendtab-not-configured-button"
class="PanelUI-fxa-signin-button"
label="&fxa.menu.signin.label;"
oncommand="gSync.openFxAEmailFirstPageFromFxaMenu(this);"/>
</vbox>
</panelview>
<panelview id="PanelUI-fxa-menu-sendtab-no-devices" flex="1" class="PanelUI-subView">
<vbox id="PanelUI-fxa-sendtab-no-devices" align="center" class="panel-subview-body">
<image class="fxaSendToDeviceLogo" role="presentation"/>
<label class="PanelUI-fxa-service-description-label">&fxa.service.sendTab.description;</label>
<toolbarbutton id="PanelUI-fxa-menu-sendtab-connect-device-button"
class="PanelUI-fxa-signin-button"
label="&appMenuRemoteTabs.connectdevice.label;"
oncommand="gSync.openConnectAnotherDeviceFromFxaMenu(this);"/>
</vbox>
</panelview>
<panelview id="PanelUI-bookmarkingTools" class="PanelUI-subView">
<vbox class="panel-subview-body">

View File

@ -112,6 +112,7 @@ convenience of Safari and Chrome users on macOS. See bug 1398988. -->
<!ENTITY fxa.service.send.launch "Launch &sendShortName;">
<!ENTITY fxa.service.monitor.description "Check if your email has appeared in a data breach and get alerted if it appears in a new breach.">
<!ENTITY fxa.service.monitor.launch "Launch &monitorShortName;">
<!ENTITY fxa.service.sendTab.description "Send a tab instantly to any device you're signed in on.">
<!-- LOCALIZATION NOTE (fullscreenWarning.beforeDomain.label,
fullscreenWarning.afterDomain.label): these two strings are used

View File

@ -786,6 +786,13 @@ panelmultiview[mainViewId="PanelUI-fxa"] #PanelUI-remotetabs-syncnow {
width: 80px;
}
.fxaSendToDeviceLogo {
margin-top: 15px;
height: 119px;
width: 164px;
list-style-image: url(chrome://browser/skin/fxa/send-to-device.svg);
}
.fxaSendLogo {
list-style-image: url(chrome://browser/content/logos/send.svg);
}

View File

@ -0,0 +1,4 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg viewBox="0 0 164 119" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><radialGradient id="b" cx="-309.624" cy="363.081" gradientTransform="matrix(117 0 0 -117 36334.738 42578)" gradientUnits="userSpaceOnUse" r=".951"><stop offset=".4" stop-color="#cdcdd4" stop-opacity="0"/><stop offset=".58" stop-color="#cdcdd4" stop-opacity=".02"/><stop offset=".77" stop-color="#cdcdd4" stop-opacity=".08"/><stop offset=".96" stop-color="#cdcdd4" stop-opacity=".18"/><stop offset="1" stop-color="#cdcdd4" stop-opacity=".2"/></radialGradient><radialGradient id="c" cx="-300.138" cy="354.335" gradientTransform="matrix(27 0 0 -27 8164.136 9661.001)" gradientUnits="userSpaceOnUse" r="3.274"><stop offset=".26" stop-color="#cdcdd4" stop-opacity="0"/><stop offset=".4" stop-color="#cdcdd4" stop-opacity=".02"/><stop offset=".55" stop-color="#cdcdd4" stop-opacity=".08"/><stop offset=".69" stop-color="#cdcdd4" stop-opacity=".18"/><stop offset=".72" stop-color="#cdcdd4" stop-opacity=".2"/></radialGradient><radialGradient id="d" cx="-305.732" cy="357.242" gradientTransform="matrix(40 0 0 -40 12282.452 14394)" gradientUnits="userSpaceOnUse" r="3.229"><stop offset=".27" stop-color="#cdcdd4" stop-opacity="0"/><stop offset=".46" stop-color="#cdcdd4" stop-opacity=".02"/><stop offset=".66" stop-color="#cdcdd4" stop-opacity=".08"/><stop offset=".86" stop-color="#cdcdd4" stop-opacity=".18"/><stop offset=".9" stop-color="#cdcdd4" stop-opacity=".2"/></radialGradient><linearGradient id="a"><stop offset=".22" stop-color="#b833e1"/><stop offset=".91" stop-color="#ff4f5e"/></linearGradient><linearGradient id="e" gradientTransform="matrix(47 0 0 -75 14493.74 27225)" gradientUnits="userSpaceOnUse" x1="-306.295" x2="-305.345" xlink:href="#a" y1="361.401" y2="363.112"/><linearGradient id="f" gradientTransform="matrix(13 0 0 -5 3838.739 1639)" gradientUnits="userSpaceOnUse" x1="-290.414" x2="-286.415" xlink:href="#a" y1="315.51" y2="317.029"/><linearGradient id="g" gradientTransform="matrix(28 0 0 -36 8546.74 12970)" gradientUnits="userSpaceOnUse" x1="-301.569" x2="-301.162" y1="358.334" y2="358.927"><stop offset="0" stop-color="#ff298a"/><stop offset="1" stop-color="#ff6a75"/></linearGradient><circle cx="85.2" cy="60.5" fill="url(#b)" r="58.5"/><path d="M47.7 43.9c0 4.5-3.6 8.1-8.2 8.1H6.8c-3.4-.1-6-2.9-6-6.2s2.7-6.1 6-6.2c.5 0 1 .1 1.5.2-.1-.5-.2-1-.2-1.4 0-2.4 1.3-4.6 3.4-5.7s4.7-1 6.7.4c1.4-5.2 6.5-8.6 11.9-7.9s9.5 5.2 9.5 10.6c4.5 0 8.2 3.6 8.1 8.1z" fill="url(#c)"/><path d="M154.1 21.6c-.8 0-1.5.1-2.2.3.9-3.8-.7-7.8-4-10s-7.6-2.2-10.9 0C134.9 4.1 127.3-.9 119.2.1S105 7.9 105 15.9c-6.8 0-12.2 5.4-12.2 12s5.5 12 12.2 12h49.2c3.4.1 6.6-1.6 8.3-4.5s1.7-6.5 0-9.3-5-4.6-8.4-4.5z" fill="url(#d)"/><path d="M77.7 74.8V41.4c0-1.9-1.5-3.4-3.4-3.4H29.1c-1.9 0-3.4 1.5-3.4 3.4v32.3c0 1.9 1.5 3.4 3.4 3.4h46.3c1.3-.1 2.3-1.1 2.3-2.3zm-2.2-32.3H27.8v-1.1c0-.6.5-1.1 1.1-1.1h45.4c.6 0 1.1.5 1.1 1.1z" fill="#b1b1bc"/><path d="M101.1 21h36.2c3 0 5.4 2.4 5.4 5.4v64.2c0 3-2.4 5.4-5.4 5.4h-36.2c-3 0-5.4-2.4-5.4-5.4V26.4c0-3 2.5-5.4 5.4-5.4z" fill="url(#e)"/><path d="M123.7 91h-8v-3h8z" fill="#ff848b"/><path d="M85.1 55c-1.3.1-2.4 1.2-2.4 2.5s1.1 2.4 2.4 2.5h10.6v-5z" fill="url(#f)"/><path d="M123 56.1l-15.5-15.4c-1-1-2.6-1-3.7 0-1 1-1 2.6 0 3.6l11.1 11H95.7v5.1h19.1l-11.1 11c-.7.6-.9 1.6-.7 2.5s.9 1.6 1.8 1.8 1.8 0 2.5-.6l.1-.1L123 59.8c.5-.5.8-1.1.8-1.8s-.3-1.4-.8-1.9z" fill="url(#g)"/></svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

View File

@ -132,6 +132,7 @@
skin/classic/browser/fxa/fxa-spinner.svg (../shared/fxa/fxa-spinner.svg)
skin/classic/browser/fxa/sync-illustration.svg (../shared/fxa/sync-illustration.svg)
skin/classic/browser/fxa/sync-illustration-issue.svg (../shared/fxa/sync-illustration-issue.svg)
skin/classic/browser/fxa/send-to-device.svg (../shared/fxa/send-to-device.svg)
skin/classic/browser/fxa/avatar.svg (../shared/fxa/avatar.svg)
skin/classic/browser/fxa/avatar-color.svg (../shared/fxa/avatar-color.svg)