Bug 841511 - Cleanup and organize existing browser flyout settings and css. r=fryn
authorJim Mathies <jmathies@mozilla.com>
Tue, 26 Feb 2013 17:09:42 -0600
changeset 123100 9718c678cdde34ae45a29cced2a120658d92d744
parent 123099 2b4e9accde67792df7a247ab097ba0a75459ad4c
child 123101 4454f18d71bfb145cc1208be1db147a951560970
push id24372
push useremorley@mozilla.com
push dateWed, 27 Feb 2013 13:22:59 +0000
treeherdermozilla-central@0a91da5f5eab [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersfryn
bugs841511
milestone22.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 841511 - Cleanup and organize existing browser flyout settings and css. r=fryn
browser/metro/base/content/browser.xul
browser/metro/locales/en-US/chrome/browser.dtd
browser/metro/locales/en-US/chrome/browser.properties
browser/metro/locales/en-US/chrome/preferences.dtd
browser/metro/profile/metro.js
browser/metro/theme/browser.css
browser/metro/theme/platform.css
--- a/browser/metro/base/content/browser.xul
+++ b/browser/metro/base/content/browser.xul
@@ -414,61 +414,68 @@
             </hbox>
           </vbox>
 
           <richlistbox id="console-box" class="panel-list console-box" flex="1" onkeypress="ConsolePanelView.onConsoleBoxKeyPress(event)" oncontextmenu="ConsolePanelView.onContextMenu(event);"/>
         </vbox>
       </deck>
     </vbox>
 
-    <flyoutpanel id="about-flyoutpanel" headertext="&aboutHeader.label;">
-        <label id="about-product-label" value="&aboutHeaderProduct.label;"/>
-        <label value="&aboutHeaderCompany.label;"/>
+    <flyoutpanel id="about-flyoutpanel" headertext="&aboutHeader.title;">
+        <label id="about-product-label" value="&aboutHeader.product.label;"/>
+        <label value="&aboutHeader.company.label;"/>
 #expand <label id="about-version-label">__MOZ_APP_VERSION__</label>
         <label id="about-policy-label"
                onclick="if (event.button == 0) { Browser.onAboutPolicyClick(); }"
-               class="text-link" value="&aboutHeaderPolicy.label;"/>
+               class="text-link" value="&aboutHeader.policy.label;"/>
     </flyoutpanel>
 
-    <flyoutpanel id="prefs-flyoutpanel" headertext="&optionsHeader.label;">
-      <settings id="prefs-startup" label="&startup.title;">
-        <setting id="prefs-homepage" title="&homepage.title;" type="menulist" pref="browser.startup.sessionRestore" class="setting-expanded">
+    <flyoutpanel id="prefs-flyoutpanel" headertext="&optionsHeader.title;">
+      <settings id="prefs-startup" label="&optionsHeader.startup.title;"> <!-- note, this element has a custom margin-top -->
+        <setting id="prefs-homepage" title="&optionsHeader.homepage.title;" type="menulist" pref="browser.startup.sessionRestore" class="setting-expanded">
           <menulist id="prefs-homepage-options">
-            <menupopup position="after_end">
-              <menuitem id="prefs-homepage-default" label="&homepage.startPage;" value="false"/>
-              <menuitem id="prefs-homepage-session" label="&homepage.sessionRestore;" value="true"/>
+            <menupopup id="prefs-homepage-popup" position="after_end">
+              <menuitem id="prefs-homepage-default" label="&optionsHeader.homepage.startPage.button;" value="false"/>
+              <menuitem id="prefs-homepage-session" label="&optionsHeader.homepage.sessionRestore.button;" value="true"/>
             </menupopup>
           </menulist>
         </setting>
       </settings>
-      <setting pref="browser.tabs.tabsOnly" title="&toggleTabsOnly.label;" type="bool"/>
+      <setting pref="browser.tabs.tabsOnly" title="&optionsHeader.tabs.title;" type="bool"/>
+      <settings id="prefs-charencoding" label="&optionsHeader.char.title;">
+        <setting pref="browser.menu.showCharacterEncoding" title="&optionsHeader.char.options.label;" type="bool"/>
+      </settings>
+      <settings id="prefs-privdata" label="&optionsHeader.privacy.clearPrivateData.title;">
+        <setting title="&optionsHeader.privacy.clearPrivateData.label;" type="control">
+          <button id="prefs-clear-data" label="&optionsHeader.privacy.clearPrivateData.button;" command="cmd_sanitize"/>
+        </setting>
+      </settings>
+      <setting pref="signon.rememberSignons" title="&optionsHeader.privacy.passwords.label;" type="bool"/>
+      <settings id="prefs-donottrack" label="&optionsHeader.privacy.doNotTrack.title;">
+        <setting pref="privacy.donottrackheader.enabled" title="&optionsHeader.privacy.doNotTrack.label;" type="bool"/>
+      </settings>
+
+      <setting id="prefs-master-password" title="&optionsHeader.privacy.masterPassword.label;" type="bool" oncommand="MasterPasswordUI.show(this.value);"/>
+
       <settings id="prefs-sync" label="&sync.title;">
         <setting id="sync-connect" title="&sync.notconnected;" type="control">
           <button label="&sync.connect;" oncommand="WeaveGlue.tryConnect();" />
         </setting>
         <setting id="sync-connected" class="setting-group" title="&sync.connected;" type="control" collapsed="true">
           <button id="sync-pairdevice" label="&sync.pair.title;" oncommand="SyncPairDevice.open();" />
           <button id="sync-details" label="&sync.details;" type="checkbox" autocheck="false" checked="false" oncommand="WeaveGlue.showDetails();" />
         </setting>
         <setting id="sync-sync" class="setting-subgroup" type="control" collapsed="true">
           <button id="sync-syncButton" label="&sync.syncNow;" oncommand="WeaveGlue.sync();"/>
         </setting>
         <setting id="sync-device" class="setting-subgroup" type="string" title="&sync.deviceName;" onchange="WeaveGlue.changeName(this);" collapsed="true"/>
         <setting id="sync-disconnect" class="setting-subgroup" type="control" collapsed="true">
           <button label="&sync.disconnect;" oncommand="WeaveGlue.disconnect();" />
         </setting>
       </settings>
-      <settings id="prefs-privacy" label="&privacy.title;">
-        <setting pref="signon.rememberSignons" title="&rememberPasswords.title;" type="bool"/>
-        <setting pref="privacy.donottrackheader.enabled" title="&doNotTrack.title;" type="bool"/>
-        <setting id="prefs-master-password" title="&masterPassword.title;" type="bool" oncommand="MasterPasswordUI.show(this.value);"/>
-        <setting title="&clearPrivateData2.title;" type="control">
-          <button id="prefs-clear-data" label="&clearPrivateData.button;" command="cmd_sanitize"/>
-        </setting>
-      </settings>
     </flyoutpanel>
 
     <!-- Form Helper form validation helper popup -->
     <arrowbox id="form-helper-validation-container" class="arrowbox-dark" flex="1" hidden="true" offset="0" top="0" left="0">
       <label/>
     </arrowbox>
 
 #ifdef MOZ_SERVICES_SYNC
--- a/browser/metro/locales/en-US/chrome/browser.dtd
+++ b/browser/metro/locales/en-US/chrome/browser.dtd
@@ -2,17 +2,16 @@
    - 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/. -->
 
 <!ENTITY urlbar.emptytext      "Enter Search or Address">
 <!ENTITY urlbar.accesskey      "d">
 
 <!ENTITY back.label            "Back">
 <!ENTITY forward.label         "Forward">
-<!ENTITY toggleTabsOnly.label  "Always show tabs">
 <!ENTITY showTabs.label        "Show Tabs">
 <!ENTITY newtab.label          "New Tab">
 <!ENTITY closetab.label        "Close Tab">
 <!ENTITY undoclosetab.label    "Undo Close Tab">
 
 <!ENTITY appbarFindInPage.label    "Find in Page">
 <!ENTITY appbarViewOnDesktop.label "View on Desktop">
 
--- a/browser/metro/locales/en-US/chrome/browser.properties
+++ b/browser/metro/locales/en-US/chrome/browser.properties
@@ -94,22 +94,16 @@ tabs.closeWarningTitle=Confirm close
 # See: http://developer.mozilla.org/en/docs/Localization_and_Plurals
 # #1 number of tabs (must be greater than 1)
 tabs.closeWarning=NOT USED;You are about to close #1 tabs. Continue?
 
 tabs.closeButton=Close tabs
 tabs.closeWarningPromptMe=Warn me when I attempt to close multiple tabs
 tabs.emptyTabTitle=New Tab
 
-# Homepage
-# LOCALIZATION NOTE: homepage.custom2 is the text displayed on the selector button if
-# the user selects a webpage to be the startpage. We can't display the entire URL
-# or webpage title on the menulist
-homepage.custom2=Custom Page
-
 # "Clear Permissions" items
 pageactions.geolocation=Location
 pageactions.popup=Popups
 pageactions.offline-app=Offline Storage
 pageactions.password=Password
 pageactions.desktop-notification=Web Notifications
 pageactions.openWebappsManage=Manage Web Apps
 
@@ -117,27 +111,15 @@ pageactions.openWebappsManage=Manage Web
 opensearch.search=Search: %S
 
 # Open in Another App
 # LOCALIZATION NOTE: openinapp.specific is the text displayed if there is a single external app
 # %S is the name of the app, like "YouTube" or "Picassa"
 openinapp.specific=Open in %S App
 openinapp.general=Open in Another App
 
-# Clear Private Data
-clearPrivateData.title=Clear Private Data
-clearPrivateData.message=Delete your browsing history and settings, including passwords and cookies?
-
-# LOCALIZATION NOTE (browser.menu.showCharacterEncoding): Set to the string
-# "true" (spelled and capitalized exactly that way) to show the "Character
-# Encoding" menu in the site menu. Any other value will hide it. Without this
-# setting, the "Character Encoding" menu must be enabled via Preferences.
-# This is not a string to translate. If users frequently use the "Character Encoding"
-# menu, set this to "true". Otherwise, you can leave it as "false".
-browser.menu.showCharacterEncoding=false
-
 # LOCALIZATION NOTE (intl.charsetmenu.browser.static): Set to a series of comma separated
 # values for charsets that the user can select from in the Character Encoding menu.
 intl.charsetmenu.browser.static=iso-8859-1,utf-8,x-gbk,big5,iso-2022-jp,shift_jis,euc-jp
 
 # Selection alerts
 selectionHelper.textCopied=Text copied to clipboard
 selectionHelper.linkCopied=Link copied to clipboard
--- a/browser/metro/locales/en-US/chrome/preferences.dtd
+++ b/browser/metro/locales/en-US/chrome/preferences.dtd
@@ -1,19 +1,29 @@
 <!-- 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/. -->
 
-<!ENTITY optionsHeader.label                       "Options">
-<!ENTITY aboutHeader.label                         "About">
-<!ENTITY aboutHeaderProduct.label                  "&brandShortName;">
-<!ENTITY aboutHeaderCompany.label                  "By &vendorShortName;">
-<!ENTITY aboutHeaderPolicy.label                   "Read the &brandShortName; privacy policy online">
-<!ENTITY privacy.title                             "Privacy &amp; Security">
-<!ENTITY doNotTrack.title                          "Tell sites not to track me">
-<!ENTITY masterPassword.title                      "Use master password">
-<!ENTITY clearPrivateData2.title                   "Clear private data">
-<!ENTITY clearPrivateData.button                   "Clear">
-<!ENTITY rememberPasswords.title                   "Remember passwords">
-<!ENTITY startup.title                             "Startup">
-<!ENTITY homepage.title                            "When &brandShortName; starts, show">
-<!ENTITY homepage.startPage                        "Start page">
-<!ENTITY homepage.sessionRestore                   "Tabs from last time">
+<!-- ## About Flyout Panel ## -->
+<!ENTITY aboutHeader.title                                       "About">
+<!ENTITY aboutHeader.product.label                               "&brandShortName;">
+<!ENTITY aboutHeader.company.label                               "By &vendorShortName;">
+<!ENTITY aboutHeader.policy.label                                "Read the &brandShortName; privacy policy online">
+
+<!-- ## Options Flyout Panel ## -->
+<!ENTITY optionsHeader.title                                     "Options">
+<!ENTITY optionsHeader.startup.title                             "Startup">
+<!ENTITY optionsHeader.homepage.title                            "When &brandShortName; starts, show">
+<!ENTITY optionsHeader.homepage.startPage.button                 "start page">
+<!ENTITY optionsHeader.homepage.sessionRestore.button            "tabs from last time">
+<!ENTITY optionsHeader.tabs.title                                "Always Show Tabs">
+<!ENTITY optionsHeader.char.title                                "Character Encoding">
+<!ENTITY optionsHeader.char.autodetect.label                     "Auto-detect">
+<!ENTITY optionsHeader.char.options.label                        "Show encoding options on the App Bar">
+<!ENTITY optionsHeader.privacy.clearPrivateData.title            "Clear Private Data">
+<!ENTITY optionsHeader.privacy.clearPrivateData.label            "Clear your browsing history, passwords, cookies, and form data on this device">
+<!ENTITY optionsHeader.privacy.clearPrivateData.button           "Clear">
+<!ENTITY optionsHeader.privacy.passwords.label                   "Remember Passwords">
+<!ENTITY optionsHeader.privacy.doNotTrack.title                  "Tracking">
+<!ENTITY optionsHeader.privacy.doNotTrack.label                  "Tell websites not to track me">
+<!ENTITY optionsHeader.privacy.masterPassword.label              "Use Master Password">
+<!-- see sync.dtd -->
+
--- a/browser/metro/profile/metro.js
+++ b/browser/metro/profile/metro.js
@@ -218,19 +218,18 @@ pref("accessibility.typeaheadfind.casese
 // Trun on F7 caret browsing hot key
 pref("accessibility.browsewithcaret_shortcut.enabled", true);
 pref("accessibility.browsewithcaret", false);
 
 // Whether or not we show a dialog box informing the user that the update was
 // successfully applied.
 pref("app.update.showInstalledUI", false);
 
-// Whether the character encoding menu is under the main Firefox button. This
-// preference is a string so that localizers can alter it.
-pref("browser.menu.showCharacterEncoding", "chrome://browser/locale/browser.properties");
+// Whether the character encoding options are displayed in the app bar.
+pref("browser.menu.showCharacterEncoding", false);
 pref("intl.charsetmenu.browser.static", "chrome://browser/locale/browser.properties");
 
 // pointer to the default engine name
 pref("browser.search.defaultenginename", "chrome://browser/locale/browser.properties");
 
 // SSL error page behaviour
 pref("browser.ssl_override_behavior", 2);
 pref("browser.xul.error_pages.expert_bad_cert", false);
--- a/browser/metro/theme/browser.css
+++ b/browser/metro/theme/browser.css
@@ -550,43 +550,16 @@ appbar toolbarbutton[disabled="true"] {
 }
 #appbar toolbarbutton:hover {
   -moz-image-region: rect(40px, 200px, 80px, 160px);
 }
 #appbar toolbarbutton:active {
   -moz-image-region: rect(80px, 200px, 120px, 160px);
 }
 
