Tweak sidebar styles. r=german.

suite/common/sidebar/customize.xul

@@ -27,6 +27,7 @@
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   onload="Init();" 
   id="main-box"
+  class="dialog"
   align="vertical">
 
   <!-- Dialog title -->
@@ -81,6 +82,9 @@
           disabled="true"/>
       </box>
     </box> 
+    
+    <!-- Spacing between the left and right halves of the dialog -->
+    <spring style="width:2em"/>
 
     <!-- The panels that the user currently has chosen -->
     <box align="vertical" flex="1*">
@@ -117,6 +121,9 @@
           </tree>
         </html:div>
 
+       <!-- Spacing between the right selector and "Reorder" -->
+       <spring style="width:5px"/>
+
         <!-- The 'reorder' buttons -->
         <box align="vertical">
           <spring flex="50%"/>

suite/common/sidebar/preview.xul

@@ -17,8 +17,6 @@
   Reserved.
 
 -->
-<?xml-stylesheet href="chrome://sidebar/skin/" type="text/css"?>
-<?xml-stylesheet href="chrome://sidebar/skin/customize.css" type="text/css"?>
 <?xml-stylesheet href="chrome://sidebar/skin/preview.css" type="text/css"?>
 
 <!DOCTYPE window SYSTEM "chrome://sidebar/locale/preview.dtd" >
@@ -28,6 +26,7 @@
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   onload="Init();"
+  class="dialog"
   align="vertical">
 
 <html:script src="chrome://sidebar/content/preview.js" />
@@ -40,13 +39,10 @@
     <html:hr />
   </html:div>
 
-  <box align="horizontal" class="panelbar">
-    <html:img src="chrome://sidebar/skin/corner.gif" />
-    <titledbutton id="paneltitle" class="plain paneltitle" />
-    <spring flex="100%" />
-  </box>
+  <titledbutton id="paneltitle" class="plain paneltitle" align="left"/>
 
-  <html:iframe id="previewframe" type="content" src="about:blank" flex="100%"/>
+  <html:iframe id="previewframe" type="content" src="about:blank" 
+    style="height:200px; width:162px" />
 
   <box align="horizontal">
     <spring flex="50%"/>

suite/common/sidebar/sidebarOverlay.css

@@ -43,7 +43,7 @@ splitter#sidebar-splitter grippy:active {
 
 box#sidebar-box {
   margin-top: 2px;
-  width: 200px;
+  width: 162px;
   min-height: 0px;
   min-width: 10px;
   max-width: 400px;
@@ -89,6 +89,7 @@ splitter.sidebar-main-header titledbutton:hover {
 
 titledbutton.panel-bar {
   padding: 0px;
+  margin: 0px;
   border-top: 1px solid white;
   background-color: #CCCCCC;
   padding: 0px;

xpfe/components/sidebar/resources/customize.css

@@ -27,12 +27,7 @@
 }
 
 div.title {
-  font: 5mm tahoma,arial,helvetica,sans-serif;
-  margin: 2px;
-}
-
-div.subtitle {
-  font: 3mm tahoma,arial,helvetica,sans-serif;
+  font-weight: bold;
   margin: 2px;
 }
 
@@ -45,6 +40,7 @@ box.button-group {
 
 /* These rules apply appropriate images to the 'reorder' buttons */
 titledbutton.up {
+  min-width: 1em;
   list-style-image:url("chrome://sidebar/skin/list-up.gif");
 }
 
@@ -53,6 +49,7 @@ titledbutton.up[disabled="true"] {
 }
 
 titledbutton.down {
+  min-width: 1em;
   list-style-image:url("chrome://sidebar/skin/list-down.gif");
 }
 

xpfe/components/sidebar/resources/customize.xul

@@ -27,6 +27,7 @@
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   onload="Init();" 
   id="main-box"
+  class="dialog"
   align="vertical">
 
   <!-- Dialog title -->
@@ -81,6 +82,9 @@
           disabled="true"/>
       </box>
     </box> 
+    
+    <!-- Spacing between the left and right halves of the dialog -->
+    <spring style="width:2em"/>
 
     <!-- The panels that the user currently has chosen -->
     <box align="vertical" flex="1*">
@@ -117,6 +121,9 @@
           </tree>
         </html:div>
 
+       <!-- Spacing between the right selector and "Reorder" -->
+       <spring style="width:5px"/>
+
         <!-- The 'reorder' buttons -->
         <box align="vertical">
           <spring flex="50%"/>

xpfe/components/sidebar/resources/preview.css

@@ -22,3 +22,7 @@
 
 */
 
+iframe#previewframe {
+ min-width: 162px;
+ min-height: 200px;
+}

xpfe/components/sidebar/resources/preview.xul

@@ -17,8 +17,6 @@
   Reserved.
 
 -->
-<?xml-stylesheet href="chrome://sidebar/skin/" type="text/css"?>
-<?xml-stylesheet href="chrome://sidebar/skin/customize.css" type="text/css"?>
 <?xml-stylesheet href="chrome://sidebar/skin/preview.css" type="text/css"?>
 
 <!DOCTYPE window SYSTEM "chrome://sidebar/locale/preview.dtd" >
@@ -28,6 +26,7 @@
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   onload="Init();"
+  class="dialog"
   align="vertical">
 
 <html:script src="chrome://sidebar/content/preview.js" />
@@ -40,13 +39,10 @@
     <html:hr />
   </html:div>
 
-  <box align="horizontal" class="panelbar">
-    <html:img src="chrome://sidebar/skin/corner.gif" />
-    <titledbutton id="paneltitle" class="plain paneltitle" />
-    <spring flex="100%" />
-  </box>
+  <titledbutton id="paneltitle" class="plain paneltitle" align="left"/>
 
-  <html:iframe id="previewframe" type="content" src="about:blank" flex="100%"/>
+  <html:iframe id="previewframe" type="content" src="about:blank" 
+    style="height:200px; width:162px" />
 
   <box align="horizontal">
     <spring flex="50%"/>

xpfe/components/sidebar/resources/sidebarOverlay.css

@@ -43,7 +43,7 @@ splitter#sidebar-splitter grippy:active {
 
 box#sidebar-box {
   margin-top: 2px;
-  width: 200px;
+  width: 162px;
   min-height: 0px;
   min-width: 10px;
   max-width: 400px;
@@ -89,6 +89,7 @@ splitter.sidebar-main-header titledbutton:hover {
 
 titledbutton.panel-bar {
   padding: 0px;
+  margin: 0px;
   border-top: 1px solid white;
   background-color: #CCCCCC;
   padding: 0px;