Bug 658872 - Move the splitter on top of the FormatToolbar; r=bwinton ui-r=andreasn
authorRichard Marti <richard.marti@gmail.com>
Mon, 04 Jul 2011 10:57:01 +0100
changeset 8260 585da56d82a4e207ebc0a8294d69ee52ec21aac2
parent 8259 f6adf57025405e094d7e12a426427b6eb319a94d
child 8261 30308622251ceb232ef938c6d1ebabf56a11cdf1
push id84
push userbugzilla@standard8.plus.com
push dateTue, 16 Aug 2011 21:25:04 +0000
treeherdercomm-beta@6970c86be3cd [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbwinton, andreasn
bugs658872
Bug 658872 - Move the splitter on top of the FormatToolbar; r=bwinton ui-r=andreasn
mail/components/compose/content/messengercompose.xul
mail/themes/pinstripe/mail/compose/messengercompose.css
mail/themes/qute/mail/compose/messengercompose-aero.css
mail/themes/qute/mail/compose/messengercompose.css
--- a/mail/components/compose/content/messengercompose.xul
+++ b/mail/components/compose/content/messengercompose.xul
@@ -758,19 +758,23 @@
           <listbox seltype="multiple" id="attachmentBucket" flex="1" rows="4"
                    tabindex="0"
                    context="msgComposeAttachmentContext"
                    onkeypress="if (event.keyCode == 8 || event.keyCode == 46) RemoveSelectedAttachment();"
                    onclick="AttachmentBucketClicked(event);"
                    ondraggesture="nsDragAndDrop.startDrag(event, attachmentBucketDNDObserver);"/>
         </vbox>
       </hbox>
-    </toolbar>   
+    </toolbar>
+  </toolbox>
 
-    <!-- These toolbar items get filled out from the editorOverlay -->
+  <splitter id="compose-toolbar-sizer" onmousedown="awSizerListen()"/>
+
+  <!-- These toolbar items get filled out from the editorOverlay -->
+  <toolbox id="FormatToolbox" mode="icons">
     <toolbar class="chromeclass-toolbar" id="FormatToolbar" persist="collapsed"
              customizable="true" nowindowdrag="true">
       <toolbaritem id="paragraph-select-container"/>
       <toolbaritem id="font-face-select-container"/>
       <toolbaritem id="color-buttons-container"
                    disableoncustomize="true"/>
       <toolbarbutton id="DecreaseFontSizeButton"/>
       <toolbarbutton id="IncreaseFontSizeButton"/>
@@ -826,18 +830,16 @@
           <menuitem id="smileySealed" class="menuitem-iconic" label="&smiley16Cmd.label;"
                     oncommand="doStatefulCommand('cmd_smiley', ':-X' )"/>
         </menupopup>
       </toolbarbutton>
       <spacer flex="1"/>
     </toolbar>
   </toolbox>
 
-  <splitter id="compose-toolbar-sizer" onmousedown="awSizerListen()"/>
-
   <!-- The mail message body frame -->
   <vbox id="appcontent" flex="1">
     <editor type="content-primary" id="content-frame" src="about:blank" name="browser.message.body" flex="1"
             context="msgComposeContext"/>
   </vbox>
 
   </vbox>
   </hbox>
--- a/mail/themes/pinstripe/mail/compose/messengercompose.css
+++ b/mail/themes/pinstripe/mail/compose/messengercompose.css
@@ -355,16 +355,20 @@ toolbar[iconsize="small"] #paste-button[
   border-bottom: none;
   height: 7px;
 }
 
 #attachmentBucketSize {
   color: #888a85;
 }
 
+#appcontent {
+  border-top: 1px solid #cccccc;
+}
+
 /* ::::: attachment reminder ::::: */
 
 #attachmentNotificationBox > notification .messageImage {
   width: 32px;
   height: 32px;
   background-image: url(chrome://messenger/skin/messengercompose/compose-toolbar.png);
   background-position: -96px top;
 }
@@ -383,20 +387,16 @@ toolbar[iconsize="small"] #paste-button[
 
 /* XXX I should really have a selector rule here to select just .listcell-icon objects underneath the attachmentList listbox */
 
 .listcell-icon {
   -moz-margin-start: 2px;
   margin-top: 2px;
 }
 
