Merge the microsummary picker with the Name field in the add bookmark and bookmark properties dialog, hiding the picker if no microsummaries are available.

bug=337825 r=mconnor a=mconnor for checkin to 1.8 branch
2006-06-19 22:15:59 +00:00 · 2006-06-19 22:15:59 +00:00 · 6e8f78d355
--- a/browser/components/bookmarks/content/addBookmark2.js
+++ b/browser/components/bookmarks/content/addBookmark2.js
@ -22,6 +22,7 @@
 # Contributor(s):
 #   Ben Goodger <ben@netscape.com> (Original Author)
 #   David Hyatt <hyatt@mozilla.org>
+#   Myk Melez <myk@mozilla.org>
 #
 # Alternatively, the contents of this file may be used under the terms of
 # either the GNU General Public License Version 2 or later (the "GPL"), or
@ -174,10 +175,6 @@ function Startup()

  if (MicrosummaryPicker.enabled)
    MicrosummaryPicker.init();
-  else {
-    var microsummaryRow = document.getElementById("microsummaryRow");
-    microsummaryRow.setAttribute("hidden", "true");
-  }
 } 

 function initTitle()
@ -221,7 +218,19 @@ function onOK()
                                    gArg.description);
  } else {
    url = getNormalizedURL(gArg.url);
-    gResource = BMDS.createBookmark(gName.value, url, gKeyword.value, 
+
+    var name = gName.value;
+
+    // If the microsummary picker is enabled, the value of the name field
+    // won't necessarily contain the user-entered name for the bookmark.
+    // But the first item in the microsummary drop-down menu will always
+    // contain the user-entered name, so get the name from there instead.
+    if (MicrosummaryPicker.enabled) {
+      var menuPopup = document.getElementById("microsummaryMenuPopup");
+      name = menuPopup.childNodes[0].getAttribute("label");
+    }
+
+    gResource = BMDS.createBookmark(name, url, gKeyword.value, 
                                    gArg.description, gArg.charset, 
                                    gPostData);
  }
--- a/browser/components/bookmarks/content/addBookmark2.xul
+++ b/browser/components/bookmarks/content/addBookmark2.xul
@ -23,6 +23,7 @@
 #
 # Contributor(s):
 #   Ben Goodger <ben@netscape.com> (Original Author)
+#   Myk Melez <myk@mozilla.org>
 #
 # Alternatively, the contents of this file may be used under the terms of
 # either the GNU General Public License Version 2 or later (the "GPL"), or
@ -87,21 +88,21 @@
    <rows>
      <row align="center">
        <label value="&name.label;" accesskey="&name.accesskey;" control="name"/>
-        <textbox id="name" oninput="onFieldInput();"/>
+        <menulist id="name" editable="true" droppable="false"
+                  oninput="onFieldInput(); MicrosummaryPicker.onInput(event);">
+          <menupopup id="microsummaryMenuPopup">
+            <menuitem id="userEnteredNameItem"/>
+            <menuitem disabled="true">
+              <menuseparator flex="1"/>
+              <label value="&microsummary.label;"/>
+            </menuitem>
+          </menupopup>
+        </menulist>
      </row>
      <row align="center" id="keywordRow">
        <label value="&keyword.label;" accesskey="&keyword.accesskey;" control="keyword"/>
        <textbox id="keyword" oninput="onFieldInput();"/>
      </row>
-      <row id="microsummaryRow">
-        <label value="&microsummary.label;" accesskey="&microsummary.accesskey;"
-               control="microsummaryMenuList"/>
-        <menulist id="microsummaryMenuList">
-          <menupopup id="microsummaryMenuPopup">
-            <menuitem label="&microsummary.none.label;" selected="true"/>
-          </menupopup>
-        </menulist>
-      </row>
      <row align="center">
        <label id="createinlabel" value="&createin.label;" accesskey="&createin.accesskey;" control="select-menu"/>
        <menulist id="select-menu" class="folder-icon"
--- a/browser/components/bookmarks/content/bookmarksProperties.js
+++ b/browser/components/bookmarks/content/bookmarksProperties.js
@ -66,8 +66,7 @@ function Init()
  window.arguments[1].ok = false;

  // This is the set of fields that are visible in the window.
-  gFields     = ["name", "url", "shortcut", "description", "webpanel", "feedurl",
-                 "microsummaryMenuList"];
+  gFields     = ["name", "url", "shortcut", "description", "webpanel", "feedurl"];

  // ...and this is a parallel array that contains the RDF properties
  // that they are associated with.
@ -92,19 +91,13 @@ function Init()

    if (gFields[i] == "webpanel")
      field.checked = (value != undefined);
-    else if (gFields[i] == "microsummaryMenuList") {
-      if (MicrosummaryPicker.enabled)
-        MicrosummaryPicker.init();
-      else {
-        var microsummaryRow = document.getElementById("microsummaryRow");
-        microsummaryRow.setAttribute("hidden", "true");
-      }
-      continue;
-    }
    else if (value) //make sure were aren't stuffing null into any fields
      field.value = value;
  }

