Bug 733473 - Implement initial prerequisites for in-content preferences, and landing page. r=bmcbride
authorJon Rietveld <jon.rietveld@gmail.com>
Tue, 08 May 2012 19:10:25 -0700
changeset 93571 f1148c7cd5e39816e31fe8ed6620aebce05d0075
parent 93570 6793673018a9f8928ef1008c9414ecf8ead989a5
child 93572 b2d23fc61c6f0d6f5e41ba796518eb29ab720c7e
push id9210
push userjwein@mozilla.com
push dateWed, 09 May 2012 05:35:43 +0000
treeherdermozilla-inbound@8b195889f55c [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbmcbride
bugs733473
milestone15.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 733473 - Implement initial prerequisites for in-content preferences, and landing page. r=bmcbride
browser/components/about/AboutRedirector.cpp
browser/components/build/nsModule.cpp
browser/components/preferences/Makefile.in
browser/components/preferences/in-content/Makefile.in
browser/components/preferences/in-content/jar.mn
browser/components/preferences/in-content/landing.xul
browser/components/preferences/in-content/preferences.js
browser/components/preferences/in-content/preferences.xul
browser/locales/en-US/chrome/browser/preferences/preferences.dtd
browser/themes/gnomestripe/jar.mn
browser/themes/gnomestripe/preferences/in-content/preferences.css
browser/themes/pinstripe/jar.mn
browser/themes/pinstripe/preferences/in-content/preferences.css
browser/themes/winstripe/jar.mn
browser/themes/winstripe/preferences/in-content/preferences.css
--- a/browser/components/about/AboutRedirector.cpp
+++ b/browser/components/about/AboutRedirector.cpp
@@ -104,16 +104,18 @@ static RedirEntry kRedirMap[] = {
 #endif
   { "home", "chrome://browser/content/abouthome/aboutHome.xhtml",
     nsIAboutModule::URI_SAFE_FOR_UNTRUSTED_CONTENT |
     nsIAboutModule::ALLOW_SCRIPT },
   { "newtab", "chrome://browser/content/newtab/newTab.xul",
     nsIAboutModule::ALLOW_SCRIPT },
   { "permissions", "chrome://browser/content/preferences/aboutPermissions.xul",
     nsIAboutModule::ALLOW_SCRIPT },
+  { "preferences", "chrome://browser/content/preferences/in-content/preferences.xul",
+    nsIAboutModule::ALLOW_SCRIPT },
 };
 static const int kRedirTotal = NS_ARRAY_LENGTH(kRedirMap);
 
 static nsCAutoString
 GetAboutModuleName(nsIURI *aURI)
 {
   nsCAutoString path;
   aURI->GetPath(path);
--- a/browser/components/build/nsModule.cpp
+++ b/browser/components/build/nsModule.cpp
@@ -134,16 +134,17 @@ static const mozilla::Module::ContractID
     { NS_ABOUT_MODULE_CONTRACTID_PREFIX "sessionrestore", &kNS_BROWSER_ABOUT_REDIRECTOR_CID },
 #ifdef MOZ_SERVICES_SYNC
     { NS_ABOUT_MODULE_CONTRACTID_PREFIX "sync-tabs", &kNS_BROWSER_ABOUT_REDIRECTOR_CID },
     { NS_ABOUT_MODULE_CONTRACTID_PREFIX "sync-progress", &kNS_BROWSER_ABOUT_REDIRECTOR_CID },
 #endif
     { NS_ABOUT_MODULE_CONTRACTID_PREFIX "home", &kNS_BROWSER_ABOUT_REDIRECTOR_CID },
     { NS_ABOUT_MODULE_CONTRACTID_PREFIX "newtab", &kNS_BROWSER_ABOUT_REDIRECTOR_CID },
     { NS_ABOUT_MODULE_CONTRACTID_PREFIX "permissions", &kNS_BROWSER_ABOUT_REDIRECTOR_CID },
+    { NS_ABOUT_MODULE_CONTRACTID_PREFIX "preferences", &kNS_BROWSER_ABOUT_REDIRECTOR_CID },
 #if defined(XP_WIN) && !defined(__MINGW32__)
     { NS_IEHISTORYENUMERATOR_CONTRACTID, &kNS_WINIEHISTORYENUMERATOR_CID },
 #elif defined(XP_MACOSX)
     { NS_SHELLSERVICE_CONTRACTID, &kNS_SHELLSERVICE_CID },
 #endif
     { NS_PRIVATE_BROWSING_SERVICE_CONTRACTID, &kNS_PRIVATE_BROWSING_SERVICE_WRAPPER_CID },
     { NULL }
 };
--- a/browser/components/preferences/Makefile.in
+++ b/browser/components/preferences/Makefile.in
@@ -38,16 +38,20 @@
 
 DEPTH		= ../../..
 topsrcdir	= @top_srcdir@
 srcdir		= @srcdir@
 VPATH		= @srcdir@
 
 include $(DEPTH)/config/autoconf.mk
 
+PARALLEL_DIRS = \
+  in-content \
+  $(NULL)
+
 TEST_DIRS += tests
 
 include $(topsrcdir)/config/rules.mk
 
 DEFINES += \
 	-DMOZ_APP_NAME=$(MOZ_APP_NAME) \
 	-DMOZ_MACBUNDLE_NAME=$(MOZ_MACBUNDLE_NAME) \
 	$(NULL)
new file mode 100644
--- /dev/null
+++ b/browser/components/preferences/in-content/Makefile.in
@@ -0,0 +1,21 @@
+# -- 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/.
+
+DEPTH		= ../../../..
+topsrcdir	= @top_srcdir@
+srcdir		= @srcdir@
+VPATH		= @srcdir@
+
+include $(DEPTH)/config/autoconf.mk
+
+include $(topsrcdir)/config/rules.mk
+
+DEFINES += \
+	-DMOZ_APP_NAME=$(MOZ_APP_NAME) \
+	-DMOZ_MACBUNDLE_NAME=$(MOZ_MACBUNDLE_NAME) \
+	$(NULL)
+
+ifneq (,$(filter windows gtk2 cocoa, $(MOZ_WIDGET_TOOLKIT)))
+DEFINES += -DHAVE_SHELL_SERVICE=1
+endif
new file mode 100644
--- /dev/null
+++ b/browser/components/preferences/in-content/jar.mn
@@ -0,0 +1,4 @@
+browser.jar:
+*  content/browser/preferences/in-content/preferences.js
+   content/browser/preferences/in-content/landing.xul
+*  content/browser/preferences/in-content/preferences.xul
new file mode 100644
--- /dev/null
+++ b/browser/components/preferences/in-content/landing.xul
@@ -0,0 +1,59 @@
+<!-- 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/. -->
+
+<vbox data-category="landing">
+  <html:h1 class="indent-small">&brandShortName;</html:h1>
+
+  <hbox id="preferences-home" flex="1">
+
+    <button label="&paneGeneral.title;" class="landingButton"
+            oncommand="gotoPref('paneGeneral');">
+      <image class="landingButton-icon" type="general"/>
+      <label class="landingButton-label">&paneGeneral.title;</label>
+    </button>
+
+    <button label="&paneTabs.title;" class="landingButton"
+            oncommand="gotoPref('paneTabs');">
+      <image class="landingButton-icon" type="tabs"/>
+      <label class="landingButton-label">&paneTabs.title;</label>
+    </button>
+
+    <button label="&paneContent.title;" class="landingButton"
+            oncommand="gotoPref('paneContent');">
+      <image class="landingButton-icon" type="content"/>
+      <label class="landingButton-label">&paneContent.title;</label>
+    </button>
+
+    <button label="&paneApplications.title;" class="landingButton"
+            oncommand="gotoPref('paneApplications');">
+      <image class="landingButton-icon" type="applications"/>
+      <label class="landingButton-label">&paneApplications.title;</label>
+    </button>
+
+    <button label="&panePrivacy.title;" class="landingButton"
+            oncommand="gotoPref('panePrivacy');">
+      <image class="landingButton-icon" type="privacy"/>
+      <label class="landingButton-label">&panePrivacy.title;</label>
+    </button>
+
+    <button label="&paneSecurity.title;" class="landingButton"
+            oncommand="gotoPref('paneSecurity');">
+      <image class="landingButton-icon" type="security"/>
+      <label class="landingButton-label">&paneSecurity.title;</label>
+    </button>
+
+    <button label="&paneSync.title;" class="landingButton"
+            oncommand="gotoPref('paneSync');">
+      <image class="landingButton-icon" type="sync"/>
+      <label class="landingButton-label">&paneSync.title;</label>
+    </button>
+
+    <button label="&paneAdvanced.title;" class="landingButton"
+            oncommand="gotoPref('paneAdvanced');">
+      <image class="landingButton-icon" type="advanced"/>
+      <label class="landingButton-label">&paneAdvanced.title;</label>
+    </button>
+
+  </hbox>
+</vbox>
new file mode 100644
--- /dev/null
+++ b/browser/components/preferences/in-content/preferences.js
@@ -0,0 +1,58 @@
+/* - 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/. */
+
+"use strict";
+ 
+const Cc = Components.classes;
+const Ci = Components.interfaces;
+const Cu = Components.utils;
+const Cr = Components.results;
+
+Cu.import("resource://gre/modules/XPCOMUtils.jsm");
+Cu.import("resource://gre/modules/Services.jsm");
+
+function init_all() {
+  document.documentElement.instantApply = true;
+  window.history.replaceState("landing", document.title);
+  window.addEventListener("popstate", onStatePopped, true);
+  updateCommands();
+  var initFinished = document.createEvent("Event");
+  initFinished.initEvent("Initialized", true, true);
+  document.dispatchEvent(initFinished);
+}
+
+function gotoPref(page) {
+  window.history.pushState(page, document.title);
+  updateCommands();
+}
+ 
+function cmd_back() {
+  window.history.back();
+}
+ 
+function cmd_forward() {
+  window.history.forward();
+}
+
+function onStatePopped(aEvent) {
+  updateCommands();
+  search(aEvent.state, "data-category");
+}
+
+function updateCommands() {
+  document.getElementById("back-btn").disabled = !canGoBack();
+  document.getElementById("forward-btn").disabled = !canGoForward();
+}
+
+function canGoBack() {
+  return window.QueryInterface(Ci.nsIInterfaceRequestor)
+               .getInterface(Ci.nsIWebNavigation)
+               .canGoBack;
+}
+
+function canGoForward() {
+  return window.QueryInterface(Ci.nsIInterfaceRequestor)
+               .getInterface(Ci.nsIWebNavigation)
+               .canGoForward;
+}
new file mode 100644
--- /dev/null
+++ b/browser/components/preferences/in-content/preferences.xul
@@ -0,0 +1,96 @@
+<?xml version="1.0"?>
+<!-- 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/. -->
+
+<?xml-stylesheet href="chrome://global/skin/global.css"?>
+
+<?xml-stylesheet href="chrome://mozapps/content/preferences/preferences.css"?>
+
+<?xml-stylesheet href="chrome://browser/skin/preferences/preferences.css"?>
+<?xml-stylesheet 
+  href="chrome://browser/skin/preferences/in-content/preferences.css"?>
+<?xml-stylesheet 
+  href="chrome://browser/content/preferences/handlers.css"?>
+<?xml-stylesheet href="chrome://browser/skin/preferences/applications.css"?>
+
+<!DOCTYPE page [
+<!ENTITY % brandDTD SYSTEM "chrome://branding/locale/brand.dtd">
+<!ENTITY % preferencesDTD SYSTEM 
+  "chrome://browser/locale/preferences/preferences.dtd">
+<!ENTITY % privacyDTD SYSTEM "chrome://browser/locale/preferences/privacy.dtd">
+<!ENTITY % tabsDTD SYSTEM "chrome://browser/locale/preferences/tabs.dtd">
+<!ENTITY % syncBrandDTD SYSTEM "chrome://browser/locale/syncBrand.dtd">
+<!ENTITY % syncDTD SYSTEM "chrome://browser/locale/preferences/sync.dtd">
+<!ENTITY % securityDTD SYSTEM 
+  "chrome://browser/locale/preferences/security.dtd">
+<!ENTITY % sanitizeDTD SYSTEM "chrome://browser/locale/sanitize.dtd">
+<!ENTITY % mainDTD SYSTEM "chrome://browser/locale/preferences/main.dtd">
+<!ENTITY % aboutHomeDTD SYSTEM "chrome://browser/locale/aboutHome.dtd">
+<!ENTITY % contentDTD SYSTEM "chrome://browser/locale/preferences/content.dtd">
+<!ENTITY % applicationsDTD SYSTEM 
+  "chrome://browser/locale/preferences/applications.dtd">
+<!ENTITY % advancedDTD SYSTEM 
+  "chrome://browser/locale/preferences/advanced.dtd">
+%brandDTD;
+%preferencesDTD;
+%privacyDTD;
+%tabsDTD;
+%syncBrandDTD;
+%syncDTD;
+%securityDTD;
+%sanitizeDTD;
+%mainDTD;
+%aboutHomeDTD;
+%contentDTD;
+%applicationsDTD;
+%advancedDTD;
+]>
+
+#ifdef XP_WIN
+#define USE_WIN_TITLE_STYLE
+#endif
+#ifdef XP_OS2
+#define USE_WIN_TITLE_STYLE
+#endif
+
+<page onload="init_all();"
+      xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+      xmlns:html="http://www.w3.org/1999/xhtml"
+#ifdef USE_WIN_TITLE_STYLE
+      title="&prefWindow.titleWin;">
+#else
+      title="&prefWindow.titleGNOME;">
+#endif
+
+  <script type="application/javascript"
+          src="chrome://browser/content/utilityOverlay.js"/>
+  <script type="application/javascript"
+          src="chrome://browser/content/preferences/in-content/preferences.js"/>
+
+  <stringbundle id="bundleBrand" 
+                src="chrome://branding/locale/brand.properties"/>
+  <stringbundle id="bundlePreferences"
+                src="chrome://browser/locale/preferences/preferences.properties"/>
+
+  <stringbundleset id="appManagerBundleset">
+    <stringbundle id="appManagerBundle"
+                  src="chrome://browser/locale/preferences/applicationManager.properties"/>
+  </stringbundleset>
+
+  <hbox id="header">
+    <toolbarbutton id="back-btn" class="nav-button header-button"
+                   oncommand="cmd_back()" tooltiptext="&buttonBack.tooltip;"
+                   disabled="true"/>
+    <toolbarbutton id="forward-btn" class="nav-button header-button"
+                   oncommand="cmd_forward()" tooltiptext="&buttonForward.tooltip;"
+                   disabled="true"/>
+  </hbox>
+  
+  <hbox class="main-content" flex="1">
+    <prefpane flex="1">
+#include landing.xul
+    </prefpane>
+  </hbox>
+  
+</page>
--- a/browser/locales/en-US/chrome/browser/preferences/preferences.dtd
+++ b/browser/locales/en-US/chrome/browser/preferences/preferences.dtd
@@ -12,8 +12,10 @@
 <!ENTITY  paneContent.title       "Content">
 <!ENTITY  paneApplications.title  "Applications">
 <!ENTITY  panePrivacy.title       "Privacy">
 <!ENTITY  paneSecurity.title      "Security">
 <!ENTITY  paneAdvanced.title      "Advanced">
 
 <!-- LOCALIZATION NOTE (paneSync.title): This should match syncBrand.shortName.label in ../syncBrand.dtd -->
 <!ENTITY  paneSync.title          "Sync">
+<!ENTITY  buttonForward.tooltip   "Go forward one page">
+<!ENTITY  buttonBack.tooltip      "Go back one page">
\ No newline at end of file
--- a/browser/themes/gnomestripe/jar.mn
+++ b/browser/themes/gnomestripe/jar.mn
@@ -72,16 +72,17 @@ browser.jar:
   skin/classic/browser/places/downloads.png           (places/downloads.png)
   skin/classic/browser/preferences/alwaysAsk.png      (preferences/alwaysAsk.png)
   skin/classic/browser/preferences/mail.png           (preferences/mail.png)
   skin/classic/browser/preferences/Options.png        (preferences/Options.png)
 #ifdef MOZ_SERVICES_SYNC
   skin/classic/browser/preferences/Options-sync.png   (preferences/Options-sync.png)
 #endif
 * skin/classic/browser/preferences/preferences.css    (preferences/preferences.css)
+  skin/classic/browser/preferences/in-content/preferences.css (preferences/in-content/preferences.css)
   skin/classic/browser/preferences/applications.css   (preferences/applications.css)
   skin/classic/browser/preferences/aboutPermissions.css (preferences/aboutPermissions.css)
   skin/classic/browser/tabbrowser/alltabs.png          (tabbrowser/alltabs.png)
   skin/classic/browser/tabbrowser/connecting.png      (tabbrowser/connecting.png)
   skin/classic/browser/tabbrowser/loading.png         (tabbrowser/loading.png)
   skin/classic/browser/tabbrowser/tab.png             (tabbrowser/tab.png)
   skin/classic/browser/tabbrowser/tab-overflow-border.png (tabbrowser/tab-overflow-border.png)
   skin/classic/browser/tabbrowser/tabDragIndicator.png (tabbrowser/tabDragIndicator.png)
new file mode 100644
--- /dev/null
+++ b/browser/themes/gnomestripe/preferences/in-content/preferences.css
@@ -0,0 +1,148 @@
+/* - 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/. */
+
+@import url("chrome://global/skin/inContentUI.css");
+
+@namespace html "http://www.w3.org/1999/xhtml";
+
+#preferences-home {
+  display: block;
+}
+
+#header {
+  margin-bottom: 18px;
+}
+
+.landingButton {
+  -moz-box-align: center;
+  -moz-box-orient: vertical;
+}
+
+.landingButton:hover {
+  cursor: pointer;
+}
+
+.landingButton-label {
+  margin-top: 4px;
+}
+
+.landingButton-icon {
+  display: block;
+  width: 32px;
+  height: 32px;
+  background-image: url("chrome://browser/skin/preferences/Options.png");
+  background-repeat: no-repeat;
+}
+
+.preference-icon {
+  display: block;
+  width: 32px;
+  height: 32px;
+  background-image: url("chrome://browser/skin/preferences/Options.png");
+  background-repeat: no-repeat;
+  margin: 0 20px;
+}
+
+.preference-icon[type="general"],
+.landingButton-icon[type="general"] {
+  background-position: 0 0;
+}
+
+.preference-icon[type="tabs"],
+.landingButton-icon[type="tabs"] {
+  background-position: -32px 0;
+}
+
+.preference-icon[type="content"],
+.landingButton-icon[type="content"] {
+  background-position: -64px 0;
+}
+
+.preference-icon[type="applications"],
+.landingButton-icon[type="applications"] {
+  background-position: -96px 0;
+}
+
+.preference-icon[type="privacy"],
+.landingButton-icon[type="privacy"] {
+  background-position: -128px 0;
+}
+
+.preference-icon[type="security"],
+.landingButton-icon[type="security"] {
+  background-position: -160px 0;
+}
+
+.preference-icon[type="advanced"],
+.landingButton-icon[type="advanced"] {
+  background-position: -192px 0;
+}
+
+.preference-icon[type="sync"],
+.landingButton-icon[type="sync"] {
+  background-image: url("chrome://browser/skin/preferences/Options-sync.png");
+}
+
+caption {
+  font-size: 20px;
+}
+
+.heading {
+  height: 50px;
+  background-color: rgba(192,199,210,0.7);
+  border-radius: 5px 5px 0 0;
+  margin-bottom: 15px;
+  -moz-box-align: center;
+}
+
+prefpane > .content-box {
+  overflow: auto;
+}
+
+/* XXX This style is for bug 740213 and should be removed once that
+   bug has a solution. */
+description > html|a {
+  cursor: pointer;
+}
+
+/* XXX Styles Below can be removed once bug 660726 lands */
+.nav-button {
+  min-width: 0;
+}
+
+#back-btn:-moz-locale-dir(ltr) {
+  list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=toolbar");
+}
+
+#forward-btn:-moz-locale-dir(ltr) {
+  list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=toolbar");
+}
+
+#back-btn:-moz-locale-dir(rtl) {
+  list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=toolbar");
+}
+
+#forward-btn:-moz-locale-dir(rtl) {
+  list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=toolbar");
+}
+
+#back-btn[disabled="true"]:-moz-locale-dir(ltr) {
+  list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=toolbar&state=disabled");
+}
+
+#forward-btn[disabled="true"]:-moz-locale-dir(ltr) {
+  list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=toolbar&state=disabled");
+}
+
+#back-btn[disabled="true"]:-moz-locale-dir(rtl) {
+  list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=toolbar&state=disabled");
+}
+
+#forward-btn[disabled="true"]:-moz-locale-dir(rtl) {
+  list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=toolbar&state=disabled");
+}
+
+.header-button .toolbarbutton-text {
+  display: none;
+}
--- a/browser/themes/pinstripe/jar.mn
+++ b/browser/themes/pinstripe/jar.mn
@@ -98,16 +98,17 @@ browser.jar:
   skin/classic/browser/preferences/alwaysAsk.png            (preferences/alwaysAsk.png)
   skin/classic/browser/preferences/application.png          (preferences/application.png)
   skin/classic/browser/preferences/Options.png              (preferences/Options.png)
 #ifdef MOZ_SERVICES_SYNC
   skin/classic/browser/preferences/Options-sync.png         (preferences/Options-sync.png)
 #endif
   skin/classic/browser/preferences/saveFile.png             (preferences/saveFile.png)
 * skin/classic/browser/preferences/preferences.css          (preferences/preferences.css)
