- Revision
- 214843
- Author
- mattba...@apple.com
- Date
- 2017-04-03 15:07:46 -0700 (Mon, 03 Apr 2017)
Log Message
Web Inspector: DetailsSection should hide header "options" when collapsed
https://bugs.webkit.org/show_bug.cgi?id=170029
Reviewed by Timothy Hatcher.
* UserInterface/Views/DOMNodeDetailsSidebarPanel.css:
(.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners > .header > .filter):
(.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners.collapsed > .header > .filter): Deleted.
DetailsSection is responsible for hiding options when collapsed.
* UserInterface/Views/DebuggerSidebarPanel.css:
(.sidebar > .panel.navigation.debugger .details-section.paused-reason.collapsed > .header > .options):
* UserInterface/Views/DetailsSection.css:
(body[dir=ltr] .details-section > .header > .options,):
(body[dir=ltr] .details-section > .header::before,):
(.details-section.collapsed > .header > .options):
(body[dir=ltr] .details-section > .header > :matches(label, .node-link, .go-to-arrow),): Deleted.
(.details-section.collapsed > .header > label): Deleted.
Removed unnecessary rules. The "options" class covers these cases.
* UserInterface/Views/DetailsSection.js:
(WebInspector.DetailsSection.prototype.get titleElement):
(WebInspector.DetailsSection.prototype.set titleElement):
Added title element customization so that the hack used by ProbeSetDetailsSection
to get a link into the title can be removed. Yuck!
* UserInterface/Views/ProbeSetDetailsSection.js:
(WebInspector.ProbeSetDetailsSection):
(WebInspector.ProbeSetDetailsSection.prototype._updateLinkElement):
Use the new DetailsSection title element setter.
* UserInterface/Views/VisualStyleDetailsPanel.css:
(.sidebar > .panel.details.css-style .visual > .details-section .details-section > .header > .options):
(.sidebar > .panel.details.css-style .visual > .details-section .details-section > .header > .visual-style-section-clear): Deleted.
(.sidebar > .panel.details.css-style .visual > .details-section .details-section.collapsed > .header > .visual-style-section-clear,): Deleted.
Remove the "visual-style-section-clear" class, as it's no longer needed.
* UserInterface/Views/VisualStyleDetailsPanel.js:
(WebInspector.VisualStyleDetailsPanel.prototype._generateSection.createOptionsElement):
(WebInspector.VisualStyleDetailsPanel.prototype._generateSection):
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (214842 => 214843)
--- trunk/Source/WebInspectorUI/ChangeLog 2017-04-03 22:06:51 UTC (rev 214842)
+++ trunk/Source/WebInspectorUI/ChangeLog 2017-04-03 22:07:46 UTC (rev 214843)
@@ -1,3 +1,47 @@
+2017-04-03 Matt Baker <mattba...@apple.com>
+
+ Web Inspector: DetailsSection should hide header "options" when collapsed
+ https://bugs.webkit.org/show_bug.cgi?id=170029
+
+ Reviewed by Timothy Hatcher.
+
+ * UserInterface/Views/DOMNodeDetailsSidebarPanel.css:
+ (.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners > .header > .filter):
+ (.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners.collapsed > .header > .filter): Deleted.
+ DetailsSection is responsible for hiding options when collapsed.
+
+ * UserInterface/Views/DebuggerSidebarPanel.css:
+ (.sidebar > .panel.navigation.debugger .details-section.paused-reason.collapsed > .header > .options):
+
+ * UserInterface/Views/DetailsSection.css:
+ (body[dir=ltr] .details-section > .header > .options,):
+ (body[dir=ltr] .details-section > .header::before,):
+ (.details-section.collapsed > .header > .options):
+ (body[dir=ltr] .details-section > .header > :matches(label, .node-link, .go-to-arrow),): Deleted.
+ (.details-section.collapsed > .header > label): Deleted.
+ Removed unnecessary rules. The "options" class covers these cases.
+
+ * UserInterface/Views/DetailsSection.js:
+ (WebInspector.DetailsSection.prototype.get titleElement):
+ (WebInspector.DetailsSection.prototype.set titleElement):
+ Added title element customization so that the hack used by ProbeSetDetailsSection
+ to get a link into the title can be removed. Yuck!
+
+ * UserInterface/Views/ProbeSetDetailsSection.js:
+ (WebInspector.ProbeSetDetailsSection):
+ (WebInspector.ProbeSetDetailsSection.prototype._updateLinkElement):
+ Use the new DetailsSection title element setter.
+
+ * UserInterface/Views/VisualStyleDetailsPanel.css:
+ (.sidebar > .panel.details.css-style .visual > .details-section .details-section > .header > .options):
+ (.sidebar > .panel.details.css-style .visual > .details-section .details-section > .header > .visual-style-section-clear): Deleted.
+ (.sidebar > .panel.details.css-style .visual > .details-section .details-section.collapsed > .header > .visual-style-section-clear,): Deleted.
+ Remove the "visual-style-section-clear" class, as it's no longer needed.
+
+ * UserInterface/Views/VisualStyleDetailsPanel.js:
+ (WebInspector.VisualStyleDetailsPanel.prototype._generateSection.createOptionsElement):
+ (WebInspector.VisualStyleDetailsPanel.prototype._generateSection):
+
2017-04-03 Joseph Pecoraro <pecor...@apple.com>
Web Inspector: "Space" is not localizable in Timelines record button tooltips
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.css (214842 => 214843)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.css 2017-04-03 22:06:51 UTC (rev 214842)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.css 2017-04-03 22:07:46 UTC (rev 214843)
@@ -24,7 +24,6 @@
*/
.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners > .header > .filter {
- display: inline-block;
position: relative;
width: 14px;
height: 14px;
@@ -46,10 +45,6 @@
filter: brightness(0.5);
}
-.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners.collapsed > .header > .filter {
- display: none;
-}
-
.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners > .header > .filter > select {
position: absolute;
top: 0;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css (214842 => 214843)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css 2017-04-03 22:06:51 UTC (rev 214842)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css 2017-04-03 22:07:46 UTC (rev 214843)
@@ -79,6 +79,10 @@
font-size: 11px;
}
+.sidebar > .panel.navigation.debugger .details-section.paused-reason.collapsed > .header > .options {
+ display: block;
+}
+
.sidebar > .panel.navigation.debugger .details-section > .content {
display: block;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css (214842 => 214843)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css 2017-04-03 22:06:51 UTC (rev 214842)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css 2017-04-03 22:07:46 UTC (rev 214843)
@@ -79,15 +79,13 @@
border: none;
}
-body[dir=ltr] .details-section > .header > :matches(label, .node-link, .go-to-arrow),
-body[dir=ltr] .details-section > .header > .options > .navigation-bar,
+body[dir=ltr] .details-section > .header > .options,
body[dir=rtl] .details-section > .header::before {
float: right;
}
body[dir=ltr] .details-section > .header::before,
-body[dir=rtl] .details-section > .header > .options > .navigation-bar,
-body[dir=rtl] .details-section > .header > :matches(label, .node-link, .go-to-arrow) {
+body[dir=rtl] .details-section > .header > .options {
float: left;
}
@@ -146,7 +144,7 @@
text-align: end;
}
-.details-section.collapsed > .header > label {
+.details-section.collapsed > .header > .options {
display: none;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js (214842 => 214843)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js 2017-04-03 22:06:51 UTC (rev 214842)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js 2017-04-03 22:07:46 UTC (rev 214843)
@@ -85,6 +85,19 @@
this._titleElement.textContent = title;
}
+ get titleElement()
+ {
+ return this._titleElement;
+ }
+
+ set titleElement(element)
+ {
+ console.assert(element instanceof HTMLElement, "Expected titleElement to be an HTMLElement.", element);
+
+ this._headerElement.replaceChild(element, this._titleElement);
+ this._titleElement = element;
+ }
+
get collapsed()
{
return this._element.classList.contains(WebInspector.DetailsSection.CollapsedStyleClassName);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js (214842 => 214843)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js 2017-04-03 22:06:51 UTC (rev 214842)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js 2017-04-03 22:07:46 UTC (rev 214843)
@@ -42,8 +42,6 @@
this.element.classList.add("probe-set");
- this._optionsElement = optionsElement;
-
this._listenerSet = new WebInspector.EventListenerSet(this, "ProbeSetDetailsSection UI listeners");
this._probeSet = probeSet;
this._dataGrid = dataGrid;
@@ -96,24 +94,17 @@
_updateLinkElement()
{
var breakpoint = this._probeSet.breakpoint;
- var titleElement = null;
if (breakpoint.sourceCodeLocation.sourceCode)
- titleElement = WebInspector.createSourceCodeLocationLink(breakpoint.sourceCodeLocation);
+ this.titleElement = WebInspector.createSourceCodeLocationLink(breakpoint.sourceCodeLocation);
else {
// Fallback for when we can't create a live source link.
console.assert(!breakpoint.resolved);
var location = breakpoint.sourceCodeLocation;
- titleElement = WebInspector.linkifyLocation(breakpoint.contentIdentifier, location.displayLineNumber, location.displayColumnNumber);
+ this.titleElement = WebInspector.linkifyLocation(breakpoint.contentIdentifier, location.displayLineNumber, location.displayColumnNumber);
}
- titleElement.classList.add(WebInspector.ProbeSetDetailsSection.DontFloatLinkStyleClassName);
-
- if (this._linkElement)
- this._optionsElement.removeChild(this._linkElement);
-
- this._linkElement = titleElement;
- this._optionsElement.appendChild(this._linkElement);
+ this.titleElement.classList.add(WebInspector.ProbeSetDetailsSection.DontFloatLinkStyleClassName);
}
_addProbeButtonClicked(event)
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/VisualStyleDetailsPanel.css (214842 => 214843)
--- trunk/Source/WebInspectorUI/UserInterface/Views/VisualStyleDetailsPanel.css 2017-04-03 22:06:51 UTC (rev 214842)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/VisualStyleDetailsPanel.css 2017-04-03 22:07:46 UTC (rev 214843)
@@ -35,9 +35,7 @@
font-weight: normal;
}
-.sidebar > .panel.details.css-style .visual > .details-section .details-section > .header > .visual-style-section-clear {
- position: absolute;
- right: 5px;
+.sidebar > .panel.details.css-style .visual > .details-section .details-section > .header > .options {
width: 15px;
height: 15px;
background-image: url(../Images/NavigationItemTrash.svg);
@@ -45,11 +43,6 @@
opacity: 0.7;
}
-.sidebar > .panel.details.css-style .visual > .details-section .details-section.collapsed > .header > .visual-style-section-clear,
-.sidebar > .panel.details.css-style .visual > .details-section .details-section:not(.modified) > .header > .visual-style-section-clear {
- display: none;
-}
-
.sidebar > .panel.details.css-style .visual > .details-section .details-section > .header > span {
display: flex;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/VisualStyleDetailsPanel.js (214842 => 214843)
--- trunk/Source/WebInspectorUI/UserInterface/Views/VisualStyleDetailsPanel.js 2017-04-03 22:06:51 UTC (rev 214842)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/VisualStyleDetailsPanel.js 2017-04-03 22:07:46 UTC (rev 214843)
@@ -147,7 +147,6 @@
function createOptionsElement() {
let container = document.createElement("div");
- container.classList.add("visual-style-section-clear");
container.title = WebInspector.UIString("Clear modified properties");
container.addEventListener("click", this._clearModifiedSection.bind(this, camelCaseId));
return container;