+  if (MicrosummaryPicker.enabled)
+    MicrosummaryPicker.init();
+
  var nameNode = document.getElementById("name");
  document.title = document.title.replace(/\*\*bm_title\*\*/gi, nameNode.value);

@ -161,16 +154,28 @@ function Commit()
    if (! field)
      continue;

-    if (gFields[i] == "microsummaryMenuList") {
-      if (MicrosummaryPicker.enabled) {
-        changed |= MicrosummaryPicker.commit();
-        MicrosummaryPicker.destroy();
-      }
-      continue;
-    }
-
    // Get the new value as a literal, using 'null' if the value is empty.
    var newValue = field.value;
+
+    if (gFields[i] == "name" && MicrosummaryPicker.enabled) {
+      // If the microsummary picker is enabled, the value of the name field
+      // won't necessarily contain the user-entered name for the bookmark.
+      // But the first item in the microsummary drop-down menu will always
+      // contain the user-entered name, so get the name from there instead.
+      var nameItem = document.getElementById("userEnteredNameItem");
+      newValue = nameItem.getAttribute("label");
+
+      // Make any necessary changes to the microsummary for this bookmark.
+      changed |= MicrosummaryPicker.commit();
+      MicrosummaryPicker.destroy();
+
+      // The rest of the code in this "for" loop will proceed to save changes
+      // to the user-entered name, whether or not the user subsequently chose
+      // to display a microsummary.  Presumably this is the correct behavior,
+      // as we should trust that the user intended to both change the name
+      // and display a microsummary.
+    }
+
    if (gFields[i] == "webpanel")
      newValue = field.checked ? "true" : undefined;
 
