Title: [214846] trunk/Source/WebInspectorUI
- Revision
- 214846
- Author
- bb...@apple.com
- Date
- 2017-04-03 15:10:36 -0700 (Mon, 03 Apr 2017)
Log Message
Web Inspector: RTL: layout issues in call frame tree elements and async call stacks
https://bugs.webkit.org/show_bug.cgi?id=170419
Reviewed by Matt Baker.
* UserInterface/Views/CallFrameTreeElement.css:
(.tree-outline .item.call-frame .status):
(body[dir=ltr] .tree-outline .item.call-frame .status):
(body[dir=rtl] .tree-outline .item.call-frame .status):
Flip the current call frame indicator and make sure it sticks to the leading edge.
(.tree-outline .item.call-frame.async-boundary):
(body[dir=ltr] .tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary):
(body[dir=rtl] .tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary):
(.tree-outline .item.call-frame.async-boundary .icon):
(body[dir=ltr] .tree-outline .item.call-frame.async-boundary .icon):
(body[dir=rtl] .tree-outline .item.call-frame.async-boundary .icon):
Flip the icon's padding.
(.tree-outline .item.call-frame.async-boundary::after):
(body[dir=ltr] .tree-outline .item.call-frame.async-boundary::after):
(body[dir=rtl] .tree-outline .item.call-frame.async-boundary::after):
(.tree-outline .item.call-frame.async-boundary::before):
(body[dir=ltr] .tree-outline .item.call-frame.async-boundary::before):
(body[dir=rtl] .tree-outline .item.call-frame.async-boundary::before):
(.tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary): Deleted.
Fix the leading and trailing horizontal rules so they have correct spacing.
* UserInterface/Views/CallFrameView.css:
(.call-frame .icon): Remove redundant property.
* UserInterface/Views/DebuggerSidebarPanel.css:
(.sidebar > .panel.navigation.debugger .tree-outline.single-thread):
(body[dir=ltr] .sidebar > .panel.navigation.debugger .tree-outline.single-thread):
(body[dir=rtl] .sidebar > .panel.navigation.debugger .tree-outline.single-thread):
Fix the leading unindent for call tree frame elements.
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (214845 => 214846)
--- trunk/Source/WebInspectorUI/ChangeLog 2017-04-03 22:09:47 UTC (rev 214845)
+++ trunk/Source/WebInspectorUI/ChangeLog 2017-04-03 22:10:36 UTC (rev 214846)
@@ -1,3 +1,42 @@
+2017-04-03 Brian Burg <bb...@apple.com>
+
+ Web Inspector: RTL: layout issues in call frame tree elements and async call stacks
+ https://bugs.webkit.org/show_bug.cgi?id=170419
+
+ Reviewed by Matt Baker.
+
+ * UserInterface/Views/CallFrameTreeElement.css:
+ (.tree-outline .item.call-frame .status):
+ (body[dir=ltr] .tree-outline .item.call-frame .status):
+ (body[dir=rtl] .tree-outline .item.call-frame .status):
+ Flip the current call frame indicator and make sure it sticks to the leading edge.
+
+ (.tree-outline .item.call-frame.async-boundary):
+ (body[dir=ltr] .tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary):
+ (body[dir=rtl] .tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary):
+ (.tree-outline .item.call-frame.async-boundary .icon):
+ (body[dir=ltr] .tree-outline .item.call-frame.async-boundary .icon):
+ (body[dir=rtl] .tree-outline .item.call-frame.async-boundary .icon):
+ Flip the icon's padding.
+
+ (.tree-outline .item.call-frame.async-boundary::after):
+ (body[dir=ltr] .tree-outline .item.call-frame.async-boundary::after):
+ (body[dir=rtl] .tree-outline .item.call-frame.async-boundary::after):
+ (.tree-outline .item.call-frame.async-boundary::before):
+ (body[dir=ltr] .tree-outline .item.call-frame.async-boundary::before):
+ (body[dir=rtl] .tree-outline .item.call-frame.async-boundary::before):
+ (.tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary): Deleted.
+ Fix the leading and trailing horizontal rules so they have correct spacing.
+
+ * UserInterface/Views/CallFrameView.css:
+ (.call-frame .icon): Remove redundant property.
+
+ * UserInterface/Views/DebuggerSidebarPanel.css:
+ (.sidebar > .panel.navigation.debugger .tree-outline.single-thread):
+ (body[dir=ltr] .sidebar > .panel.navigation.debugger .tree-outline.single-thread):
+ (body[dir=rtl] .sidebar > .panel.navigation.debugger .tree-outline.single-thread):
+ Fix the leading unindent for call tree frame elements.
+
2017-04-03 Matt Baker <mattba...@apple.com>
Web Inspector: Elements tab: show indicators for hidden DOM breakpoints
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css (214845 => 214846)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css 2017-04-03 22:09:47 UTC (rev 214845)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css 2017-04-03 22:10:36 UTC (rev 214846)
@@ -1,5 +1,5 @@
/*
- * Copyright (C) 2016 Apple Inc. All rights reserved.
+ * Copyright (C) 2016-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
@@ -26,15 +26,21 @@
.tree-outline .item.call-frame .status {
position: absolute;
float: none;
- left: 1px;
+
+ --call-frame-status-start: 1px;
+ --call-frame-status-margin-start: 1px;
}
body[dir=ltr] .tree-outline .item.call-frame .status {
- margin-left: 0;
+ left: var(--call-frame-status-start);
+ margin-left: var(--call-frame-status-margin-start);
}
body[dir=rtl] .tree-outline .item.call-frame .status {
- margin-right: 0;
+ 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 {
@@ -54,18 +60,36 @@
.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;
}
-.tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary {
- padding-left: 5px;
+body[dir=ltr] .tree-outline:not(.single-thread) > .children > .item.call-frame.async-boundary {
+ padding-left: var(--call-frame-async-boundary-padding-start);
}
+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 {
float: none;
display: inline-block;
- margin-left: 0 !important;
+
+ --call-frame-async-boundary-icon-margin-start: 0;
}
+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: "";
@@ -78,15 +102,30 @@
.tree-outline .item.call-frame.async-boundary::after {
width: 100%;
- margin-left: 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;
- margin-left: -5px;
- margin-right: 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 (214845 => 214846)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css 2017-04-03 22:09:47 UTC (rev 214845)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css 2017-04-03 22:10:36 UTC (rev 214846)
@@ -33,7 +33,6 @@
vertical-align: top;
width: 16px;
height: 16px;
- margin-right: 3px;
}
.call-frame .titles {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css (214845 => 214846)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css 2017-04-03 22:09:47 UTC (rev 214845)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css 2017-04-03 22:10:36 UTC (rev 214846)
@@ -67,9 +67,17 @@
}
.sidebar > .panel.navigation.debugger .tree-outline.single-thread {
- margin-left: -10px;
+ --tree-outline-single-thread-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;
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes
