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 id1
push userroot
push dateMon, 20 Oct 2014 17:29:22 +0000
reviewersfryn
bugs841511
milestone22.0a1
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 {