+* skin/classic/browser/preferences/in-content/preferences.css (preferences/in-content/preferences.css)
   skin/classic/browser/preferences/applications.css         (preferences/applications.css)
   skin/classic/browser/preferences/aboutPermissions.css     (preferences/aboutPermissions.css)
   skin/classic/browser/tabbrowser/alltabs-box-bkgnd-icon.png             (tabbrowser/alltabs-box-bkgnd-icon.png)
   skin/classic/browser/tabbrowser/newtab.png                             (tabbrowser/newtab.png)
   skin/classic/browser/tabbrowser/connecting.png                         (tabbrowser/connecting.png)
   skin/classic/browser/tabbrowser/loading.png                            (tabbrowser/loading.png)
   skin/classic/browser/tabbrowser/tab-arrow-left.png                     (tabbrowser/tab-arrow-left.png)
   skin/classic/browser/tabbrowser/tab-arrow-right.png                    (tabbrowser/tab-arrow-right.png)
new file mode 100644
--- /dev/null
+++ b/browser/themes/pinstripe/preferences/in-content/preferences.css
@@ -0,0 +1,159 @@
+/* - 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/. */
+
+@import url("chrome://global/skin/inContentUI.css");
+
+@namespace html "http://www.w3.org/1999/xhtml";
+
+#preferences-home {
+  display: block;
+}
+
+#header {
+  margin-bottom: 18px;
+}
+
+.landingButton {
+  -moz-box-align: center;
+  -moz-box-orient: vertical;
+  border: none;
+  background: none;
+  box-shadow: none;
+}
+
+.landingButton:hover {
+  cursor: pointer;
+}
+
+.landingButton-label {
+  margin-top: 4px;
+}
+
+.landingButton-icon {
+  display: block;
+  width: 32px;
+  height: 32px;
+  background-image: url("chrome://browser/skin/preferences/Options.png");
+  background-repeat: no-repeat;
+}
+
+.preference-icon {
+  display: block;
+  width: 32px;
+  height: 32px;
+  background-image: url("chrome://browser/skin/preferences/Options.png");
+  background-repeat: no-repeat;
+  margin: 0 20px;
+}
+
+.preference-icon[type="general"],
+.landingButton-icon[type="general"] {
+  background-position: 0 0;
+}
+
+.preference-icon[type="tabs"],
+.landingButton-icon[type="tabs"] {
+  background-position: -32px 0;
+}
+
+.preference-icon[type="content"],
+.landingButton-icon[type="content"] {
+  background-position: -64px 0;
+}
+
+.preference-icon[type="applications"],
+.landingButton-icon[type="applications"] {
+  background-position: -96px 0;
+}
+
+.preference-icon[type="privacy"],
+.landingButton-icon[type="privacy"] {
+  background-position: -128px 0;
+}
+
+.preference-icon[type="security"],
+.landingButton-icon[type="security"] {
+  background-position: -160px 0;
+}
+
+.preference-icon[type="advanced"],
+.landingButton-icon[type="advanced"] {
+  background-position: -192px 0;
+}
+
+.preference-icon[type="sync"],
+.landingButton-icon[type="sync"] {
+  background-image: url("chrome://browser/skin/preferences/Options-sync.png");
+}
+
+caption {
+  font-size: 20px;
+}
+
+.heading {
+  height: 50px;
+  background-color: rgba(192,199,210,0.7);
+  border-radius: 5px 5px 0 0;
+  margin-bottom: 15px;
+  -moz-box-align: center;
+}
+
+prefpane > .content-box {
+  overflow: auto;
+}
+
+/* XXX This style is for bug 740213 and should be removed once that
+   bug has a solution. */
+description > html|a {
+  cursor: pointer;
+}
+
+/* XXX Styles Below can be removed once bug 660726 lands */
+.nav-button {
+  list-style-image: url(chrome://mozapps/skin/extensions/navigation.png);
+}
+
+#back-btn:-moz-locale-dir(ltr),
+#forward-btn:-moz-locale-dir(rtl) {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+  border-right: none;
+  -moz-image-region: rect(0, 20px, 20px, 0);
+  padding-right: 3px;
+}
+
+#back-btn:-moz-locale-dir(rtl),
+#forward-btn:-moz-locale-dir(ltr) {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  -moz-image-region: rect(0, 40px, 20px, 20px);
+  padding-left: 3px;
+}
+
+.header-button {
+  -moz-appearance: none;
+  padding: 0 4px;
+  margin: 0;
+  height: 22px;
+  border: 1px solid rgba(60,73,97,0.5);
+  border-radius: @toolbarbuttonCornerRadius@;
+  box-shadow: inset 0 1px rgba(255,255,255,0.25), 0 1px rgba(255,255,255,0.25);
+  background: -moz-linear-gradient(rgba(255,255,255,0.45), rgba(255,255,255,0));
+  background-clip: padding-box;
+}
+
+.header-button .toolbarbutton-text {
+  display: none;
+}
+
+.header-button[disabled="true"] .toolbarbutton-icon {
+  opacity: 0.4;
+}
+
+.header-button:not([disabled="true"]):active:hover,
+.header-button[open="true"] {
+  border-color: rgba(45,54,71,0.7);
+  box-shadow: inset 0 0 4px rgb(45,54,71), 0 1px rgba(255,255,255,0.25);
+  background-image: -moz-linear-gradient(rgba(45,54,71,0.6), rgba(45,54,71,0));
+}
--- a/browser/themes/winstripe/jar.mn
+++ b/browser/themes/winstripe/jar.mn
@@ -91,16 +91,17 @@ browser.jar:
         skin/classic/browser/preferences/application.png             (preferences/application.png)
         skin/classic/browser/preferences/mail.png                    (preferences/mail.png)
         skin/classic/browser/preferences/Options.png                 (preferences/Options.png)
 #ifdef MOZ_SERVICES_SYNC
         skin/classic/browser/preferences/Options-sync.png            (preferences/Options-sync.png)
 #endif
         skin/classic/browser/preferences/saveFile.png                (preferences/saveFile.png)
 *       skin/classic/browser/preferences/preferences.css             (preferences/preferences.css)
