Reviewed by Maciej.

        - omit the margin and padding boxes for display types where they are ignored
        - use CSS instead of properties for table spacing and padding as suggested by Tim H.

        * WebInspector/webInspector/inspector.css: Added rules for spacing and padding.
        Added rules that hide the margin and padding boxes (borders and all but the center cell)
        when the hide attribute is present.
        * WebInspector/webInspector/inspector.html: Added classes for the rules above.
        Removed cellpadding and cellspacing attributes.
        * WebInspector/webInspector/inspector.js: Added code to hide/show the margin and
        padding boxes based on the display type.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@15729 268f45cc-cd09-0410-ab3c-d52691b4dbfc

diff --git a/WebKit/ChangeLog b/WebKit/ChangeLog
index 926883d8237d0965df7a1be7f3f3f03e92ed5d8d..844ac0a982360375992a299c59158f04f380801a 100644 (file)
--- a/WebKit/ChangeLog
+++ b/WebKit/ChangeLog
@@ -1,3 +1,18 @@
+2006-07-31  Darin Adler  <darin@apple.com>
+
+        Reviewed by Maciej.
+
+        - omit the margin and padding boxes for display types where they are ignored
+        - use CSS instead of properties for table spacing and padding as suggested by Tim H.
+
+        * WebInspector/webInspector/inspector.css: Added rules for spacing and padding.
+        Added rules that hide the margin and padding boxes (borders and all but the center cell)
+        when the hide attribute is present.
+        * WebInspector/webInspector/inspector.html: Added classes for the rules above.
+        Removed cellpadding and cellspacing attributes.
+        * WebInspector/webInspector/inspector.js: Added code to hide/show the margin and
+        padding boxes based on the display type.
+
 2006-07-31  Duncan Wilcox  <duncan@mclink.it>
 
         Reviewed by Darin.

diff --git a/WebKit/WebInspector/webInspector/inspector.css b/WebKit/WebInspector/webInspector/inspector.css
index 87e4ac37f403711e807babff99bbbe938939f906..6710c6d4f0b9dead048592f0e4134d14ea4e7f0b 100644 (file)
--- a/WebKit/WebInspector/webInspector/inspector.css
+++ b/WebKit/WebInspector/webInspector/inspector.css
@@ -876,9 +876,14 @@ button.toggle.right {
     color: rgb(255,255,180);
 }
 
+.boxModelTable {
+    border-spacing: 0px;
+}
+
 .boxModelTable td {
     text-align: center;
     min-width: 10px;
+    padding: 0px;
 }
 
 .boxModelTable .horizontalCell {
@@ -921,3 +926,11 @@ button.toggle.right {
     text-align: center;
     margin-top: 40%;
 }
+
+#marginBoxTable[hide], #paddingBoxTable[hide] {
+    border: 0px
+}
+
+#marginBoxTable[hide] .marginBox, #paddingBoxTable[hide] .paddingBox {
+    display: none
+}

diff --git a/WebKit/WebInspector/webInspector/inspector.html b/WebKit/WebInspector/webInspector/inspector.html
index e995960008274082661d54fed5d7b58b5367ac69..4b7d1bc23e5e90ccf9d6f902ab031a0853b2b820 100644 (file)
--- a/WebKit/WebInspector/webInspector/inspector.html
+++ b/WebKit/WebInspector/webInspector/inspector.html
@@ -109,24 +109,29 @@ THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
     </div>
     <div id="metricsPane" class="pane" style="display: none">
         <div id="noMetrics" style="display: none">No metrics</div>
-        <table class="boxModelTable" id="marginBoxTable" cellpadding=0 cellspacing=0>
-            <tr><td valign="top"><div style="position:relative"><div class="boxModelLabel">margin</div></div></td><td id="margin-top"></td><td></td></tr>
-            <tr><td class="horizontalCell" id="margin-left"></td><td>
-                <table class="boxModelTable" id="borderBoxTable" cellpadding=0 cellspacing=0>
-                    <tr><td valign="top"><div style="position:relative"><div class="boxModelLabel">border</div></div></td><td id="border-top"></td><td></td></tr>
+        <table class="boxModelTable" id="marginBoxTable">
+            <tr class="marginBox">
+                <td valign="top"><div style="position:relative"><div class="boxModelLabel">margin</div></div></td>
+                <td id="margin-top"></td><td></td></tr>
+            <tr><td class="marginBox horizontalCell" id="margin-left"></td><td>
+                <table class="boxModelTable" id="borderBoxTable">
+                    <tr><td valign="top"><div style="position:relative"><div class="boxModelLabel">border</div></div></td>
+                        <td id="border-top"></td><td></td></tr>
                     <tr><td class="horizontalCell" id="border-left"></td><td>