-/* About flyout pane */
-
-#about-flyoutpanel {
-  width: 350px;
-  background-image:url('chrome://browser/skin/images/about-footer.png');
-  background-repeat: no-repeat;
-  background-attachment: fixed;
-  background-position: right bottom;
-}
-
-#about-flyoutpanel label.text-link {
-  text-decoration: none;
-  color: #1167bd;
-}
-
-#about-product-label {
- font-weight: bold;
-}
-
-#about-version-label {
- margin-top: 11pt;
-}
-
-#about-policy-label {
- margin-top: 24pt;
-}
-
 /* Application-Specific */
 #download-button {
   -moz-image-region: rect(0px, 40px, 40px, 0px) !important;
 }
 #download-button:hover {
   -moz-image-region: rect(40px, 40px, 80px, 0px) !important;
 }
 #download-button:active {
@@ -643,16 +616,120 @@ appbar toolbarbutton[disabled="true"] {
 #star-button:hover {
   -moz-image-region: rect(40px, 360px, 80px, 320px) !important;
 }
 #star-button:active,
 #star-button[checked="true"] {
   -moz-image-region: rect(80px, 360px, 120px, 320px) !important;
 }
 
+/* Flyouts ---------------------------------------------------------------- */
+
+/* don't add a margin to the very top settings entry in flyouts */
+flyoutpanel > settings:first-child {
+  margin-top: 0px;
+}
+
+/* About flyout pane */
+
+#about-flyoutpanel {
+  width: 350px;
+  background-image:url('chrome://browser/skin/images/about-footer.png');
+  background-repeat: no-repeat;
+  background-attachment: fixed;
+  background-position: right bottom;
+}
+
+#about-flyoutpanel label.text-link {
+  text-decoration: none;
+  color: #1167bd;
+}
+
+#about-product-label {
+ font-weight: bold;
+}
+
+#about-version-label {
+ margin-top: 11pt;
+}
+
+#about-policy-label {
+ margin-top: 24pt;
+}
+
+/* Preferences flyout */
+
+#prefs-flyoutpanel {
+  width: 400px;
+}
+
+/* Lay out each <setting> in a single row */
+setting {
+  min-height: @touch_row@; /* row size */
+  -moz-box-align: center;
+  -moz-box-orient: horizontal;
+}
+
+/* ...except for some exceptions */
+.setting-expanded {
+  -moz-box-align: start;
+  -moz-box-orient: vertical;
+}
+
+setting > vbox {
+  -moz-box-flex: 1;
+}
+
+settings {
+  margin-top: 32px;
+}
+
+.settings-title {
+  font-weight: bold;
+}
+
+/* <setting> elements that are not in a <settings> group get special treatment */
+#prefs-flyoutpanel > setting {
+  margin-top: 16px;
+}
+#prefs-flyoutpanel > setting .preferences-title {
+  font-weight: bold
+}
+
+setting[type="integer"] > .preferences-alignment,
+setting[type="string"] > .preferences-alignment {
+  -moz-box-flex: 3;
+}
+
+setting[type="file"] > .preferences-alignment,
+setting[type="directory"] > .preferences-alignment {
+  -moz-box-align: center;
+}
+
+#prefs-homepage-options, #prefs-homepage-popup {
+  min-width: 200px;
+}
+
+.options-box {
+  -moz-margin-start: 28px;  /* sized based on the 32px addon image */
+}
+
+.options-box > setting:last-child {
+  border-bottom: 0;
+}
+
+.preferences-description {
+  font-size: @font_small@ !important;
+  color: grey;
+}
+
+.preferences-description:empty {
+  display: none;
+}
+
 /* Start UI (Autocomplete + New Tab Page) ----------------------------------- */
 
 #start-container {
   display: none;
 }
 
 #start-container[startpage],
 #start-container[filtering] {
