Bug 1580247 - remove grid usage from EdAdvancedEdit.xul. r=mkmelin
authorKhushil Mistry <khushil324@gmail.com>
Wed, 11 Sep 2019 12:58:00 +0200
changeset 36781 3971431fe094db61e268f93635f0db68a4d8a902
parent 36780 9705d93a3345f930c3217c9db4be819df53dc7f7
child 36782 35e13c4b6c0dc181adbd22a37acd1c7a112bc172
push id395
push userclokep@gmail.com
push dateMon, 02 Dec 2019 19:38:57 +0000
reviewersmkmelin
bugs1580247
Bug 1580247 - remove grid usage from EdAdvancedEdit.xul. r=mkmelin
mail/components/compose/content/dialogs/EdAdvancedEdit.xul
--- a/mail/components/compose/content/dialogs/EdAdvancedEdit.xul
+++ b/mail/components/compose/content/dialogs/EdAdvancedEdit.xul
@@ -62,46 +62,43 @@
           </treecols>
           <treechildren id="HTMLAList" class="gridlines" flex="1"/>
         </tree>
         <hbox align="center">
           <label value="&editAttribute.label;"/>
           <spacer flex="1"/>
           <button label="&removeAttribute.label;" oncommand="RemoveHTMLAttribute();"/>
         </hbox>
-        <grid>
-          <columns>
-            <column flex="1"/><column flex="1"/>
-          </columns>
-          <rows>
-            <row equalsize="always">
-              <label control="AddHTMLAttributeNameInput" value="&AttName.label;"/>
-              <label control="AddHTMLAttributeValueInput" value="&AttValue.label;"/>
-            </row>
-            <row align="top" equalsize="always">
-              <!-- Lists are built at runtime -->
-              <menulist is="menulist-editable" id="AddHTMLAttributeNameInput"
-                        editable="true" flex="1"
-                        oninput="onInputHTMLAttributeName();"
-                        oncommand="onInputHTMLAttributeName();"/>
-              <deck id="AddHTMLAttributeValueDeck" selectedIndex="0">
-                <hbox align="top">
-                  <textbox id="AddHTMLAttributeValueTextbox" flex="1"
-                           oninput="onInputHTMLAttributeValue();"/>
-                </hbox>
-                <hbox align="top">
-                  <menulist is="menulist-editable" id="AddHTMLAttributeValueMenulist"
-                            editable="true" flex="1"
-                            oninput="onInputHTMLAttributeValue();"
-                            oncommand="onInputHTMLAttributeValue();"/>
-                </hbox>
-              </deck>
-            </row>
-          </rows>
-        </grid>
+        <hbox>
+          <vbox flex="1">
+            <label control="AddHTMLAttributeNameInput" value="&AttName.label;"/>
+            <menulist is="menulist-editable" id="AddHTMLAttributeNameInput"
+                      class="editorAdvancedEditableMenulist"
+                      editable="true" flex="1"
+                      style="margin:5px 2px 3px;"
+                      oninput="onInputHTMLAttributeName();"
+                      oncommand="onInputHTMLAttributeName();"/>
+          </vbox>
+          <vbox flex="1">
+            <label control="AddHTMLAttributeValueInput" value="&AttValue.label;"/>
+            <deck id="AddHTMLAttributeValueDeck" selectedIndex="0">
+              <hbox flex="1">
+                <textbox id="AddHTMLAttributeValueTextbox" flex="1"
+                         oninput="onInputHTMLAttributeValue();"/>
+              </hbox>
+              <hbox flex="1">
+                <menulist is="menulist-editable" id="AddHTMLAttributeValueMenulist"
+                          editable="true" flex="1"
+                          style="margin:5px 2px 3px;"
+                          oninput="onInputHTMLAttributeValue();"
+                          oncommand="onInputHTMLAttributeValue();"/>
+              </hbox>
+            </deck>
+          </vbox>
+        </hbox>
       </vbox>
       <!-- ============================================================== -->
       <!--                         CSS Attributes                         -->
       <!-- ============================================================== -->
       <vbox>
         <tree id="CSSATree" class="AttributesTree" flex="1"
           hidecolumnpicker="true" seltype="single"
           onselect="onSelectCSSTreeItem();"
@@ -114,33 +111,28 @@
           </treecols>
           <treechildren id="CSSAList" class="gridlines" flex="1"/>
         </tree>
         <hbox align="center">
           <label value="&editAttribute.label;"/>
           <spacer flex="1"/>
           <button label="&removeAttribute.label;" oncommand="RemoveCSSAttribute();"/>
         </hbox>
-        <grid>
-          <columns>
-            <column flex="1"/><column flex="1"/>
-          </columns>
-          <rows>
-            <row equalsize="always">
-              <label value="&PropertyName.label;"/>
-              <label value="&AttValue.label;"/>
-            </row>
-            <row align="top" equalsize="always">
-              <textbox id="AddCSSAttributeNameInput" flex="1"
-                oninput="onInputCSSAttributeName();"/>
-          	  <textbox id="AddCSSAttributeValueInput" flex="1"
-                oninput="onChangeCSSAttribute();"/>
-            </row>
-          </rows>
-        </grid>
+        <hbox>
+          <vbox flex="1">
+            <label value="&PropertyName.label;"/>
+            <textbox id="AddCSSAttributeNameInput" flex="1"
+                     oninput="onInputCSSAttributeName();"/>
+          </vbox>
+          <vbox flex="1">
+            <label value="&AttValue.label;"/>
+            <textbox id="AddCSSAttributeValueInput" flex="1"
+                     oninput="onChangeCSSAttribute();"/>
+          </vbox>
+        </hbox>
       </vbox>
       <!-- ============================================================== -->
       <!--                    JavaScript Event Handlers                   -->
       <!-- ============================================================== -->
       <vbox>
         <tree id="JSEATree" class="AttributesTree" flex="1"
           hidecolumnpicker="true" seltype="single"
           onselect="onSelectJSETreeItem();"
@@ -153,30 +145,24 @@
           </treecols>
           <treechildren id="JSEAList" class="gridlines" flex="1"/>
         </tree>
         <hbox align="center">
           <label value="&editAttribute.label;"/>
           <spacer flex="1"/>
           <button label="&removeAttribute.label;" oncommand="RemoveJSEAttribute()"/>
         </hbox>
-        <grid>
-          <columns>
-            <column flex="1"/><column flex="1"/>
-          </columns>
-          <rows>
-            <row equalsize="always">
-              <label value="&AttName.label;"/>
-              <label value="&AttValue.label;"/>
-            </row>
-            <row align="top" equalsize="always">
-              <!-- List is built at runtime -->
-              <menulist id="AddJSEAttributeNameList" flex="1"
-                oncommand="onSelectJSEAttribute();"/>
-          	  <textbox id="AddJSEAttributeValueInput" flex="1"
-                oninput="onInputJSEAttributeValue();"/>
-            </row>
-          </rows>
-        </grid>
+        <hbox>
+          <vbox flex="1">
+            <label value="&AttName.label;"/>
+            <menulist id="AddJSEAttributeNameList"
+                      oncommand="onSelectJSEAttribute();"/>
+          </vbox>
+          <vbox flex="1">
+            <label value="&AttValue.label;"/>
+            <textbox id="AddJSEAttributeValueInput"
+                     oninput="onInputJSEAttributeValue();"/>
+          </vbox>
+        </hbox>
       </vbox>
     </tabpanels>
   </tabbox>
 </dialog>