Web Inspector: RTL: box model labels have bad alignment
authorbburg@apple.com <bburg@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 8 May 2017 23:41:14 +0000 (23:41 +0000)
committerbburg@apple.com <bburg@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 8 May 2017 23:41:14 +0000 (23:41 +0000)
https://bugs.webkit.org/show_bug.cgi?id=171817

Reviewed by Joseph Pecoraro.

* UserInterface/Views/BoxModelDetailsSectionRow.css:
(.details-section .row.box-model .label):
(body[dir=ltr] .details-section .row.box-model .label):
(body[dir=rtl] .details-section .row.box-model .label):
We can't just use a mirrored leading margin because all the
text here is center-aligned. Just hardcode a reasonable value.

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

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.css

index f564242..06dca37 100644 (file)
@@ -1,3 +1,17 @@
+2017-05-08  Brian Burg  <bburg@apple.com>
+
+        Web Inspector: RTL: box model labels have bad alignment
+        https://bugs.webkit.org/show_bug.cgi?id=171817
+
+        Reviewed by Joseph Pecoraro.
+
+        * UserInterface/Views/BoxModelDetailsSectionRow.css:
+        (.details-section .row.box-model .label):
+        (body[dir=ltr] .details-section .row.box-model .label):
+        (body[dir=rtl] .details-section .row.box-model .label):
+        We can't just use a mirrored leading margin because all the
+        text here is center-aligned. Just hardcode a reasonable value.
+
 2017-05-08  Joseph Pecoraro  <pecoraro@apple.com>
 
         Web Inspector: Request/Response toggles not working
index 44ca958..ff9e874 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013-2017 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
 .details-section .row.box-model .label {
     position: absolute;
     color: black;
+    padding: 0 2px;
+}
+
+body[dir=ltr] .details-section .row.box-model .label {
     margin-left: 3px;
-    padding-left: 2px;
-    padding-right: 2px;
+}
+
+body[dir=rtl] .details-section .row.box-model .label {
+    margin-right: 16px;
 }
 
 .details-section .row.box-model :matches(.position, .margin, .border, .padding, .content) {