-                        <table class="boxModelTable" id="paddingBoxTable" cellpadding=0 cellspacing=0>
-                            <tr><td valign="top"><div style="position:relative"><div class="boxModelLabel">padding</div></div></td><td id="padding-top"></td><td></td></tr>
-                            <tr><td class="horizontalCell" id="padding-left"></td><td>
-                                <div id="content"></div></div>
-                            </td><td class="horizontalCell" id="padding-right"></td></tr>
-                            <tr><td></td><td id="padding-bottom"></td><td></td></tr>
+                        <table class="boxModelTable" id="paddingBoxTable">
+                            <tr class="paddingBox">
+                                <td valign="top"><div style="position:relative"><div class="boxModelLabel">padding</div></div></td>
+                                <td id="padding-top"></td><td></td></tr>
+                            <tr><td class="paddingBox horizontalCell" id="padding-left"></td><td>
+                                <div id="content"></div>
+                            </td><td class="paddingBox horizontalCell" id="padding-right"></td></tr>
+                            <tr class="paddingBox"><td></td><td id="padding-bottom"></td><td></td></tr>
                         </table>
                     </td><td class="horizontalCell" id="border-right"></td></tr>
                     <tr><td></td><td id="border-bottom"></td><td></td></tr>
                 </table>
-            </td><td class="horizontalCell" id="margin-right"></td></tr>
-            <tr><td></td><td id="margin-bottom"></td><td></td></tr>
+            </td><td class="marginBox horizontalCell" id="margin-right"></td></tr>
+            <tr class="marginBox"><td></td><td id="margin-bottom"></td><td></td></tr>
         </table>
     </div>
     <div id="propertiesPane" class="pane" style="display: none">

diff --git a/WebKit/WebInspector/webInspector/inspector.js b/WebKit/WebInspector/webInspector/inspector.js
index 7f5328c16145af5e083a6a08123c8b9992d5cc86..f841f3594452aee755abee79dc0f0429ef027e1a 100644 (file)
--- a/WebKit/WebInspector/webInspector/inspector.js
+++ b/WebKit/WebInspector/webInspector/inspector.js
@@ -140,6 +140,27 @@ var valueNickname = {
     "rgba(0, 0, 0, 0)": "transparent",
 };
 
+// Display types for which margin is ignored.
+var noMarginDisplayType = {
+    "table-cell": "no",
+    "table-column": "no",
+    "table-column-group": "no",
+    "table-footer-group": "no",
+    "table-header-group": "no",
+    "table-row": "no",
+    "table-row-group": "no",
+};
+
+// Display types for which padding is ignored.
+var noPaddingDisplayType = {
+    "table-column": "no",
+    "table-column-group": "no",
+    "table-footer-group": "no",
+    "table-header-group": "no",
+    "table-row": "no",
+    "table-row-group": "no",
+};
+
 function setUpScrollbar(id)
 {
     var bar = new AppleVerticalScrollbar(document.getElementById(id));
@@ -823,6 +844,16 @@ function updateMetricsPane()
         + " \u00D7 "
         + style.getPropertyValue("height").replace(/px$/, "");
     document.getElementById("content").textContent = size;
+
+    if (noMarginDisplayType[style.display] == "no")
+        document.getElementById("marginBoxTable").setAttribute("hide", "yes");
+    else
+        document.getElementById("marginBoxTable").removeAttribute("hide");
+
+    if (noPaddingDisplayType[style.display] == "no")
+        document.getElementById("paddingBoxTable").setAttribute("hide", "yes");
+    else
+        document.getElementById("paddingBoxTable").removeAttribute("hide");
 }
 
 function updatePropertiesPane()