--- a/browser/components/bookmarks/content/bookmarksProperties.xul
+++ b/browser/components/bookmarks/content/bookmarksProperties.xul
@ -36,6 +36,7 @@
 #
 # ***** END LICENSE BLOCK *****
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="chrome://browser/skin/bookmarks/bookmarksProperties.css" type="text/css"?>

 <!DOCTYPE dialog [
 <!ENTITY % brandDTD SYSTEM "chrome://branding/locale/brand.dtd" >
@ -73,7 +74,16 @@
      <rows>
        <row align="center">
          <label value="&bookmarks.name.label;" control="name"/>
-          <textbox id="name"/>
+          <menulist id="name" editable="true" droppable="false"
+                    oninput="MicrosummaryPicker.onInput(event)">
+            <menupopup id="microsummaryMenuPopup">
+              <menuitem id="userEnteredNameItem"/>
+              <menuitem disabled="true">
+                <menuseparator flex="1"/>
+                <label value="&bookmarks.micsum.label;"/>
+              </menuitem>
+            </menupopup>
+          </menulist>
        </row>
        <row id="locationrow" align="center">
          <label value="&bookmarks.location.label;" control="url"/>
@ -87,14 +97,6 @@
          <label value="&bookmarks.shortcut.label;" control="shortcut"/>
              <textbox id="shortcut" />
        </row>
-        <row id="microsummaryRow">
-          <label value="&bookmarks.micsum.label;" control="microsummaryMenuList"/>
-          <menulist id="microsummaryMenuList">
-            <menupopup id="microsummaryMenuPopup">
-              <menuitem label="&bookmarks.micsum.none.label;" selected="true"/>
-            </menupopup>
-          </menulist>
-        </row>
        <row id="descriptionrow">
          <label value="&bookmarks.description.label;" control="description"/>
          <textbox multiline="true" wrap="virtual" id="description" flex="1"/>
--- a/browser/components/bookmarks/content/microsummaryPicker.js
+++ b/browser/components/bookmarks/content/microsummaryPicker.js
@ -149,6 +149,9 @@ var MicrosummaryPicker = {
  },

  init: function MSP_init() {
+    // Set the label of the menu item representing the user-entered name.
+    this._updateUserEnteredNameItem();
+
    if (this._pageURI) {
      this._microsummaries = this._mss.getMicrosummaries(this._pageURI, this._bookmarkID);
      this._microsummaries.addObserver(this._observer);
@ -162,15 +165,26 @@ var MicrosummaryPicker = {
  },

  rebuild: function MSP_rebuild() {
-    var microsummaryMenuList = document.getElementById("microsummaryMenuList");
+    var microsummaryMenuList = document.getElementById("name");
    var microsummaryMenuPopup = document.getElementById("microsummaryMenuPopup");
  
-    // Remove old items from the menu, except the first item, which represents
-    // "don't show a microsummary; show the page title instead".
-    while (microsummaryMenuPopup.childNodes.length > 1)
+    // Remove old items from the menu, except for the first item, which holds
+    // the user-entered name, and the second item, which separates and labels
+    // the microsummaries below it.
+    while (microsummaryMenuPopup.childNodes.length > 2)
      microsummaryMenuPopup.removeChild(microsummaryMenuPopup.lastChild);
  
    var enumerator = this._microsummaries.Enumerate();
+
+    // Show the drop marker if there are microsummaries; otherwise hide it.
+    // We do this via a microsummary picker-specific "droppable" attribute
+    // that, when set to "false", activates a "display: none" CSS rule
+    // on the drop marker.
+    if (enumerator.hasMoreElements())
+      microsummaryMenuList.setAttribute("droppable", "true");
+    else
+      microsummaryMenuList.setAttribute("droppable", "false");
+
    while (enumerator.hasMoreElements()) {
      var microsummary = enumerator.getNext().QueryInterface(Ci.nsIMicrosummary);
  
@ -226,9 +240,31 @@ var MicrosummaryPicker = {
    }
  },

+  /**
+   * Called when the user types in the microsummary picker's text box.
+   * 
+   * @param   event
+   *          the event object representing the input event
+   *
+   */
+  onInput: function MSP_onInput(event) {
+    this._updateUserEnteredNameItem();
+  },
+
+  /**
+   * Update the menu item representing the user-entered name when the user
+   * changes the name by typing in the text box.
+   *
+   */
+  _updateUserEnteredNameItem: function MSP__updateUserEnteredNameItem() {
+    var nameField = document.getElementById("name");
+    var nameItem = document.getElementById("userEnteredNameItem");
+    nameItem.label = nameField.value;
+  },
+
  commit: function MSP_commit() {
    var changed = false;
-    var menuList = document.getElementById("microsummaryMenuList");
+    var menuList = document.getElementById("name");

    // Something should always be selected in the microsummary menu,
    // but if nothing is selected, then conservatively assume we should
--- a/browser/locales/en-US/chrome/browser/bookmarks/addBookmark.dtd
+++ b/browser/locales/en-US/chrome/browser/bookmarks/addBookmark.dtd
@ -4,9 +4,7 @@
 <!ENTITY name.accesskey             "N">
 <!ENTITY keyword.label              "Keyword:">
 <!ENTITY keyword.accesskey          "K">
-<!ENTITY microsummary.label         "Summary:">
-<!ENTITY microsummary.none.label    "Don't Display a Summary">
-<!ENTITY microsummary.accesskey     "S">
+<!ENTITY microsummary.label         "Live Titles">
 <!ENTITY url.label                  "Location:">
 <!ENTITY url.accesskey              "L">
 <!ENTITY button.createin.label      "Create In &gt;&gt;">
--- a/browser/locales/en-US/chrome/browser/bookmarks/bookmarksProperties.dtd
+++ b/browser/locales/en-US/chrome/browser/bookmarks/bookmarksProperties.dtd
@ -44,10 +44,9 @@

 <!ENTITY bookmarks.information.label  "Information:">
 <!ENTITY bookmarks.name.label         "Name:">
+<!ENTITY bookmarks.micsum.label       "Live Titles">
 <!ENTITY bookmarks.location.label     "Location:">
 <!ENTITY bookmarks.feedurl.label      "Feed Location:">
 <!ENTITY bookmarks.shortcut.label     "Keyword:">
-<!ENTITY bookmarks.micsum.label       "Summary:">
-<!ENTITY bookmarks.micsum.none.label  "Don't Display a Summary">
 <!ENTITY bookmarks.description.label  "Description:">
 <!ENTITY bookmarks.webpanels.label    "Load this bookmark in the sidebar">
--- a/browser/themes/pinstripe/browser/bookmarks/addBookmark.css
+++ b/browser/themes/pinstripe/browser/bookmarks/addBookmark.css
@ -52,3 +52,52 @@ dialog {
 .up:hover:active {
 	list-style-image: url("chrome://browser/skin/bookmarks/expander-open-active.png") !important;
 }
+
+/* Hide the drop marker if no microsummaries are available. */
+menulist#name[droppable="false"] > .menulist-dropmarker {
+  display: none;
+}
+
+/*
+ * Editable menulists look almost like regular textboxes, but not quite,
+ * which makes it look like something is off a bit when you place a menulist
+ * next to a textbox, f.e. the microsummary picker above the Location field
+ * and other fields in the Bookmarks Properties dialog box.
+ *
+ * Of course, there aren't any text fields here in the Add Bookmark dialog box,
+ * but for consistency with the Bookmark Properties dialog box, we correct
+ * the appearance of the picker here as well.
+ * 
+ */
+
+menulist#name > .menulist-editable-box {
+  /* Normal editable menulists set this to "menulist-textfield". */
+  -moz-appearance: none;
+}
+
+menulist#name {
+  /* These rules come from the textbox element in textbox.css. */
+
+  /* Normal editable menulists set this to "none". */
+  -moz-appearance: textfield;
+
+  /* Follow the rule for normal editable menulists (cursor: auto;) instead of
+   * textboxes (cursor: text;) so the cursor is a pointer over the dropmarker.
+   */
+  /* cursor: text; */
+
+  /* Follow the rule for normal editable menulists (margin: 2px 2px;) instead of
+   * textboxes (margin: 2px 4px;) so the list lines up with the "Create in:"
+   * drop-down menu below it.
+   */
+  /* margin: 2px 4px; */
+
+  border: 2px solid;
+  -moz-border-top-colors: ThreeDShadow ThreeDDarkShadow;
+  -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow;
+  -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
+  -moz-border-left-colors: ThreeDShadow ThreeDDarkShadow;
+  padding: 2px 2px 3px 4px;
+  background-color: -moz-Field;
+  color: -moz-FieldText;
+}
--- a/browser/themes/pinstripe/browser/bookmarks/bookmarksProperties.css
+++ b/browser/themes/pinstripe/browser/bookmarks/bookmarksProperties.css
@ -0,0 +1,80 @@
+/* ***** BEGIN LICENSE BLOCK *****
+ * Version: MPL 1.1/GPL 2.0/LGPL 2.1
+ *
+ * The contents of this file are subject to the Mozilla Public License Version
+ * 1.1 (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ * http://www.mozilla.org/MPL/
+ *
+ * Software distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
+ * for the specific language governing rights and limitations under the
+ * License.
+ *
+ * The Original Code is Firefox.
+ *
+ * The Initial Developer of the Original Code is Mozilla.
+ * Portions created by the Initial Developer are Copyright (C) 2006
+ * the Initial Developer. All Rights Reserved.
+ *
+ * Contributor(s):
+ *   Myk Melez <myk@mozilla.org>
+ *
+ * Alternatively, the contents of this file may be used under the terms of
+ * either the GNU General Public License Version 2 or later (the "GPL"), or
+ * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
+ * in which case the provisions of the GPL or the LGPL are applicable instead
+ * of those above. If you wish to allow use of your version of this file only
+ * under the terms of either the GPL or the LGPL, and not to allow others to
+ * use your version of this file under the terms of the MPL, indicate your
+ * decision by deleting the provisions above and replace them with the notice
+ * and other provisions required by the GPL or the LGPL. If you do not delete
+ * the provisions above, a recipient may use your version of this file under
+ * the terms of any one of the MPL, the GPL or the LGPL.
+ *
+ * ***** END LICENSE BLOCK ***** */
+
+/* Hide the drop marker if no microsummaries are available. */
+menulist#name[droppable="false"] > .menulist-dropmarker {
+  display: none;
+}
+
+/*
+ * Editable menulists look almost like regular textboxes, but not quite,
+ * which makes it look like something is off a bit when you place a menulist
+ * next to a textbox, f.e. the microsummary picker above the Location field
+ * and other fields in the Bookmarks Properties dialog box.
+ *
+ * These styles correct the appearance of the picker in that dialog box,
+ * making it look just like the textboxes below it.
+ * 
+ */
+
+menulist#name > .menulist-editable-box {
+  /* Normal editable menulists set this to "menulist-textfield". */
+  -moz-appearance: none;
+}
+
+menulist#name {
+  /* These rules come from the textbox element in textbox.css. */
+
+  /* Normal editable menulists set this to "none". */
+  -moz-appearance: textfield;
+
+  /* Follow the rule for normal editable menulists (cursor: auto;) instead of
+   * textboxes (cursor: text;) so the cursor is a pointer over the dropmarker.
+   */
+  /* cursor: text; */
+
+  /* Normal editable menulists set this to "2px 2px". */
+  margin: 2px 4px;
+
+  border: 2px solid;
+  -moz-border-top-colors: ThreeDShadow ThreeDDarkShadow;
+  -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow;
+  -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
+  -moz-border-left-colors: ThreeDShadow ThreeDDarkShadow;
+  padding: 2px 2px 3px 4px;
+  background-color: -moz-Field;
+  color: -moz-FieldText;
+}
--- a/browser/themes/pinstripe/browser/jar.mn
+++ b/browser/themes/pinstripe/browser/jar.mn
@ -57,6 +57,7 @@ classic.jar:
  skin/classic/browser/places/bookmarkProperties.css        (places/bookmarkProperties.css)
 #else
  skin/classic/browser/bookmarks/addBookmark.css            (bookmarks/addBookmark.css)