+        skin/classic/browser/preferences/in-content/preferences.css  (preferences/in-content/preferences.css)
         skin/classic/browser/preferences/applications.css            (preferences/applications.css)
         skin/classic/browser/preferences/aboutPermissions.css        (preferences/aboutPermissions.css)
         skin/classic/browser/tabbrowser/alltabs.png                  (tabbrowser/alltabs.png)
         skin/classic/browser/tabbrowser/newtab.png                   (tabbrowser/newtab.png)
         skin/classic/browser/tabbrowser/newtab-inverted.png          (tabbrowser/newtab-inverted.png)
         skin/classic/browser/tabbrowser/connecting.png               (tabbrowser/connecting.png)
         skin/classic/browser/tabbrowser/loading.png                  (tabbrowser/loading.png)
         skin/classic/browser/tabbrowser/tab.png                      (tabbrowser/tab.png)
@@ -277,16 +278,17 @@ browser.jar:
         skin/classic/aero/browser/preferences/application.png        (preferences/application-aero.png)
         skin/classic/aero/browser/preferences/mail.png               (preferences/mail-aero.png)
         skin/classic/aero/browser/preferences/Options.png            (preferences/Options-aero.png)
 #ifdef MOZ_SERVICES_SYNC
         skin/classic/aero/browser/preferences/Options-sync.png       (preferences/Options-sync.png)
 #endif
         skin/classic/aero/browser/preferences/saveFile.png           (preferences/saveFile-aero.png)
 *       skin/classic/aero/browser/preferences/preferences.css        (preferences/preferences.css)
