Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (242767 => 242768)
--- trunk/Source/WebInspectorUI/ChangeLog 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/ChangeLog 2019-03-12 03:22:29 UTC (rev 242768)
@@ -1,5 +1,52 @@
2019-03-11 Devin Rousso <[email protected]>
+ Web Inspector: use -webkit-{margin,padding}-{start,end} instead of [dir={ltr/rtl}] rules
+ https://bugs.webkit.org/show_bug.cgi?id=195569
+ <rdar://problem/48778727>
+
+ Reviewed by Matt Baker.
+
+ * UserInterface/Debug/UncaughtExceptionReporter.css:
+ * UserInterface/Views/BoxModelDetailsSectionRow.css:
+ * UserInterface/Views/BreakpointActionView.css:
+ * UserInterface/Views/BreakpointPopoverController.css:
+ * UserInterface/Views/CPUTimelineView.css:
+ * UserInterface/Views/CallFrameTreeElement.css:
+ * UserInterface/Views/CallFrameView.css:
+ * UserInterface/Views/DOMTreeContentView.css:
+ * UserInterface/Views/DOMTreeOutline.css:
+ * UserInterface/Views/DashboardContainerView.css:
+ * UserInterface/Views/DataGrid.css:
+ * UserInterface/Views/DebuggerDashboardView.css:
+ * UserInterface/Views/DebuggerSidebarPanel.css:
+ * UserInterface/Views/DefaultDashboardView.css:
+ * UserInterface/Views/DetailsSection.css:
+ * UserInterface/Views/FilterBar.css:
+ * UserInterface/Views/FindBanner.css:
+ * UserInterface/Views/FontResourceContentView.css:
+ * UserInterface/Views/GeneralStyleDetailsSidebarPanel.css:
+ * UserInterface/Views/HierarchicalPathComponent.css:
+ * UserInterface/Views/LayerTreeDetailsSidebarPanel.css:
+ * UserInterface/Views/Main.css:
+ * UserInterface/Views/NetworkTableContentView.css:
+ * UserInterface/Views/OpenResourceDialog.css:
+ * UserInterface/Views/RecordingActionTreeElement.css:
+ * UserInterface/Views/ScopeRadioButtonNavigationItem.css:
+ * UserInterface/Views/SettingsTabContentView.css:
+ * UserInterface/Views/ThreadTreeElement.css:
+ * UserInterface/Views/Toolbar.css:
+ * UserInterface/Views/TreeOutline.css:
+ * UserInterface/Views/TypeTreeElement.css:
+ * UserInterface/Views/TypeTreeView.css:
+ * UserInterface/Views/URLBreakpointPopover.css:
+ * UserInterface/Views/WebSocketContentView.css:
+
+ * UserInterface/Views/RecordingActionTreeElement.js:
+ (WI.RecordingActionTreeElement.static _getClassNames):
+ Replace class `.action` with `.recording-action` for better uniqueness/clarity.
+
+2019-03-11 Devin Rousso <[email protected]>
+
Web Inspector: DOMDebugger: protocol error on first open
https://bugs.webkit.org/show_bug.cgi?id=195248
<rdar://problem/48538465>
Modified: trunk/Source/WebInspectorUI/UserInterface/Debug/UncaughtExceptionReporter.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Debug/UncaughtExceptionReporter.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Debug/UncaughtExceptionReporter.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -36,25 +36,14 @@
.uncaught-exception-sheet {
min-width: 400px;
+ -webkit-margin-start: 65px;
+ -webkit-margin-end: 55px;
padding: 50px 0;
font-family: -webkit-system-font, sans-serif;
font-size: 11pt;
color: hsl(0, 0%, 40%);
-
- --uncaught-exception-sheet-margin-start: 65px;
- --uncaught-exception-sheet-margin-end: 55px;
}
-body[dir=ltr] .uncaught-exception-sheet {
- margin-left: var(--uncaught-exception-sheet-margin-start);
- margin-right: var(--uncaught-exception-sheet-margin-end);
-}
-
-body[dir=rtl] .uncaught-exception-sheet {
- margin-left: var(--uncaught-exception-sheet-margin-end);
- margin-right: var(--uncaught-exception-sheet-margin-start);
-}
-
.uncaught-exception-sheet a {
text-decoration: underline;
color: hsl(240, 55%, 30%);
@@ -84,18 +73,15 @@
position: relative;
height: 35px;
margin-top: -5px;
-
- --uncaught-exception-sheet-h1-img-margin-start: -50px;
+ -webkit-margin-start: -50px;
}
body[dir=ltr] .uncaught-exception-sheet h1 > img {
float: left;
- margin-left: var(--uncaught-exception-sheet-h1-img-margin-start);
}
body[dir=rtl] .uncaught-exception-sheet h1 > img {
float: right;
- margin-right: var(--uncaught-exception-sheet-h1-img-margin-start);
}
.uncaught-exception-sheet h2 > img {
@@ -102,18 +88,15 @@
position: relative;
height: 25px;
margin-top: 0;
-
- --uncaught-exception-sheet-h2-img-margin-start: -45px;
+ -webkit-margin-start: -45px;
}
body[dir=ltr] .uncaught-exception-sheet h2 > img {
float: left;
- margin-left: var(--uncaught-exception-sheet-h2-img-margin-start);
}
body[dir=rtl] .uncaught-exception-sheet h2 > img {
float: right;
- margin-right: var(--uncaught-exception-sheet-h2-img-margin-start);
}
.uncaught-exception-sheet dl {
@@ -127,38 +110,20 @@
.uncaught-exception-sheet dd {
margin: 10px 0 20px;
+ -webkit-margin-start: 10px;
font-size: 13px;
line-height: 18px;
-
- --uncaught-exception-sheet-dd-margin-start: 10px;
}
-body[dir=ltr] .uncaught-exception-sheet dd {
- margin-left: var(--uncaught-exception-sheet-dd-margin-start);
-}
-
-body[dir=rtl] .uncaught-exception-sheet dd {
- margin-right: var(--uncaught-exception-sheet-dd-margin-start);
-}
-
.uncaught-exception-sheet ul {
margin: 0;
+ -webkit-margin-start: 2px;
padding: 0;
font-family: Menlo, monospace;
font-size: 12px;
line-height: 18px;
-
- --uncaught-exception-sheet-ul-margin-start: 2px;
}
-body[dir=ltr] .uncaught-exception-sheet ul {
- margin-left: var(--uncaught-exception-sheet-ul-margin-start);
-}
-
-body[dir=rtl] .uncaught-exception-sheet ul {
- margin-right: var(--uncaught-exception-sheet-ul-margin-start);
-}
-
.uncaught-exception-sheet li {
margin-bottom: 20px;
word-break: break-word;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -35,14 +35,6 @@
padding: 0 2px;
}
-body[dir=ltr] .details-section .row.box-model .label {
- margin-left: 3px;
-}
-
-body[dir=rtl] .details-section .row.box-model .label {
- margin-right: 16px;
-}
-
.details-section .row.box-model :matches(.position, .margin, .border, .padding, .content) {
border: 1px solid grey;
background-color: white;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointActionView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointActionView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointActionView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -40,21 +40,12 @@
width: 13px;
height: 13px;
margin-top: 2px;
+ -webkit-margin-start: 5px;
background-color: transparent;
border: none;
opacity: 0.6;
-
- --breakpoint-action-button-margin-start: 5px;
}
-body[dir=ltr] :matches(.breakpoint-action-append-button, .breakpoint-action-remove-button) {
- margin-left: var(--breakpoint-action-button-margin-start);
-}
-
-body[dir=rtl] :matches(.breakpoint-action-append-button, .breakpoint-action-remove-button) {
- margin-right: var(--breakpoint-action-button-margin-start);
-}
-
.breakpoint-action-append-button {
background-image: url(../Images/Plus13.svg);
}
@@ -74,21 +65,12 @@
}
.breakpoint-action-block-body > .description {
+ margin-top: 6px;
+ -webkit-margin-end: 2px;
+ text-align: right;
color: var(--text-color-gray-medium);
- text-align: right;
- margin-top: 6px;
-
- --breakpoint-action-block-body-description-margin-end: 2px;
}
-body[dir=ltr] .breakpoint-action-block-body > .description {
- margin-right: var(--breakpoint-action-block-body-description-margin-end);
-}
-
-body[dir=rtl] .breakpoint-action-block-body > .description {
- margin-left: var(--breakpoint-action-block-body-description-margin-end);
-}
-
.breakpoint-action-block-body > input {
width: 100%;
text-align: left;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointPopoverController.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointPopoverController.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointPopoverController.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -26,8 +26,6 @@
.popover .edit-breakpoint-popover-content {
width: 420px;
padding: 5px 15px;
-
- --edit-breakpoint-popover-option-margin-end: 4px;
}
.popover .edit-breakpoint-popover-content.wide {
@@ -79,16 +77,12 @@
width: 40px;
}
-body[dir=ltr] :matches(#edit-breakpoint-popover-ignore, #edit-breakpoint-popover-auto-continue) {
- margin-right: var(--edit-breakpoint-popover-option-margin-end);
- margin-left: 0;
+#edit-breakpoint-popover-ignore,
+#edit-breakpoint-popover-auto-continue {
+ -webkit-margin-start: 0;
+ -webkit-margin-end: 4px;
}
-body[dir=rtl] :matches(#edit-breakpoint-popover-ignore, #edit-breakpoint-popover-auto-continue) {
- margin-right: 0;
- margin-left: var(--edit-breakpoint-popover-option-margin-end);
-}
-
@media (prefers-color-scheme: dark) {
.popover .edit-breakpoint-popover-content > table > tr > th {
color: var(--text-color-secondary);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -222,13 +222,10 @@
z-index: 10;
width: 100%;
height: 1px;
+ text-align: end;
background-color: hsla(0, 0%, var(--foreground-lightness), 0.07);
}
-body[dir=ltr] .timeline-view.cpu :matches(.area-chart, .stacked-area-chart) .markers > div {
- text-align: end;
-}
-
body[dir=rtl] .timeline-view.cpu :matches(.area-chart, .stacked-area-chart) .markers > div {
transform: scaleX(-1);
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -26,21 +26,18 @@
.tree-outline .item.call-frame .status {
position: absolute;
float: none;
+ -webkit-margin-start: 1px;
--call-frame-status-start: 1px;
- --call-frame-status-margin-start: 1px;
}
body[dir=ltr] .tree-outline .item.call-frame .status {
left: var(--call-frame-status-start);
- margin-left: var(--call-frame-status-margin-start);
}
body[dir=rtl] .tree-outline .item.call-frame .status {
+ right: var(--call-frame-status-start);
transform: scaleX(-1);
-
- right: var(--call-frame-status-start);
- margin-right: var(--call-frame-status-margin-start);
}
.tree-outline .item.call-frame .status > .status-image {
@@ -60,36 +57,18 @@
.tree-outline .item.call-frame.async-boundary {
cursor: default;
color: var(--text-color-gray-medium);
-
- --call-frame-async-boundary-padding-start: 5px;
- --call-frame-async-boundary-leading-rule-margin-start: -5px;
- --call-frame-async-boundary-leading-rule-margin-end: 1px;
- --call-frame-async-bonudary-trailing-rule-margin-start: 2px;
}
-body[dir=ltr] .tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary {
- padding-left: var(--call-frame-async-boundary-padding-start);
+.tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary {
+ -webkit-padding-start: 5px;
}
-body[dir=rtl] .tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary {
- padding-right: var(--call-frame-async-boundary-padding-start);
-}
-
.tree-outline .item.call-frame.async-boundary .icon {
+ display: inline-block;
float: none;
- display: inline-block;
-
- --call-frame-async-boundary-icon-margin-start: 0;
+ -webkit-margin-start: 0 !important;
}
-body[dir=ltr] .tree-outline .item.call-frame.async-boundary .icon {
- margin-left: var(--call-frame-async-boundary-icon-margin-start) !important;
-}
-
-body[dir=rtl] .tree-outline .item.call-frame.async-boundary .icon {
- margin-right: var(--call-frame-async-boundary-icon-margin-start) !important;
-}
-
.tree-outline .item.call-frame.async-boundary::before,
.tree-outline .item.call-frame.async-boundary::after {
content: "";
@@ -102,30 +81,15 @@
.tree-outline .item.call-frame.async-boundary::after {
width: 100%;
+ -webkit-margin-start: 2px;
}
-body[dir=ltr] .tree-outline .item.call-frame.async-boundary::after {
- margin-left: var(--call-frame-async-bonudary-trailing-rule-margin-start);
-}
-
-body[dir=rtl] .tree-outline .item.call-frame.async-boundary::after {
- margin-right: var(--call-frame-async-bonudary-trailing-rule-margin-start);
-}
-
.tree-outline .item.call-frame.async-boundary::before {
width: 30px;
+ -webkit-margin-start: -5px;
+ -webkit-margin-end: 1px;
}
-body[dir=ltr] .tree-outline .item.call-frame.async-boundary::before {
- margin-left: var(--call-frame-async-boundary-leading-rule-margin-start);
- margin-right: var(--call-frame-async-boundary-leading-rule-margin-end);
-}
-
-body[dir=rtl] .tree-outline .item.call-frame.async-boundary::before {
- margin-left: var(--call-frame-async-boundary-leading-rule-margin-end);
- margin-right: var(--call-frame-async-boundary-leading-rule-margin-start);
-}
-
.tree-outline.single-thread .item.call-frame.async-boundary::before {
width: 20px;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -28,8 +28,6 @@
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
-
- --icon-margin-end: 3px;
}
.call-frame .icon {
@@ -37,16 +35,9 @@
vertical-align: top;
width: 16px;
height: 16px;
+ -webkit-margin-end: 3px;
}
-body[dir=ltr] .call-frame .icon {
- margin-right: var(--icon-margin-end);
-}
-
-body[dir=rtl] .call-frame .icon {
- margin-left: var(--icon-margin-end);
-}
-
.call-frame .titles {
display: inline-block;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeContentView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeContentView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeContentView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -28,21 +28,15 @@
}
.content-view.dom-tree .tree-outline.dom {
- --gutter-padding-start: 7px;
+ -webkit-padding-start: 7px;
}
.content-view.dom-tree.show-gutter .tree-outline.dom {
- --gutter-padding-start: 20px;
-}
+ -webkit-padding-start: 20px;
-body[dir=ltr] .content-view.dom-tree .tree-outline.dom {
- padding-left: var(--gutter-padding-start);
+ --item-pseudo-class-enabled-selection-before-start: 17px;
}
-body[dir=rtl] .content-view.dom-tree .tree-outline.dom {
- padding-right: var(--gutter-padding-start);
-}
-
.content-view.dom-tree .tree-outline.dom li .status-image {
position: absolute;
height: 13px;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -38,16 +38,8 @@
background-color: transparent !important;
color: var(--text-color);
- --item-parent-margin-start: -15px;
-
- --item-parent-before-padding-end: 2px;
-
- --item-parent-shadow-after-margin-start: -2px;
-
--item-pseudo-class-enabled-selection-before-start: 2px;
- --single-item-padding-start: 2px;
-
--sublist-margin-start: 4px;
--sublist-padding-start: 1px;
--sublist-border-width-start: 9px;
@@ -92,16 +84,9 @@
.tree-outline.dom ol {
list-style-type: none;
margin: 0;
+ -webkit-padding-start: calc(var(--sublist-margin-start) + var(--sublist-padding-start) + var(--sublist-border-width-start));
}
-body[dir=ltr] .tree-outline.dom ol {
- padding-left: calc(var(--sublist-margin-start) + var(--sublist-padding-start) + var(--sublist-border-width-start));
-}
-
-body[dir=rtl] .tree-outline.dom ol {
- padding-right: calc(var(--sublist-margin-start) + var(--sublist-padding-start) + var(--sublist-border-width-start));
-}
-
.tree-outline.dom ol.children {
display: none;
}
@@ -111,18 +96,16 @@
}
.tree-outline.dom li:matches(.hovered, .selected) + ol.children.expanded {
+ -webkit-margin-start: var(--sublist-margin-start);
+ -webkit-padding-start: var(--sublist-padding-start);
border: 0 solid hsla(0, 0%, 83%, 0.5);
}
body[dir=ltr] .tree-outline.dom li:matches(.hovered, .selected) + ol.children.expanded {
- margin-left: var(--sublist-margin-start);
- padding-left: var(--sublist-padding-start);
border-left-width: var(--sublist-border-width-start);
}
body[dir=rtl] .tree-outline.dom li:matches(.hovered, .selected) + ol.children.expanded {
- margin-right: var(--sublist-margin-start);
- padding-right: var(--sublist-padding-start);
border-right-width: var(--sublist-border-width-start);
}
@@ -159,10 +142,6 @@
border-radius: 50%;
}
-.content-view.dom-tree.show-gutter .tree-outline.dom {
- --item-pseudo-class-enabled-selection-before-start: 17px;
-}
-
body[dir=ltr] .tree-outline.dom li.pseudo-class-enabled > .selection-area::before {
left: var(--item-pseudo-class-enabled-selection-before-start);
}
@@ -171,14 +150,10 @@
right: var(--item-pseudo-class-enabled-selection-before-start);
}
-body[dir=ltr] .tree-outline.dom.single-node li {
- padding-left: var(--single-item-padding-start);
+.tree-outline.dom.single-node li {
+ -webkit-padding-start: 2px;
}
-body[dir=rtl] .tree-outline.dom.single-node li {
- padding-right: var(--single-item-padding-start);
-}
-
.tree-outline.dom:focus li.selected {
color: white;
}
@@ -192,30 +167,20 @@
}
.tree-outline.dom li.parent {
+ -webkit-margin-start: -15px;
line-height: 13px;
}
-body[dir=ltr] .tree-outline.dom li.parent {
- margin-left: var(--item-parent-margin-start);
+.tree-outline.dom li .html-tag.close {
+ -webkit-margin-start: calc(-1 * var(--sublist-margin-start) - var(--sublist-border-width-start));
}
-body[dir=rtl] .tree-outline.dom li.parent {
- margin-right: var(--item-parent-margin-start);
-}
-
-body[dir=ltr] .tree-outline.dom li .html-tag.close {
- margin-left: calc(-1 * var(--sublist-margin-start) - var(--sublist-border-width-start));
-}
-
-body[dir=rtl] .tree-outline.dom li .html-tag.close {
- margin-right: calc(-1 * var(--sublist-margin-start) - var(--sublist-border-width-start));
-}
-
.tree-outline.dom li.parent::before {
position: relative;
z-index: 20;
width: 13px;
height: 13px;
+ -webkit-padding-end: 2px;
content: "";
background-image: url(../Images/DisclosureTriangles.svg#closed-normal);
background-size: 13px 13px;
@@ -222,18 +187,13 @@
background-repeat: no-repeat;
}
-body[dir=rtl] .tree-outline.dom li.parent::before {
- transform: scaleX(-1);
-}
-
body[dir=ltr] .tree-outline.dom li.parent::before {
float: left;
- padding-right: var(--item-parent-before-padding-end);
}
body[dir=rtl] .tree-outline.dom li.parent::before {
float: right;
- padding-left: var(--item-parent-before-padding-end);
+ transform: scaleX(-1);
}
.tree-outline.dom:focus li.parent.selected::before {
@@ -269,18 +229,11 @@
width: calc(100% + 8px);
height: 1.2em;
margin-top: -13px;
+ -webkit-margin-start: -2px;
content: "";
background-color: hsla(0, 0%, 90%, 0.5);
}
-body[dir=ltr] .tree-outline.dom li.parent.shadow::after {
- margin-left: var(--item-parent-shadow-after-margin-start);
-}
-
-body[dir=rtl] .tree-outline.dom li.parent.shadow::after {
- margin-right: var(--item-parent-shadow-after-margin-start);
-}
-
.tree-outline.dom li.parent.shadow + ol.children.expanded {
background-color: hsla(0, 0%, 90%, 0.5);
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DashboardContainerView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -54,23 +54,11 @@
bottom: 0;
left: 0;
right: 0;
-
+ -webkit-padding-start: 10px;
+ -webkit-padding-end: 5px;
animation-duration: 0.4s;
-
- --dashboard-padding-start: 10px;
- --dashboard-padding-end: 5px;
}
-body[dir=ltr] .toolbar .dashboard {
- padding-left: var(--dashboard-padding-start);
- padding-right: var(--dashboard-padding-end);
-}
-
-body[dir=rtl] .toolbar .dashboard {
- padding-left: var(--dashboard-padding-end);
- padding-right: var(--dashboard-padding-start);
-}
-
.toolbar .dashboard.visible {
z-index: 1; /* Establish a stacking context. */
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -102,8 +102,6 @@
.data-grid th:matches(.sort-ascending, .sort-descending) {
background-color: hsl(0, 0%, 90%);
-
- --data-grid-sort-div-first-child-padding-end: 12px;
}
.data-grid tr.filler {
@@ -224,14 +222,10 @@
position: relative;
}
-body[dir=ltr] .data-grid th:matches(.sort-ascending, .sort-descending) > div:first-child {
- padding-right: var(--data-grid-sort-div-first-child-padding-end);
+.data-grid th:matches(.sort-ascending, .sort-descending) > div:first-child {
+ -webkit-padding-end: 12px;
}
-body[dir=rtl] .data-grid th:matches(.sort-ascending, .sort-descending) > div:first-child {
- padding-left: var(--data-grid-sort-div-first-child-padding-end);
-}
-
.data-grid th:matches(.sort-ascending, .sort-descending) > div:first-child::after {
position: absolute;
top: 1px;
@@ -337,33 +331,21 @@
display: inline-block;
width: 16px;
height: 16px;
+ -webkit-margin-end: 2px;
vertical-align: top;
-
- --data-grid-icon-margin-end: 2px;
}
-body[dir=ltr] .data-grid td .icon {
- margin-right: var(--data-grid-icon-margin-end);
-}
-
-body[dir=rtl] .data-grid td .icon {
- margin-left: var(--data-grid-icon-margin-end);
-}
-
.data-grid td .go-to-arrow {
display: none;
-
- --data-grid-go-to-arrow-margin-start: 2px;
+ -webkit-margin-start: 2px;
}
body[dir=ltr] .data-grid td .go-to-arrow {
float: right;
- margin-left: var(--data-grid-go-to-arrow-margin-start);
}
body[dir=rtl] .data-grid td .go-to-arrow {
float: left;
- margin-right: var(--data-grid-go-to-arrow-margin-start);
}
.data-grid tr:matches(.selected, :hover) .go-to-arrow {
@@ -387,18 +369,9 @@
.data-grid table:matches(.header, .data) {
/* Hide starting border from first hidden columns. */
width: calc(100% + 1px);
-
- --data-grid-table-margin-start: -1px;
+ -webkit-margin-start: -1px;
}
-body[dir=ltr] .data-grid table:matches(.header, .data) {
- margin-left: var(--data-grid-table-margin-start);
-}
-
-body[dir=rtl] .data-grid table:matches(.header, .data) {
- margin-right: var(--data-grid-table-margin-start);
-}
-
body[dir=ltr] .data-grid :matches(th, td):first-child {
border-left: var(--data-grid-column-border-start);
}
@@ -410,8 +383,7 @@
@media (-webkit-min-device-pixel-ratio: 2) {
.data-grid table:matches(.header, .data) {
width: calc(100% + 0.5px);
-
- --data-grid-table-margin-start: -0.5px;
+ -webkit-margin-start: -0.5px;
}
.data-grid :matches(th, td):first-child {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerDashboardView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerDashboardView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerDashboardView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -28,42 +28,21 @@
flex-wrap: nowrap;
justify-content: center;
align-items: center;
-
+ -webkit-padding-start: 5px;
+ -webkit-padding-end: 12px;
text-align: center;
color: hsl(0, 0%, 23%);
-
- --debugger-dashboard-padding-start: 5px;
- --debugger-dashboard-padding-end: 12px;
}
-body[dir=ltr] .toolbar .dashboard.debugger {
- padding-left: var(--debugger-dashboard-padding-start);
- padding-right: var(--debugger-dashboard-padding-end);
-}
-
-body[dir=rtl] .toolbar .dashboard.debugger {
- padding-left: var(--debugger-dashboard-padding-end);
- padding-right: var(--debugger-dashboard-padding-start);
-}
-
.dashboard.debugger > .message {
font-weight: bold;
}
.dashboard.debugger .navigation-bar {
+ -webkit-margin-end: 4px;
border: 0;
-
- --debugger-dashboard-navigation-bar-margin-end: 4px;
}
-body[dir=ltr] .dashboard.debugger .navigation-bar {
- margin-right: var(--debugger-dashboard-navigation-bar-margin-end);
-}
-
-body[dir=rtl] .dashboard.debugger .navigation-bar {
- margin-left: var(--debugger-dashboard-navigation-bar-margin-end);
-}
-
.toolbar:not(.small-size) .dashboard.debugger .navigation-bar {
margin-top: 1px;
}
@@ -125,8 +104,6 @@
.dashboard.debugger > .location {
overflow: hidden;
flex: initial;
-
- --debugger-dashboard-location-trailing-margin-end: 5px;
}
.dashboard.debugger > .location > * {
@@ -140,14 +117,10 @@
}
/* Add spacing between the ellipsis'd location and the up/down arrows. */
-body[dir=ltr] .dashboard.debugger > .location > :last-child {
- margin-right: var(--debugger-dashboard-location-trailing-margin-end);
+.dashboard.debugger > .location > :last-child {
+ -webkit-margin-end: 5px;
}
-body[dir=rtl] .dashboard.debugger > .location > :last-child {
- margin-left: var(--debugger-dashboard-location-trailing-margin-end);
-}
-
.toolbar:not(.small-size) .dashboard.debugger > .location :not(:first-child) {
margin-top: 1px;
}
@@ -157,18 +130,10 @@
height: 16px;
}
-.dashboard.debugger > .location {
- --debugger-dashboard-function-icon-margin-end: 3px;
+.dashboard.debugger > .location :matches(.function-icon, .event-listener-icon) {
+ -webkit-margin-end: 5px;
}
-body[dir=ltr] .dashboard.debugger > .location :matches(.function-icon, .event-listener-icon) {
- margin-right: var(--debugger-dashboard-function-icon-margin-end);
-}
-
-body[dir=rtl] .dashboard.debugger > .location :matches(.function-icon, .event-listener-icon) {
- margin-left: var(--debugger-dashboard-function-icon-margin-end);
-}
-
.dashboard.debugger > .location .function-name {
color: hsl(0, 0%, 11%);
padding-bottom: 1px;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -71,17 +71,9 @@
}
.sidebar > .panel.navigation.debugger .tree-outline.single-thread {
- --tree-outline-single-thread-margin-start: -10px;
+ -webkit-margin-start: -10px;
}
-body[dir=ltr] .sidebar > .panel.navigation.debugger .tree-outline.single-thread {
- margin-left: var(--tree-outline-single-thread-margin-start);
-}
-
-body[dir=rtl] .sidebar > .panel.navigation.debugger .tree-outline.single-thread {
- margin-right: var(--tree-outline-single-thread-margin-start);
-}
-
.sidebar > .panel.navigation.debugger .warning-banner > a {
text-decoration: underline;
cursor: pointer;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -92,19 +92,10 @@
.toolbar .dashboard.default > .item > div {
display: flex;
flex: 1;
-
+ -webkit-padding-start: 2px;
color: hsla(0, 0%, 0%, 0.2);
- --dashboard-item-padding-start: 2px;
}
-body[dir=ltr] .toolbar .dashboard.default > .item > div {
- padding-left: var(--dashboard-item-padding-start);
-}
-
-body[dir=rtl] .toolbar .dashboard.default > .item > div {
- padding-right: var(--dashboard-item-padding-start);
-}
-
.toolbar .dashboard.default > .item.enabled > div {
color: hsla(0, 0%, 0%, 0.7);
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -27,12 +27,6 @@
font-size: 10px;
background-color: var(--panel-background-color);
border-bottom: 1px solid var(--border-color);
-
- --details-section-header-padding-end: 5px;
- --details-section-header-label-checkbox-margin-start: 5px;
- --details-section-header-go-to-margin-start: 3px;
- --details-section-content-group-row-simple-padding-start: 6px;
- --details-section-content-group-row-simple-value-go-to-margin-start: 5px;
}
.details-section .details-section {
@@ -53,6 +47,7 @@
top: -1px;
height: 23px;
padding: 4px 0;
+ -webkit-padding-end: 5px;
font-size: 11px;
font-weight: bold;
white-space: nowrap;
@@ -65,14 +60,6 @@
z-index: var(--z-index-header);
}
-body[dir=ltr] .details-section > .header {
- padding-right: var(--details-section-header-padding-end);
-}
-
-body[dir=rtl] .details-section > .header {
- padding-left: var(--details-section-header-padding-end);
-}
-
.details-section > .header > .options > .navigation-bar {
margin-top: 1px;
height: 100%;
@@ -146,31 +133,17 @@
.details-section > .header > label > input[type="checkbox"] {
margin: 0;
+ -webkit-margin-start: 5px;
vertical-align: 1px;
font-size: 10px;
}
-body[dir=ltr] .details-section > .header > label > input[type="checkbox"] {
- margin-left: var(--details-section-header-label-checkbox-margin-start);
-}
-
-body[dir=rtl] .details-section > .header > label > input[type="checkbox"] {
- margin-right: var(--details-section-header-label-checkbox-margin-start);
-}
-
.details-section > .header .go-to-arrow {
width: 10px;
height: 12px;
+ -webkit-margin-start: 3px;
}
-body[dir=ltr] .details-section > .header .go-to-arrow {
- margin-left: var(--details-section-header-go-to-margin-start);
-}
-
-body[dir=rtl] .details-section > .header .go-to-arrow {
- margin-right: var(--details-section-header-go-to-margin-start);
-}
-
.details-section > .content {
display: table;
width: 100%;
@@ -240,19 +213,13 @@
.details-section > .content > .group > .row.simple > .label {
width: 85px;
+ -webkit-padding-start: 6px;
color: hsl(0, 0%, 20%);
text-align: end;
}
-body[dir=ltr] .details-section > .content > .group > .row.simple > .label {
- padding-left: var(--details-section-content-group-row-simple-padding-start);
-}
-
-body[dir=rtl] .details-section > .content > .group > .row.simple > .label {
- padding-right: var(--details-section-content-group-row-simple-padding-start);
-}
-
.details-section > .content > .group > .row.simple > .value {
+ -webkit-padding-start: 6px;
word-break: break-all;
word-wrap: break-word;
cursor: text;
@@ -259,27 +226,12 @@
-webkit-user-select: text;
}
-body[dir=ltr] .details-section > .content > .group > .row.simple > .value {
- padding-right: var(--details-section-content-group-row-simple-padding-start);
-}
-
-body[dir=rtl] .details-section > .content > .group > .row.simple > .value {
- padding-left: var(--details-section-content-group-row-simple-padding-start);
-}
-
.details-section > .content > .group > .row.simple > .value .go-to-arrow {
width: 10px;
height: 12px;
+ -webkit-margin-start: 5px;
}
-body[dir=ltr] .details-section > .content > .group > .row.simple > .value .go-to-arrow {
- margin-left: var(--details-section-content-group-row-simple-value-go-to-margin-start);
-}
-
-body[dir=rtl] .details-section > .content > .group > .row.simple > .value .go-to-arrow {
- margin-right: var(--details-section-content-group-row-simple-value-go-to-margin-start);
-}
-
.details-section > .content > .group > .row.simple.data > .value {
word-break: break-all;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -40,18 +40,9 @@
.filter-bar > .navigation-bar > .item {
padding: 0 0 3px;
-
- --filter-bar-navigation-bar-item-padding-start: 8px;
+ -webkit-padding-start: 8px;
}
-body[dir=ltr] .filter-bar > .navigation-bar > .item {
- padding-left: var(--filter-bar-navigation-bar-item-padding-start);
-}
-
-body[dir=rtl] .filter-bar > .navigation-bar > .item {
- padding-right: var(--filter-bar-navigation-bar-item-padding-start);
-}
-
.filter-bar > input[type="search"] {
display: flex;
flex: 1;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/FindBanner.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/FindBanner.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/FindBanner.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -66,44 +66,34 @@
transition-timing-function: ease-out;
}
-body[dir=ltr] .find-banner > :first-child,
-body[dir=rtl] .find-banner > :last-child {
- margin-left: var(--find-banner-outer-child-margin) !important;
+.find-banner > :first-child {
+ -webkit-margin-start: var(--find-banner-outer-child-margin) !important;
}
-body[dir=ltr] .find-banner > :last-child,
-body[dir=rtl] .find-banner > :first-child {
- margin-right: var(--find-banner-outer-child-margin) !important;
+.find-banner > :last-child {
+ -webkit-margin-end: var(--find-banner-outer-child-margin) !important;
}
.find-banner > input[type="search"] {
- margin-top: 1px;
- margin-bottom: 1px;
-
width: 30vw;
min-width: 143px;
max-width: 210px;
height: 19px;
+ margin-top: 1px;
+ margin-bottom: 1px;
+ -webkit-margin-start: 6px;
+ -webkit-margin-end: -1px;
vertical-align: top;
-
+ background-color: white;
+ border: 1px solid var(--border-color);
+ outline: none;
-webkit-appearance: none;
- outline: none;
-
- border: 1px solid var(--border-color);
-
- background-color: white;
-
- --find-banner-search-box-margin-start: 6px;
- --find-banner-search-box-margin-end: -1px;
--find-banner-search-box-border-radius-start: 4px;
--find-banner-search-box-border-radius-end: 0;
}
body[dir=ltr] .find-banner > input[type="search"] {
- margin-left: var(--find-banner-search-box-margin-start);
- margin-right: var(--find-banner-search-box-margin-end);
-
border-top-left-radius: var(--find-banner-search-box-border-radius-start);
border-bottom-left-radius: var(--find-banner-search-box-border-radius-start);
border-top-right-radius: var(--find-banner-search-box-border-radius-end);
@@ -111,9 +101,6 @@
}
body[dir=rtl] .find-banner > input[type="search"] {
- margin-left: var(--find-banner-search-box-margin-end);
- margin-right: var(--find-banner-search-box-margin-start);
-
border-top-left-radius: var(--find-banner-search-box-border-radius-end);
border-bottom-left-radius: var(--find-banner-search-box-border-radius-end);
border-top-right-radius: var(--find-banner-search-box-border-radius-start);
@@ -196,7 +183,6 @@
.find-banner > button.segmented.next-result {
--next-result-border-style-start: none;
--next-result-border-radius-start: 0;
- --next-result-glyph-margin-start: 1px;
}
body[dir=ltr] .find-banner > button.segmented.next-result {
@@ -211,14 +197,16 @@
border-right: var(--next-result-border-style-start);
}
+.find-banner > button.segmented.next-result > .glyph {
+ -webkit-margin-start: 1px;
+}
+
body[dir=ltr] .find-banner > button.segmented.next-result > .glyph {
background-image: url(../Images/BackForwardArrows.svg#right-arrow-normal);
- margin-left: var(--next-result-glyph-margin-start);
}
body[dir=rtl] .find-banner > button.segmented.next-result > .glyph {
background-image: url(../Images/BackForwardArrows.svg#left-arrow-normal);
- margin-right: var(--next-result-glyph-margin-start);
}
body[dir=ltr] .find-banner > button.segmented.next-result:active:not(:disabled) > .glyph {
@@ -263,8 +251,6 @@
--console-find-banner-search-box-border-radius-start: 3px;
--console-find-banner-search-box-border-radius-end: 0;
-
- --console-find-banner-search-box-decoration-margin-start: 4px;
}
body[dir=ltr] .find-banner.console-find-banner > input[type="search"] {
@@ -289,14 +275,10 @@
color: hsla(0, 0%, 0%, 0.35);
}
-body[dir=ltr] .find-banner.console-find-banner > input[type="search"]::-webkit-textfield-decoration-container {
- margin-left: var(--console-find-banner-search-box-decoration-margin-start);
+.find-banner.console-find-banner > input[type="search"]::-webkit-textfield-decoration-container {
+ -webkit-margin-start: 4px;
}
-body[dir=rtl] .find-banner.console-find-banner > input[type="search"]::-webkit-textfield-decoration-container {
- margin-right: var(--console-find-banner-search-box-decoration-margin-start);
-}
-
.find-banner.console-find-banner > input[type="search"]:focus {
background-color: white;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/FontResourceContentView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/FontResourceContentView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/FontResourceContentView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -67,19 +67,12 @@
.content-view.resource.font .preview > .line > .metric {
display: inline-block;
-
width: 100%;
height: 1px;
-
- --margin-end: -100%; /* Causes this element to be zero width and draw behind the text. */
+ -webkit-margin-end: -100%; /* Causes this element to be zero width and draw behind the text. */
}
-body[dir=ltr] .content-view.resource.font .preview > .line > .metric {
- margin-right: var(--margin-end);
-}
-
body[dir=rtl] .content-view.resource.font .preview > .line > .metric {
- margin-left: var(--margin-end);
position: relative;
z-index: -1;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -87,20 +87,12 @@
width: 15px;
min-width: 15px;
height: 15px;
+ -webkit-margin-start: 6px;
content: url(../Images/Plus15.svg);
opacity: 0.7;
- --panel-details-css-style-content-options-container-new-rule-margin-start: 6px;
}
-body[dir=ltr] .sidebar > .panel.details.css-style > .content ~ .options-container > .new-rule {
- margin-left: var(--panel-details-css-style-content-options-container-new-rule-margin-start);
-}
-
-body[dir=rtl] .sidebar > .panel.details.css-style > .content ~ .options-container > .new-rule {
- margin-right: var(--panel-details-css-style-content-options-container-new-rule-margin-start);
-}
-
.sidebar > .panel.details.css-style > .content ~ .options-container > .filter-bar {
width: -webkit-fill-available;
background-color: transparent;
@@ -108,6 +100,7 @@
.sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle {
margin: 0 0 1px;
+ -webkit-margin-end: 5px;
padding: 2px 4px 3px;
color: var(--text-color);
background: none;
@@ -115,18 +108,8 @@
border-radius: 3px;
white-space: nowrap;
-webkit-appearance: none;
-
- --panel-details-css-style-content-options-container-toggle-class-toggle-margin-end: 5px;
}
-body[dir=ltr] .sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle {
- margin-right: var(--panel-details-css-style-content-options-container-toggle-class-toggle-margin-end);
-}
-
-body[dir=rtl] .sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle {
- margin-left: var(--panel-details-css-style-content-options-container-toggle-class-toggle-margin-end);
-}
-
.sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle.selected {
color: var(--selected-foreground-color);
background-color: var(--selected-background-color);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathComponent.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathComponent.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathComponent.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -31,9 +31,6 @@
font-size: 11px;
font-family: -webkit-system-font, sans-serif;
-
- --path-component-icon-margin-start: 4px;
- --path-component-icon-margin-end: 3px;
}
.hierarchical-path-component.show-selector-arrows {
@@ -65,18 +62,10 @@
.hierarchical-path-component > :matches(.icon, .selector-arrows) {
margin-top: 2px;
margin-bottom: 2px;
+ -webkit-margin-start: 4px;
+ -webkit-margin-end: 3px;
}
-body[dir=ltr] .hierarchical-path-component > :matches(.icon, .selector-arrows) {
- margin-left: var(--path-component-icon-margin-start);
- margin-right: var(--path-component-icon-margin-end);
-}
-
-body[dir=rtl] .hierarchical-path-component > :matches(.icon, .selector-arrows) {
- margin-left: var(--path-component-icon-margin-end);
- margin-right: var(--path-component-icon-margin-start);
-}
-
.hierarchical-path-component > .selector-arrows {
vertical-align: top;
width: 5px;
@@ -133,52 +122,32 @@
.hierarchical-path-component > .separator {
display: inline-block;
+ width: 7px;
+ height: 20px;
+ -webkit-margin-start: 3px;
vertical-align: top;
-
background-image: url(../Images/HierarchicalNavigationItemChevron.svg);
background-repeat: no-repeat;
background-position-y: center;
-
opacity: 0.75;
-
- width: 7px;
- height: 20px;
-
- --path-component-separator-margin-start: 3px;
}
-body[dir=ltr] .hierarchical-path-component > .separator {
- margin-left: var(--path-component-separator-margin-start);
-}
-
body[dir=rtl] .hierarchical-path-component > .separator {
- margin-right: var(--path-component-separator-margin-start);
- /* Flip the icon horizontally. */
transform: scaleX(-1);
}
.hierarchical-path-component.text-only {
- --text-only-path-component-padding-start: 5px;
- --text-only-path-component-padding-end: 1px;
+ -webkit-padding-start: 5px;
+ -webkit-padding-end: 1px;
+
+ /* Positions so the text in the menu aligns with the text in .title for text-only path components. */
--text-only-path-component-select-offset-start: -8px;
}
-body[dir=ltr] .hierarchical-path-component.text-only {
- padding-left: var(--text-only-path-component-padding-start);
- padding-right: var(--text-only-path-component-padding-end);
-}
-
-body[dir=rtl] .hierarchical-path-component.text-only {
- padding-left: var(--text-only-path-component-padding-end);
- padding-right: var(--text-only-path-component-padding-start);
-}
-
body[dir=ltr] .hierarchical-path-component.text-only > select {
- /* Positions so the text in the menu aligns with the text in .title for text only path components. */
left: var(--text-only-path-component-select-offset-start);
}
body[dir=rtl] .hierarchical-path-component.text-only > select {
- /* Positions so the text in the menu aligns with the text in .title for text only path components. */
right: var(--text-only-path-component-select-offset-start);
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayerTreeDetailsSidebarPanel.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -94,20 +94,10 @@
margin: 10px 0 0;
padding: 0;
- --layer-tree-popover-ul-margin-start: 1em;
- --layer-tree-popover-ul-padding-start: 1em;
+ -webkit-margin-start: 1em;
+ -webkit-padding-start: 1em;
}
-body[dir=ltr] .layer-tree-popover ul {
- margin-left: var(--layer-tree-popover-ul-margin-start);
- padding-left: var(--layer-tree-popover-ul-padding-start);
-}
-
-body[dir=rtl] .layer-tree-popover ul {
- margin-right: var(--layer-tree-popover-ul-margin-start);
- padding-right: var(--layer-tree-popover-ul-padding-start);
-}
-
.layer-tree-popover li {
line-height: 1.3em;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Main.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/Main.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Main.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -246,21 +246,18 @@
.go-to-link:not(.dont-float) {
max-width: 100%;
+ -webkit-margin-start: 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
-
- --go-to-link-margin-start: 5px;
}
body[dir=ltr] .go-to-link:not(.dont-float) {
float: right;
- margin-left: var(--go-to-link-margin-start);
}
body[dir=rtl] .go-to-link:not(.dont-float) {
float: left;
- margin-right: var(--go-to-link-margin-start);
}
.go-to-arrow {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -114,14 +114,16 @@
filter: invert();
}
+.network-table .cell.name > .status {
+ -webkit-margin-start: 4px;
+}
+
body[dir=ltr] .network-table .cell.name > .status {
float: right;
- margin-left: 4px;
}
body[dir=rtl] .network-table .cell.name > .status {
float: left;
- margin-right: 4px;
}
.network-table .cell.name > .status .indeterminate-progress-spinner {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/OpenResourceDialog.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/OpenResourceDialog.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/OpenResourceDialog.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -50,21 +50,10 @@
.open-resource-dialog > .field {
margin-top: 8px;
margin-bottom: 8px;
-
- --open-resource-dialog-field-margin-start: 32px;
- --open-resource-dialog-field-margin-end: 3px;
+ -webkit-margin-start: 32px;
+ -webkit-margin-end: 3px;
}
-body[dir=ltr] .open-resource-dialog > .field {
- margin-left: var(--open-resource-dialog-field-margin-start);
- margin-right: var(--open-resource-dialog-field-margin-end);
-}
-
-body[dir=rtl] .open-resource-dialog > .field {
- margin-left: var(--open-resource-dialog-field-margin-end);
- margin-right: var(--open-resource-dialog-field-margin-start);
-}
-
.open-resource-dialog > .field::before {
position: absolute;
top: 10px;
@@ -86,29 +75,18 @@
.open-resource-dialog > .field > input {
display: block;
width: 100%;
- border: none;
- background-color: transparent;
+ padding-top: 0;
+ padding-bottom: 1px;
+ -webkit-padding-start: 7px;
+ -webkit-padding-end: 30px;
font-size: 20px;
color: hsl(0, 0%, 4%);
- padding-top: 0px;
- padding-bottom: 1px;
+ background-color: transparent;
+ border: none;
outline: none;
-webkit-appearance: none;
-
- --open-resource-dialog-input-padding-start: 7px;
- --open-resource-dialog-input-padding-end: 30px;
}
-body[dir=ltr] .open-resource-dialog > .field > input {
- padding-left: var(--open-resource-dialog-input-padding-start);
- padding-right: var(--open-resource-dialog-input-padding-end);
-}
-
-body[dir=rtl] .open-resource-dialog > .field > input {
- padding-left: var(--open-resource-dialog-input-padding-end);
- padding-right: var(--open-resource-dialog-input-padding-start);
-}
-
.open-resource-dialog > .field > input::placeholder {
color: hsl(0, 0%, 0%, 0.25);
}
@@ -157,10 +135,9 @@
}
.open-resource-dialog > .tree-outline .item {
+ flex: none;
+ -webkit-padding-start: 10px;
border: none;
- flex: none;
-
- --open-resource-dialog-tree-outline-item-padding-start: 10px;
}
.open-resource-dialog > .tree-outline.large .item {
@@ -192,14 +169,6 @@
vertical-align: 2px;
}
-body[dir=ltr] .open-resource-dialog > .tree-outline .item {
- padding-left: var(--open-resource-dialog-tree-outline-item-padding-start);
-}
-
-body[dir=rtl] .open-resource-dialog > .tree-outline .item {
- padding-right: var(--open-resource-dialog-tree-outline-item-padding-start);
-}
-
.open-resource-dialog > .tree-outline .item.selected {
color: white;
background-color: hsl(209, 100%, 49%);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -23,13 +23,15 @@
* THE POSSIBILITY OF SUCH DAMAGE.
*/
-.item.action > .icon {
+.item.recording-action > .icon {
content: url("../Images/Source.svg");
}
-.item.action:not(.initial-state)::before {
+.item.recording-action:not(.initial-state)::before {
position: relative;
top: 3px;
+ -webkit-margin-end: var(--tree-outline-icon-margin-end);
+ -webkit-margin-start: 0;
content: attr(data-index);
font-family: -webkit-system-font, sans-serif;
font-size: 9px;
@@ -40,188 +42,180 @@
--data-indent: calc(var(--tree-outline-icon-margin-start) - var(--tree-outline-icon-margin-end));
}
-body[dir=ltr] .item.action::before {
+body[dir=ltr] .item.recording-action::before {
float: left;
- margin-right: var(--tree-outline-icon-margin-end);
- margin-left: 0;
}
-body[dir=rtl] .item.action::before {
+body[dir=rtl] .item.recording-action::before {
float: right;
- margin-right: 0;
- margin-left: var(--tree-outline-icon-margin-end);
}
-.tree-outline:focus .item.action.selected:not(.invalid, .initial-state, .has-context-replacer) > .icon {
+.tree-outline:focus .item.recording-action.selected:not(.invalid, .initial-state, .has-context-replacer) > .icon {
filter: invert();
opacity: 1;
}
-.item.action > .titles .parameter.swizzled {
+.item.recording-action > .titles .parameter.swizzled {
color: var(--text-color-gray-medium);
}
-.item.action > .titles .parameter.constant {
+.item.recording-action > .titles .parameter.constant {
font-size: calc(100% - 1px);
font-family: Menlo, monospace;
font-style: italic;
}
-body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus .item.action.selected > .titles .parameter.swizzled,
-body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus .item.action.selected::before {
+body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus .item.recording-action.selected > .titles .parameter.swizzled,
+body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus .item.recording-action.selected::before {
color: var(--selected-secondary-text-color);
}
-.tree-outline[data-indent="1"] .item.action::before,
-.tree-outline[data-indent="2"] .item.action::before {
+.tree-outline[data-indent="1"] .item.recording-action::before,
+.tree-outline[data-indent="2"] .item.recording-action::before {
min-width: var(--data-indent);
}
-.tree-outline[data-indent="3"] .item.action::before {
+.tree-outline[data-indent="3"] .item.recording-action::before {
min-width: calc(var(--data-indent) * 1.5);
}
-.tree-outline[data-indent="4"] .item.action::before {
+.tree-outline[data-indent="4"] .item.recording-action::before {
min-width: calc(var(--data-indent) * 2);
}
-.tree-outline[data-indent="5"] .item.action::before {
+.tree-outline[data-indent="5"] .item.recording-action::before {
min-width: calc(var(--data-indent) * 2.5);
}
-.tree-outline[data-indent="6"] .item.action::before {
+.tree-outline[data-indent="6"] .item.recording-action::before {
min-width: calc(var(--data-indent) * 3);
}
-.tree-outline[data-indent="7"] .item.action::before {
+.tree-outline[data-indent="7"] .item.recording-action::before {
min-width: calc(var(--data-indent) * 3.5);
}
-body[dir=ltr] .tree-outline:not(.hide-disclosure-buttons) .item.action:not(.initial-state, .parent) > .icon {
- margin-left: 0;
+.tree-outline:not(.hide-disclosure-buttons) .item.recording-action:not(.initial-state, .parent) > .icon {
+ -webkit-margin-start: 0;
}
-body[dir=rtl] .tree-outline:not(.hide-disclosure-buttons) .item.action:not(.initial-state, .parent) > .icon {
- margin-right: 0;
-}
-
-.item.action.visual:not(.selected, .invalid) {
+.item.recording-action.visual:not(.selected, .invalid) {
background-color: var(--value-changed-highlight);
}
-.item.action > .titles .context-replacer::after {
+.item.recording-action > .titles .context-replacer::after {
content: ".";
}
-.item.action.attribute > .titles .parameters::before {
+.item.recording-action.attribute > .titles .parameters::before {
content: " = ";
}
-.item.action:not(.attribute) > .titles .parameters::before {
+.item.recording-action:not(.attribute) > .titles .parameters::before {
content: "(";
}
-.item.action:not(.attribute) > .titles .parameters::after {
+.item.recording-action:not(.attribute) > .titles .parameters::after {
content: ")";
}
-.item.action > .titles .parameter:not(:last-child)::after {
+.item.recording-action > .titles .parameter:not(:last-child)::after {
content: ", ";
}
-.item.action:not(.selected) > .titles .parameter.swizzled {
+.item.recording-action:not(.selected) > .titles .parameter.swizzled {
color: var(--text-color-gray-medium);
}
-.item.action > .titles .parameters > .inline-swatch {
+.item.recording-action > .titles .parameters > .inline-swatch {
vertical-align: -1px;
}
-.item.action.has-context-replacer > .icon {
+.item.recording-action.has-context-replacer > .icon {
content: url("../Images/Source.svg");
}
-.item.action.composite > .icon {
+.item.recording-action.composite > .icon {
content: url(../Images/Composite.svg);
}
-.item.action.fill > .icon {
+.item.recording-action.fill > .icon {
content: url(../Images/Fill.svg);
}
-.item.action.image > .icon {
+.item.recording-action.image > .icon {
content: url(../Images/Pixels.svg);
}
-.item.action.line-style > .icon {
+.item.recording-action.line-style > .icon {
content: url(../Images/LineStyle.svg);
}
-.item.action.shadow > .icon {
+.item.recording-action.shadow > .icon {
content: url(../Images/Shadow.svg);
}
-.item.action.stroke > .icon {
+.item.recording-action.stroke > .icon {
content: url(../Images/Stroke.svg);
}
-.item.action.style > .icon {
+.item.recording-action.style > .icon {
content: url(../Images/Palette.svg);
}
-.item.action.text > .icon {
+.item.recording-action.text > .icon {
content: url(../Images/Text.svg);
}
-.item.action.transform > .icon {
+.item.recording-action.transform > .icon {
content: url(../Images/Transform.svg);
}
-.item.action.arc > .icon {
+.item.recording-action.arc > .icon {
content: url(../Images/PathArc.svg);
}
-.item.action.clip > .icon {
+.item.recording-action.clip > .icon {
content: url(../Images/Clip.svg);
}
-.item.action.curve > .icon {
+.item.recording-action.curve > .icon {
content: url(../Images/PathCurve.svg);
}
-.item.action.ellipse > .icon {
+.item.recording-action.ellipse > .icon {
content: url(../Images/PathEllipse.svg);
}
-.item.action.line-to > .icon {
+.item.recording-action.line-to > .icon {
content: url(../Images/PathLineTo.svg);
}
-.item.action.move-to > .icon {
+.item.recording-action.move-to > .icon {
content: url(../Images/PathMoveTo.svg);
}
-.item.action.point-in-path > .icon {
+.item.recording-action.point-in-path > .icon {
content: url(../Images/PointInPath.svg);
}
-.item.action.point-in-stroke > .icon {
+.item.recording-action.point-in-stroke > .icon {
content: url(../Images/PointInStroke.svg);
}
-.item.action.rect > .icon {
+.item.recording-action.rect > .icon {
content: url(../Images/PathRect.svg);
}
-.item.action.restore > .icon {
+.item.recording-action.restore > .icon {
content: url(../Images/StepOut.svg);
}
-.item.action.save > .icon {
+.item.recording-action.save > .icon {
content: url(../Images/StepInto.svg);
}
-.item.action.invalid > .icon {
+.item.recording-action.invalid > .icon {
top: 2px;
width: 16px;
height: 12px;
@@ -228,7 +222,7 @@
content: url(../Images/Error.svg);
}
-.item.action.warning:not(.invalid) > .status > .warning {
+.item.recording-action.warning:not(.invalid) > .status > .warning {
width: 12px;
height: 12px;
margin-top: 2px;
@@ -235,16 +229,16 @@
}
@media (prefers-color-scheme: dark) {
- .item.action:not(.initial-state)::before {
+ .item.recording-action:not(.initial-state)::before {
color: unset;
opacity: 0.4;
}
- .tree-outline .item.action.visual:not(.selected, .invalid) {
+ .tree-outline .item.recording-action.visual:not(.selected, .invalid) {
color: var(--green-highlight-text-color);
}
- .item.action:not(.invalid, .initial-state, .has-context-replacer) > .icon {
+ .item.recording-action:not(.invalid, .initial-state, .has-context-replacer) > .icon {
filter: invert();
opacity: 0.8;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.js (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.js 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.js 2019-03-12 03:22:29 UTC (rev 242768)
@@ -226,7 +226,7 @@
static _getClassNames(recordingAction)
{
- let classNames = ["action"];
+ let classNames = ["recording-action"];
if (recordingAction instanceof WI.RecordingInitialStateAction) {
classNames.push("initial-state");
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScopeRadioButtonNavigationItem.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ScopeRadioButtonNavigationItem.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScopeRadioButtonNavigationItem.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -25,9 +25,6 @@
.scope-radio-button-navigation-item {
position: relative;
-
- --scope-radio-button-navigation-item-select-offset-start: 0;
- --scope-radio-button-navigation-item-arrows-margin-start: 4px;
}
.scope-radio-button-navigation-item > .scope-radio-button-item-select {
@@ -40,6 +37,8 @@
background: transparent;
color: transparent;
outline: none;
+
+ --scope-radio-button-navigation-item-select-offset-start: 0;
}
body[dir=ltr] .scope-radio-button-navigation-item > .scope-radio-button-item-select {
@@ -59,18 +58,11 @@
.scope-radio-button-navigation-item > .arrows {
width: 5px;
height: 11px;
+ -webkit-margin-start: 4px;
pointer-events: none;
transform: translateY(1px);
}
-body[dir=ltr] .scope-radio-button-navigation-item > .arrows {
- margin-left: var(--scope-radio-button-navigation-item-arrows-margin-start);
-}
-
-body[dir=rtl] .scope-radio-button-navigation-item > .arrows {
- margin-right: var(--scope-radio-button-navigation-item-arrows-margin-start);
-}
-
.scope-radio-button-navigation-item.selected > .arrows {
display: inline-block;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -119,6 +119,8 @@
.content-view.settings > .settings-view > .container > .editor-group > .editor input[type="number"] {
max-width: 48px;
+ -webkit-margin-start: 2px;
+ -webkit-margin-end: 5px;
padding-top: 0;
padding-bottom: 0;
text-align: end;
@@ -126,20 +128,8 @@
/* Vertically align <input> with the group title text. */
--settings-editor-child-margin-top: -2px;
- --settings-input-number-margin-start: 2px;
- --settings-input-number-margin-end: 5px;
}
-body[dir=ltr] .content-view.settings > .settings-view > .container > .editor-group > .editor input[type="number"] {
- margin-left: var(--settings-input-number-margin-start);
- margin-right: var(--settings-input-number-margin-end);
-}
-
-body[dir=rtl] .content-view.settings > .settings-view > .container > .editor-group > .editor input[type="number"] {
- margin-left: var(--settings-input-number-margin-end);
- margin-right: var(--settings-input-number-margin-start);
-}
-
@media (prefers-color-scheme: dark) {
.content-view.settings .navigation-bar {
background-color: var(--background-color-content);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ThreadTreeElement.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ThreadTreeElement.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ThreadTreeElement.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -52,38 +52,16 @@
}
.tree-outline > .item.thread + ol > .item.truncated-call-frames {
+ -webkit-margin-start: 31px;
+ -webkit-margin-end: 6px;
+ -webkit-padding-start: 0;
color: var(--text-color-gray-medium);
border-top: dashed 0.5px var(--border-color);
cursor: default;
-
- --truncated-call-frames-margin-start: 31px;
- --truncated-call-frames-margin-end: 6px;
- --truncated-call-frames-padding-start: 0;
}
-body[dir=ltr] .tree-outline > .item.thread + ol > .item.truncated-call-frames {
- margin-right: var(--truncated-call-frames-margin-end);
- margin-left: var(--truncated-call-frames-margin-start);
- padding-left: var(--truncated-call-frames-padding-start);
-}
-
-body[dir=rtl] .tree-outline > .item.thread + ol > .item.truncated-call-frames {
- margin-right: var(--truncated-call-frames-margin-start);
- margin-left: var(--truncated-call-frames-margin-end);
- padding-right: var(--truncated-call-frames-padding-start);
-}
-
.tree-outline > .item.thread + ol > .item.truncated-call-frames .icon {
+ -webkit-margin-start: 0;
content: url(../Images/Function.svg);
opacity: 0.6;
-
- --truncated-call-frames-icon-margin-start: 0;
}
-
-body[dir=ltr] .tree-outline > .item.thread + ol > .item.truncated-call-frames .icon {
- margin-left: var(--truncated-call-frames-icon-margin-start);
-}
-
-body[dir=rtl] .tree-outline > .item.thread + ol > .item.truncated-call-frames .icon {
- margin-right: var(--truncated-call-frames-icon-margin-start);
-}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Toolbar.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/Toolbar.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Toolbar.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -60,30 +60,14 @@
.toolbar .control-section {
display: flex;
-
flex-direction: row;
align-items: center;
justify-content: center;
-
- padding-left: 6px;
- padding-right: 2px;
-
min-width: -webkit-min-content;
-
- --toolbar-control-section-padding-start: 6px;
- --toolbar-control-section-padding-end: 2px;
+ -webkit-padding-start: 6px;
+ -webkit-padding-end: 2px;
}
-body[dir=ltr] .toolbar .control-section {
- padding-left: var(--toolbar-control-section-padding-start);
- padding-right: var(--toolbar-control-section-padding-end);
-}
-
-body[dir=rtl] .toolbar .control-section {
- padding-left: var(--toolbar-control-section-padding-end);
- padding-right: var(--toolbar-control-section-padding-start);
-}
-
.toolbar .item-section {
display: flex;
flex: 1;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -34,8 +34,6 @@
--tree-outline-icon-margin-start: 16px;
--tree-outline-icon-margin-end: 3px;
-
- --tree-outline-status-margin-start: 4px;
}
.tree-outline .children {
@@ -87,14 +85,10 @@
display: none;
}
-body[dir=ltr] .tree-outline:not(.hide-disclosure-buttons) .item:not(.parent) > .icon {
- margin-left: var(--tree-outline-icon-margin-start);
+.tree-outline:not(.hide-disclosure-buttons) .item:not(.parent) > .icon {
+ -webkit-margin-start: var(--tree-outline-icon-margin-start);
}
-body[dir=rtl] .tree-outline:not(.hide-disclosure-buttons) .item:not(.parent) > .icon {
- margin-right: var(--tree-outline-icon-margin-start);
-}
-
.tree-outline .item .disclosure-button {
display: none;
width: 16px;
@@ -137,16 +131,9 @@
width: 16px;
height: 16px;
margin-top: 1px;
+ -webkit-margin-end: var(--tree-outline-icon-margin-end);
}
-body[dir=ltr] .tree-outline .item .icon {
- margin-right: var(--tree-outline-icon-margin-end);
-}
-
-body[dir=rtl] .tree-outline .item .icon {
- margin-left: var(--tree-outline-icon-margin-end);
-}
-
.tree-outline.compact .item .icon {
margin-top: 0;
}
@@ -159,17 +146,16 @@
.tree-outline .item .status {
margin-top: 1px;
+ -webkit-margin-start: 4px;
line-height: 1em;
}
body[dir=ltr] .tree-outline .item .status {
float: right;
- margin-left: var(--tree-outline-status-margin-start);
}
body[dir=rtl] .tree-outline .item .status {
float: left;
- margin-right: var(--tree-outline-status-margin-start);
}
.tree-outline.large .item .status {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TypeTreeElement.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TypeTreeElement.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TypeTreeElement.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -73,30 +73,16 @@
.item.type-tree-element.prototype {
display: inline-block;
-
- /* Unusual order of values because of <webkit.org/b/192922>. */
- border: hsla(0, 0%, var(--foreground-lightness), 0.06) solid 1px;
+ margin-top: 3px;
+ margin-bottom: 2px;
+ -webkit-margin-start: -1px;
+ padding-bottom: 1px;
+ -webkit-padding-end: 10px;
background-color: hsla(0, 0%, var(--foreground-lightness), 0.03);
+ border: 1px solid hsla(0, 0%, var(--foreground-lightness), 0.06);
border-radius: 3px;
-
- padding-bottom: 1px;
- margin-top: 3px;
- margin-bottom: 2px;
-
- --type-tree-element-prototype-padding-end: 10px;
- --type-tree-element-prototype-margin-start: -1px;
}
-body[dir=ltr] .item.type-tree-element.prototype {
- padding-right: var(--type-tree-element-prototype-padding-end);
- margin-left: var(--type-tree-element-prototype-margin-start);
-}
-
-body[dir=rtl] .item.type-tree-element.prototype {
- padding-left: var(--type-tree-element-prototype-padding-end);
- margin-right: var(--type-tree-element-prototype-margin-start);
-}
-
.item.type-tree-element.prototype:hover,
.item.type-tree-element.prototype:focus {
border-color: hsla(0, 0%, var(--foreground-lightness), 0.1);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TypeTreeView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TypeTreeView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TypeTreeView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -33,24 +33,14 @@
}
.tree-outline.type {
+ min-height: 18px;
margin: 0;
padding-bottom: 2px;
- min-height: 18px;
-
+ -webkit-padding-end: 6px;
list-style: none;
outline: none;
-
- --type-tree-outline-padding-end: 6px;
}
-body[dir=ltr] .tree-outline.type {
- padding-right: var(--type-tree-outline-padding-end);
-}
-
-body[dir=rtl] .tree-outline.type {
- padding-left: var(--type-tree-outline-padding-end);
-}
-
.tree-outline.type li {
padding: 0;
white-space: nowrap;
@@ -72,15 +62,6 @@
}
.tree-outline.type li .empty-message {
+ -webkit-margin-start: 13px;
color: hsl(0, 0%, 60%);
-
- --type-tree-outline-empty-message-margin-start: 13px;
}
-
-body[dir=ltr] .tree-outline.type li .empty-message {
- margin-left: var(--type-tree-outline-empty-message-margin-start);
-}
-
-body[dir=rtl] .tree-outline.type li .empty-message {
- margin-right: var(--type-tree-outline-empty-message-margin-start);
-}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/URLBreakpointPopover.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/URLBreakpointPopover.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/URLBreakpointPopover.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -36,22 +36,13 @@
.popover .url-breakpoint-content > .editor-wrapper > .editor {
width: 180px;
+ -webkit-margin-start: 4px;
padding: 4px 0 2px 0;
-webkit-appearance: textfield;
border: 1px solid hsl(0, 0%, 78%);
background: var(--background-color-code);
-
- --editor-margin-start: 4px;
}
-body[dir=ltr] .popover .url-breakpoint-content > .editor-wrapper > .editor {
- margin-left: var(--editor-margin-start);
-}
-
-body[dir=rtl] .popover .url-breakpoint-content > .editor-wrapper > .editor {
- margin-right: var(--editor-margin-start);
-}
-
.popover .url-breakpoint-content > .editor-wrapper > .editor > .CodeMirror {
width: calc(100% - 2px);
height: auto;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/WebSocketContentView.css (242767 => 242768)
--- trunk/Source/WebInspectorUI/UserInterface/Views/WebSocketContentView.css 2019-03-12 03:21:12 UTC (rev 242767)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/WebSocketContentView.css 2019-03-12 03:22:29 UTC (rev 242768)
@@ -39,27 +39,22 @@
overflow-wrap: break-word;
}
-body[dir=ltr] .web-socket.content-view > .data-grid .data-column > div {
- padding-left: 18px;
+.web-socket.content-view > .data-grid .data-column > div {
+ -webkit-padding-start: 18px;
}
-body[dir=rtl] .web-socket.content-view > .data-grid .data-column > div {
- padding-right: 18px;
-}
-
.web-socket.content-view .icon {
position: absolute;
margin-top: -1px;
+ -webkit-margin-end: 2px;
}
body[dir=ltr] .web-socket.content-view .icon {
left: 4px;
- margin-right: 2px;
}
body[dir=rtl] .web-socket.content-view .icon {
right: 4px;
- margin-left: 2px;
}
.web-socket.content-view .data-grid.variable-height-rows table.data tr:nth-child(odd) {
