Bug 1637617 - Adjusted message margins to prevent panel closing; added panel header to main view panel & updated fluent strings r=andreio,fluent-reviewers,flod
authoremcminn <emcminn@mozilla.com>
Wed, 03 Jun 2020 18:25:02 +0000
changeset 597847 63d2be009e8d39ed00866c3299d0eae19cd736bb
parent 597846 98d02ae1933f1fc95ace2a25367a909eb13f62bb
child 597848 becb52cac8b505e27e1a1f1f42a33b97aa8f49f2
push id13310
push userffxbld-merge
push dateMon, 29 Jun 2020 14:50:06 +0000
treeherdermozilla-beta@15a59a0afa5c [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersandreio, fluent-reviewers, flod
bugs1637617
milestone79.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 1637617 - Adjusted message margins to prevent panel closing; added panel header to main view panel & updated fluent strings r=andreio,fluent-reviewers,flod Differential Revision: https://phabricator.services.mozilla.com/D76162
browser/components/customizableui/content/panelUI.inc.xhtml
browser/locales/en-US/browser/appmenu.ftl
browser/themes/shared/customizableui/panelUI.inc.css
python/l10n/fluent_migrations/bug_1637617_whatsnew_panel_header.py
--- a/browser/components/customizableui/content/panelUI.inc.xhtml
+++ b/browser/components/customizableui/content/panelUI.inc.xhtml
@@ -970,16 +970,19 @@
                        label-show="&viewBookmarksToolbar.label;"
                        label-hide="&hideBookmarksToolbar.label;"
                        oncommand="BookmarkingUI.toggleBookmarksToolbar();"/>
       </vbox>
     </panelview>
 
     <panelview id="PanelUI-whatsNew" class="PanelUI-subView">
       <vbox class="panel-subview-body">
+        <box id="PanelUI-whatsNew-title" class="panel-header">
+          <label data-l10n-id="whatsnew-panel-header"/>
+        </box>
         <toolbaritem id="PanelUI-whatsNew-content"
                      orient="vertical"
                      smoothscroll="false">
           <html:div id="PanelUI-whatsNew-message-container" role="document">
             <!-- What's New messages will be rendered here -->
           </html:div>
         </toolbaritem>
       </vbox>
--- a/browser/locales/en-US/browser/appmenu.ftl
+++ b/browser/locales/en-US/browser/appmenu.ftl
@@ -17,13 +17,15 @@ appmenuitem-zoom-reduce =
 
 ## Firefox Account toolbar button and Sync panel in App menu.
 
 fxa-toolbar-sync-now =
     .label = Sync Now
 
 ## What's New panel in App menu.
 
+whatsnew-panel-header = What’s New
+
 # Checkbox displayed at the bottom of the What's New panel, allowing users to
 # enable/disable What's New notifications.
 whatsnew-panel-footer-checkbox =
   .label = Notify about new features
   .accesskey = f
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -1851,16 +1851,21 @@ toolbarpaletteitem[place="menu-panel"] >
   display: block;
   margin: 12px 0;
 }
 
 panelview[mainview] #PanelUI-whatsNew-content {
   height: 43em;
 }
 
+/* Hide the What's New header when the panel is a subview */
+panelview:not([mainview]) #PanelUI-whatsNew-title {
+  display: none;
+}
+
 #PanelUI-whatsNew .panel-subview-body {
   padding-top: 0;
 }
 
 #PanelUI-whatsNew .panelMenu-toggleWhatsNew-checkbox {
   background-color: var(--arrowpanel-dimmed);
   border-top: 1px solid var(--panel-separator-color);
   padding-inline-start: 18px;
@@ -1894,33 +1899,33 @@ panelview[mainview] #PanelUI-whatsNew-co
 #PanelUI-whatsNew .checkbox-check {
   -moz-appearance: none;
   width: 20px;
   height: 20px;
   padding: 1px;
   border: 1px solid #A9A9A9;
   border-radius: 2px;
   margin: 0;
-  margin-inline-end: 10px;
+  margin-inline-end: 6px;
   background-color: #FFF;
   background-position: center;
   background-repeat: no-repeat;
 }
 
 #PanelUI-whatsNew checkbox:hover .checkbox-check {
   border-color: #0a84ff;
 }
 
 #PanelUI-whatsNew .checkbox-icon {
   display: none;
 }
 
 #PanelUI-whatsNew .whatsNew-message {
   cursor: pointer;
-  margin: 0 12px;
+  margin: 0;
   padding: 0;
 }
 
 /* The following 2 rules show a 1 pixel line separator between What's New
  * messages while at the same time ensuring that the first message (which has
  * a date header) will not show the separator
  */
 #PanelUI-whatsNew .whatsNew-message-body::before {
@@ -1935,22 +1940,24 @@ panelview[mainview] #PanelUI-whatsNew-co
 #PanelUI-whatsNew .whatsNew-message-date + .whatsNew-message-body::before {
   display: none;
 }
 
 #PanelUI-whatsNew .whatsNew-message-date {
   font-size: .85em;
   margin: -12px;
   margin-top: 0;
+  margin-inline-start: 0;
   padding: 6px 16px;
   background: var(--arrowpanel-dimmed);
 }
 
 #PanelUI-whatsNew .whatsNew-message-body {
-  padding: 6px 6px 10px;
+  padding: 5px 0 10px;
+  margin-inline-start: 12px;
   text-align: inherit;
   text-decoration: none;
   color: inherit;
   background: none;
   border: none;
   cursor: pointer;
 }
 
@@ -1965,17 +1972,17 @@ panelview[mainview] #PanelUI-whatsNew-co
   display: flex;
   flex-direction: column;
 }
 
 #PanelUI-whatsNew .whatsNew-message-icon {
   inset-inline-end: 6px;
   height: 32px;
   position: absolute;
-  top: 22px;
+  top: 24px;
   width: 32px;
 }
 
 #PanelUI-whatsNew .whatsNew-message-title,
 #protections-popup-message .whatsNew-message-title {
   display: block;
   padding-inline-end: 46px;
   font-size: 1.3em;
@@ -1994,17 +2001,17 @@ panelview[mainview] #PanelUI-whatsNew-co
   margin: 2px 0;
   font-size: .8em;
   color: #949494;
   font-weight: normal;
 }
 
 #PanelUI-whatsNew .whatsNew-message-content {
   display: block;
-  margin: 10px 0;
+  margin: 5px 0 10px;
 }
 
 #PanelUI-whatsNew .text-link {
   background: none;
   border: 0;
   color: #45a1ff;
   cursor: pointer;
   font-size: .9em;
new file mode 100644
--- /dev/null
+++ b/python/l10n/fluent_migrations/bug_1637617_whatsnew_panel_header.py
@@ -0,0 +1,19 @@
+# coding=utf8
+
+# Any copyright is dedicated to the Public Domain.
+# http://creativecommons.org/publicdomain/zero/1.0/
+
+from __future__ import absolute_import
+from fluent.migrate.helpers import transforms_from
+
+
+def migrate(ctx):
+    """Bug 1637617 - Adjusted message margins to prevent panel closing; added panel header to main view panel, part {index}."""
+
+    ctx.add_transforms(
+        "browser/browser/appmenu.ftl",
+        "browser/browser/appmenu.ftl",
+        transforms_from("""
+whatsnew-panel-header = { COPY_PATTERN(from_path, "cfr-whatsnew-panel-header") }
+""", from_path="browser/browser/newtab/asrouter.ftl"))
+    
\ No newline at end of file