-#compose-toolbar-sizer {
-  border-bottom: 1px solid #cccccc;
-}
-
 #msgSubject {
   -moz-margin-start: 1px;
   -moz-margin-end: 1px;
 }
 
 /* ::::: autocomplete icons ::::: */
 
 treechildren::-moz-tree-cell-text(default-match) {
@@ -495,17 +495,17 @@ treechildren::-moz-tree-image(remote-err
   text-align: start;
 }
 
 /* ::::: format toolbar ::::: */
 
 #FormatToolbar {
   border-bottom: none;
   background-image: none;
-  padding-top: 5px;
+  padding-top: 2px;
 }
 
 toolbarbutton.formatting-button {
   height: 26px;
   padding: 3px 0px 2px;
   margin: 0px;
   border-left: 0px;
   border-right: 0px;
--- a/mail/themes/qute/mail/compose/messengercompose-aero.css
+++ b/mail/themes/qute/mail/compose/messengercompose-aero.css
@@ -82,17 +82,17 @@ toolbar:not(:-moz-lwtheme) {
   min-height: 132px;
 }
 
 /* ::::: primary toolbar buttons ::::: */
 
 .toolbarbutton-menubutton-button,
 .toolbarbutton-menubutton-dropmarker,
 .toolbarbutton-1,
-#headers-box menulist {
+menulist {
   -moz-appearance: none;
   padding: 1px 5px !important;
   background: rgba(151, 152, 153, .05)
               -moz-linear-gradient(rgba(251, 252, 253, .95),
               rgba(246, 247, 248, .47) 49%, rgba(231, 232, 233, .45) 51%,
               rgba(225, 226, 229, .3));
   border-radius: 3.5px;
   border: 1px solid;
@@ -155,30 +155,30 @@ toolbar[iconsize="small"][mode="icons"] 
 }
 
 .toolbarbutton-menubutton-button[disabled="true"],
 .toolbarbutton-menubutton-dropmarker[disabled="true"],
 .toolbarbutton-1[disabled="true"] {
   opacity: .8;
 }
 
-#headers-box menulist[disabled="true"] {
+menulist[disabled="true"] {
   opacity: .6;
 }
 
 .toolbarbutton-menubutton-button[disabled="true"] > .toolbarbutton-icon,
 .toolbarbutton-1[disabled="true"] > .toolbarbutton-icon {
   opacity: .5;
 }
 
 .toolbarbutton-menubutton-button:not([disabled="true"]):not(:active):hover,
 toolbarbutton[type="menu-button"]:not([open="true"]):not(:active):hover >
                   .toolbarbutton-menubutton-dropmarker:not([disabled="true"]),
 .toolbarbutton-1:not([disabled="true"]):not([checked="true"]):not(:active):hover,
-#headers-box menulist:not([disabled="true"]):not([open="true"]):hover {
+menulist:not([disabled="true"]):not([open="true"]):hover {
   background-color: hsla(190, 60%, 70%, .5);
   border-color: hsla(190, 50%, 65%, .8) hsla(190, 50%, 50%, .8)
                 hsla(190, 50%, 40%, .8);
   box-shadow: 0 0 0 1px rgba(255, 255, 255, .3) inset,
               0 0 0 2px rgba(255, 255, 255, .1) inset,
               0 0 5px hsl(190, 90%, 80%);
   -moz-transition: background-color .4s ease-in,
                    border-color .3s ease-in,
@@ -188,17 +188,17 @@ toolbarbutton[type="menu-button"]:not([o
 .toolbarbutton-menubutton-button:not([disabled="true"]):hover:active,
 toolbarbutton[type="menu-button"]:hover:active >
                    .toolbarbutton-menubutton-dropmarker:not([disabled="true"]),
 toolbarbutton[type="menu-button"][open="true"] >
                                           .toolbarbutton-menubutton-dropmarker,
 .toolbarbutton-1:not([disabled="true"]):hover:active,
 .toolbarbutton-1[checked="true"],
 .toolbarbutton-1[open="true"],
-#headers-box menulist[open="true"] {
+menulist[open="true"] {
   background-color: transparent;
   border-color: rgba(0, 0, 0, .65) rgba(0, 0, 0, .55) rgba(0, 0, 0, .5);
   box-shadow: 0 0 9px rgba(0, 0, 0, .4) inset,
                    0 0 3px rgba(0, 0, 0, .4) inset,
                    0 1px 0 rgba(255, 255, 255, .4);
   text-shadow: none;
 }
 
@@ -242,17 +242,18 @@ toolbar[iconsize="small"] .toolbarbutton
 toolbox[labelalign="end"] > toolbar[mode="full"] .toolbarbutton-1 .toolbarbutton-text {
   -moz-padding-start: 2px;
 }
 
 toolbox[labelalign="end"] > toolbar[mode="full"] deck .toolbarbutton-text {
   text-align: start;
 }
 
-#headers-box {
+#headers-box,
+#FormatToolbox {
   border-top-width: 0;
 }
 
 @media all and (-moz-windows-compositor) {
   #msgcomposeWindow {
     -moz-appearance: -moz-win-borderless-glass;
     background: transparent;
   }
@@ -491,17 +492,17 @@ toolbox[labelalign="end"] > toolbar[mode
   -moz-appearance: none;
   border:none;
   background-color: transparent;
 }
 
 /* ::::: format toolbar ::::: */
 
 #FormatToolbar {
-  padding-top: 3px;
+  border-top: 1px solid ThreeDShadow !important;
 }
 
 toolbarbutton.formatting-button {
   list-style-image: url("chrome://messenger/skin/messengercompose/format-buttons.png");
 }
 
 #FormatToolbar > toolbarbutton > .toolbarbutton-text {
   display: none;
--- a/mail/themes/qute/mail/compose/messengercompose.css
+++ b/mail/themes/qute/mail/compose/messengercompose.css
@@ -443,16 +443,24 @@ toolbar[iconsize="small"] #paste-button[
 }
 
 #MsgHeadersToolbar {
   min-height: 132px;
 }
 
 /* ::::: format toolbar ::::: */
 
+#FormatToolbox {
+  border-top-width: 0;
+}
+
+#FormatToolbar {
+  border-top: 1px solid ThreeDHighlight !important;
+}
+
 toolbarbutton.formatting-button {
   list-style-image: url("chrome://messenger/skin/messengercompose/format-buttons.png");
 }
  
 #FormatToolbar > toolbarbutton > .toolbarbutton-text {
   display: none;
 }