+  skin/classic/browser/bookmarks/bookmarksProperties.css    (bookmarks/bookmarksProperties.css)
  skin/classic/browser/bookmarks/bookmark-folder.png        (bookmarks/bookmark-folder.png)
  skin/classic/browser/bookmarks/bookmark-item.png          (bookmarks/bookmark-item.png)
  skin/classic/browser/bookmarks/Bookmarks-toolbar.png      (bookmarks/Bookmarks-toolbar.png)
--- a/browser/themes/winstripe/browser/bookmarks/addBookmark.css
+++ b/browser/themes/winstripe/browser/bookmarks/addBookmark.css
@ -12,3 +12,52 @@
  list-style-image: url("chrome://global/skin/icons/folder-item.png") !important;
  -moz-image-region: rect(0px, 32px, 16px, 16px) !important;
 }
+
+/* Hide the drop marker if no microsummaries are available. */
+menulist#name[droppable="false"] > .menulist-dropmarker {
+  display: none;
+}
+
+/*
+ * Editable menulists look almost like regular textboxes, but not quite,
+ * which makes it look like something is off a bit when you place a menulist
+ * next to a textbox, f.e. the microsummary picker above the Location field
+ * and other fields in the Bookmarks Properties dialog box.
+ *
+ * Of course, there aren't any text fields here in the Add Bookmark dialog box,
+ * but for consistency with the Bookmark Properties dialog box, we correct
+ * the appearance of the picker here as well.
+ * 
+ */
+
+menulist#name > .menulist-editable-box {
+  /* Normal editable menulists set this to "menulist-textfield". */
+  -moz-appearance: none;
+}
+
+menulist#name {
+  /* These rules come from the textbox element in textbox.css. */
+
+  /* Normal editable menulists set this to "none". */
+  -moz-appearance: textfield;
+
+  /* Follow the rule for normal editable menulists (cursor: auto;) instead of
+   * textboxes (cursor: text;) so the cursor is a pointer over the dropmarker.
+   */
+  /* cursor: text; */
+
+  /* Follow the rule for normal editable menulists (margin: 2px 2px;) instead of
+   * textboxes (margin: 2px 4px;) so the list lines up with the "Create in:"
+   * drop-down menu below it.
+   */
+  /* margin: 2px 4px; */
+
+  border: 2px solid;
+  -moz-border-top-colors: ThreeDShadow ThreeDDarkShadow;
+  -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow;
+  -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
+  -moz-border-left-colors: ThreeDShadow ThreeDDarkShadow;
+  padding: 2px 2px 3px 4px;
+  background-color: -moz-Field;
+  color: -moz-FieldText;
+}
--- a/browser/themes/winstripe/browser/bookmarks/bookmarksProperties.css
+++ b/browser/themes/winstripe/browser/bookmarks/bookmarksProperties.css
@ -0,0 +1,80 @@
+/* ***** BEGIN LICENSE BLOCK *****
+ * Version: MPL 1.1/GPL 2.0/LGPL 2.1
+ *
+ * The contents of this file are subject to the Mozilla Public License Version
+ * 1.1 (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ * http://www.mozilla.org/MPL/
+ *
+ * Software distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
+ * for the specific language governing rights and limitations under the
+ * License.
+ *
+ * The Original Code is Firefox.
+ *
+ * The Initial Developer of the Original Code is Mozilla.
+ * Portions created by the Initial Developer are Copyright (C) 2006
+ * the Initial Developer. All Rights Reserved.
+ *
+ * Contributor(s):
+ *   Myk Melez <myk@mozilla.org>
+ *
+ * Alternatively, the contents of this file may be used under the terms of
+ * either the GNU General Public License Version 2 or later (the "GPL"), or
+ * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
+ * in which case the provisions of the GPL or the LGPL are applicable instead
+ * of those above. If you wish to allow use of your version of this file only
+ * under the terms of either the GPL or the LGPL, and not to allow others to
+ * use your version of this file under the terms of the MPL, indicate your
+ * decision by deleting the provisions above and replace them with the notice
+ * and other provisions required by the GPL or the LGPL. If you do not delete
+ * the provisions above, a recipient may use your version of this file under
+ * the terms of any one of the MPL, the GPL or the LGPL.
+ *
+ * ***** END LICENSE BLOCK ***** */
+
+/* Hide the drop marker if no microsummaries are available. */
+menulist#name[droppable="false"] > .menulist-dropmarker {
+  display: none;
+}
+
+/*
+ * Editable menulists look almost like regular textboxes, but not quite,
+ * which makes it look like something is off a bit when you place a menulist
+ * next to a textbox, f.e. the microsummary picker above the Location field
+ * and other fields in the Bookmarks Properties dialog box.
+ *
+ * These styles correct the appearance of the picker in that dialog box,
+ * making it look just like the textboxes below it.
+ * 
+ */
+
+menulist#name > .menulist-editable-box {
+  /* Normal editable menulists set this to "menulist-textfield". */
+  -moz-appearance: none;
+}
+
+menulist#name {
+  /* These rules come from the textbox element in textbox.css. */
+
+  /* Normal editable menulists set this to "none". */
+  -moz-appearance: textfield;
+
+  /* Follow the rule for normal editable menulists (cursor: auto;) instead of
+   * textboxes (cursor: text;) so the cursor is a pointer over the dropmarker.
+   */
+  /* cursor: text; */
+
+  /* Normal editable menulists set this to "2px 2px". */
+  margin: 2px 4px;
+
+  border: 2px solid;
+  -moz-border-top-colors: ThreeDShadow ThreeDDarkShadow;
+  -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow;
+  -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
+  -moz-border-left-colors: ThreeDShadow ThreeDDarkShadow;
+  padding: 2px 2px 3px 4px;
+  background-color: -moz-Field;
+  color: -moz-FieldText;
+}
--- a/browser/themes/winstripe/browser/jar.mn
+++ b/browser/themes/winstripe/browser/jar.mn
@ -41,6 +41,7 @@ classic.jar:
 #else
        skin/classic/browser/Bookmarks-folder.png
        skin/classic/browser/bookmarks/addBookmark.css          (bookmarks/addBookmark.css)
+        skin/classic/browser/bookmarks/bookmarksProperties.css  (bookmarks/bookmarksProperties.css)
        skin/classic/browser/bookmarks/bookmarksManager.css     (bookmarks/bookmarksManager.css)
        skin/classic/browser/bookmarks/Bookmarks-toolbar.png    (bookmarks/Bookmarks-toolbar.png)
 #endif