@@ -672,17 +749,17 @@ appbar toolbarbutton[disabled="true"] {
 
 /* if snapped, hide the fullscreen awesome screen, if viewstate is anything
  *  other than snapped, hide the snapped awesome screen */
 #start[viewstate="snapped"],
 #snapped-start:not([viewstate="snapped"]) {
   visibility: collapse;
 }
 
-/* Browser Content Ares ----------------------------------------------------- */
+/* Browser Content Areas ----------------------------------------------------- */
 
 /* Hide the browser while the start UI is visible */
 #content-viewport[startpage],
 #content-viewport[filtering] {
   visibility: collapse;
 }
 
 #browsers {
@@ -723,82 +800,16 @@ appbar toolbarbutton[disabled="true"] {
   margin: 0;
 }
 
 #panel-items {
   padding-top: 20px;
   -moz-padding-start: 88px;
 }
 
-/* Preferences Section - Panel UI ------------------------------------------ */
-
-#prefs-flyoutpanel {
-  width: 400px;
-}
-
-/* Lay out each <setting> in a single row */
-setting {
-  min-height: @touch_row@; /* row size */
-  -moz-box-align: center;
-  -moz-box-orient: horizontal;
-}
-
-/* ...except for some exceptions */
-.setting-expanded {
-  -moz-box-align: start;
-  -moz-box-orient: vertical;
-}
-
-setting > vbox {
-  -moz-box-flex: 1;
-}
-
-settings {
-  margin-top: 32px;
-}
-
-.settings-title {
-  font-weight: bold;
-}
-
-/* <setting> elements that are not in a <settings> group get special treatment */
-#prefs-flyoutpanel > setting {
-  margin-top: 16px;
-}
-#prefs-flyoutpanel > setting .preferences-title {
-  font-weight: bold
-}
-
-setting[type="integer"] > .preferences-alignment,
-setting[type="string"] > .preferences-alignment {
-  -moz-box-flex: 3;
-}
-
-setting[type="file"] > .preferences-alignment,
-setting[type="directory"] > .preferences-alignment {
-  -moz-box-align: center;
-}
-
-.options-box {
-  -moz-margin-start: 28px;  /* sized based on the 32px addon image */
-}
-
-.options-box > setting:last-child {
-  border-bottom: 0;
-}
-
-.preferences-description {
-  font-size: @font_small@ !important;
-  color: grey;
-}
-
-.preferences-description:empty {
-  display: none;
-}
-
 /* Console Section - Panel UI ---------------------------------------------- */
 
 #console-filter-warnings,
 #console-filter-messages {
   visibility: visible;
 }
 
 @media (max-width: 499px) {
--- a/browser/metro/theme/platform.css
+++ b/browser/metro/theme/platform.css
@@ -181,16 +181,17 @@ toolbarbutton[open="true"] {
   border-color: transparent;
 }
 
 /* Toggleswitch ------------------------------------------------------------ */
 
 checkbox.toggleswitch {
   margin: @metro_spacing_small@;
   min-height: @metro_spacing_normal@;
+  font-weight: bold;
 }
 
 checkbox.toggleswitch hbox {
   -moz-box-align: center;
 }
 
 checkbox.toggleswitch:not([checked]) .onlabel,
 checkbox.toggleswitch[checked] .offlabel {