+        skin/classic/aero/browser/preferences/in-content/preferences.css (preferences/in-content/preferences.css)
         skin/classic/aero/browser/preferences/applications.css       (preferences/applications.css)
         skin/classic/aero/browser/preferences/aboutPermissions.css   (preferences/aboutPermissions.css)
         skin/classic/aero/browser/tabbrowser/alltabs.png             (tabbrowser/alltabs.png)
         skin/classic/aero/browser/tabbrowser/newtab.png              (tabbrowser/newtab.png)
         skin/classic/aero/browser/tabbrowser/newtab-inverted.png     (tabbrowser/newtab-inverted.png)
         skin/classic/aero/browser/tabbrowser/connecting.png          (tabbrowser/connecting.png)
         skin/classic/aero/browser/tabbrowser/loading.png             (tabbrowser/loading.png)
         skin/classic/aero/browser/tabbrowser/tab.png                 (tabbrowser/tab.png)
new file mode 100644
--- /dev/null
+++ b/browser/themes/winstripe/preferences/in-content/preferences.css
@@ -0,0 +1,168 @@
+/* - 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/. */
+
+@import url("chrome://global/skin/inContentUI.css");
+
+@namespace html "http://www.w3.org/1999/xhtml";
+
+#preferences-home {
+  display: block;
+}
+
+#header {
+  margin-bottom: 18px;
+}
+
+.landingButton {
+  -moz-box-align: center;
+  -moz-box-orient: vertical;
+  border: none;
+  background: none;
+  box-shadow: none;
+}
+
+.landingButton:hover {
+  cursor: pointer;
+}
+
+.landingButton-label {
+  margin-top: 4px;
+}
+
+.landingButton-icon {
+  display: block;
+  width: 32px;
+  height: 32px;
+  background-image: url("chrome://browser/skin/preferences/Options.png");
+  background-repeat: no-repeat;
+}
+
+.preference-icon {
+  display: block;
+  width: 32px;
+  height: 32px;
+  background-image: url("chrome://browser/skin/preferences/Options.png");
+  background-repeat: no-repeat;
+  margin: 0 20px;
+}
+
+.preference-icon[type="general"],
+.landingButton-icon[type="general"] {
+  background-position: 0 0;
+}
+
+.preference-icon[type="tabs"],
+.landingButton-icon[type="tabs"] {
+  background-position: -32px 0;
+}
+
+.preference-icon[type="content"],
+.landingButton-icon[type="content"] {
+  background-position: -64px 0;
+}
+
+.preference-icon[type="applications"],
+.landingButton-icon[type="applications"] {
+  background-position: -96px 0;
+}
+
+.preference-icon[type="privacy"],
+.landingButton-icon[type="privacy"] {
+  background-position: -128px 0;
+}
+
+.preference-icon[type="security"],
+.landingButton-icon[type="security"] {
+  background-position: -160px 0;
+}
+
+.preference-icon[type="advanced"],
+.landingButton-icon[type="advanced"] {
+  background-position: -192px 0;
+}
+
+.preference-icon[type="sync"],
+.landingButton-icon[type="sync"] {
+  background-image: url("chrome://browser/skin/preferences/Options-sync.png");
+}
+
+caption {
+  font-size: 20px;
+}
+
+.heading {
+  height: 50px;
+  background-color: rgba(192,199,210,0.7);
+  border-radius: 5px 5px 0 0;
+  margin-bottom: 15px;
+  -moz-box-align: center;
+}
+
+prefpane > .content-box {
+  overflow: auto;
+}
+
+/* XXX This style is for bug 740213 and should be removed once that
+   bug has a solution. */
+description > html|a {
+  cursor: pointer;
+}
+
+/* XXX Styles Below can be removed once bug 660726 lands */
+.nav-button {
+  list-style-image: url(chrome://mozapps/skin/extensions/navigation.png);
+}
+
+#forward-btn {
+  -moz-border-start: none;
+}
+
+#back-btn:-moz-locale-dir(ltr),
+#forward-btn:-moz-locale-dir(rtl) {
+  -moz-image-region: rect(0, 18px, 18px, 0);
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+#back-btn:-moz-locale-dir(rtl),
+#forward-btn:-moz-locale-dir(ltr) {
+  -moz-image-region: rect(0, 36px, 18px, 18px);
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.header-button[disabled="true"] {
+  opacity: 0.8;
+}
+
+.header-button {
+  -moz-appearance: none;
+  padding: 1px 3px;
+  color: #444;
+  text-shadow: 0 0 3px white;
+  background: -moz-linear-gradient(
+                    rgba(251,252,253,0.95), rgba(246,247,248,0) 49%,
+                    rgba(211,212,213,0.45) 51%, rgba(225,226,229, 0.3));
+  background-clip: padding-box;
+  border-radius: 2.5px;
+  border: 1px solid rgba(31,64,100,0.4);
+  border-top-color: rgba(31,64,100,0.3);
+  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25) inset,
+              0 0 2px 1px rgba(255, 255, 255, 0.25) inset;
+}
+
+.header-button[disabled="true"] > .toolbarbutton-icon {
+  opacity: 0.4;
+}
+
+.header-button:not([disabled="true"]):active:hover,
+.header-button[open="true"] {
+  background-color: rgba(61, 76, 92, 0.2);
+  border-color: rgba(39, 53, 68, 0.5);
+  box-shadow: 0 0 3px 1px rgba(39, 53, 68, 0.2) inset;
+}
+
+.header-button > .toolbarbutton-text {
+  display: none;
+}