DevTools: migrate navigator icons to UI.Icon

DevTools: migrate navigator icons to UI.Icon

This patch migrates navigator icons to UI.Icon. As a part of the effort,
the patch introduces TreeElement.setLeadingIcons() method, which
is symmetrical to the TreeElement.setTrailingIcons() method.

BUG=669323
R=dgozman

Committed: https://crrev.com/f57bbe14987449e3024addabdb81f1c42843a977
Cr-Commit-Position: refs/heads/master@{#439618}

[lushnikov, 2016-12-17 08:47:46]

Description was changed from

==========
DevTools: migrate navigator to UI.Icon
==========

to

==========
DevTools: migrate navigator icons to UI.Icon

This patch migrates navigator icons to UI.Icon. As a part of the effort,
the patch introduces TreeElement.setLeadingIcons() method, which
is symmetrical to the TreeElement.setTrailingIcons() method.

BUG=669323
R=dgozman
==========

[lushnikov, 2016-12-17 08:47:46]

lushnikov@chromium.org changed reviewers:
+ dgozman@chromium.org

[lushnikov, 2016-12-17 08:47:53]

The CQ bit was checked by lushnikov@chromium.org to run a CQ dry run

[commit-bot: I haz the power, 2016-12-17 08:48:05]

Dry run: CQ is trying da patch. Follow status at
 
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[lushnikov, 2016-12-17 09:40:31]

please, take a look

[commit-bot: I haz the power, 2016-12-17 10:11:41]

The CQ bit was unchecked by commit-bot@chromium.org

[commit-bot: I haz the power, 2016-12-17 10:11:41]

Dry run: This issue passed the CQ dry run.

[dgozman, 2016-12-19 18:32:43]

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css
(right):

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css:31:
margin: -3px -3px -3px -7px;
Instead of this, change the size of the icons. They are not 32x24.

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css:45:
background: white !important;
Not needed.

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css:49:
background: white !important;
Not needed.

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css:68:
background: linear-gradient(45deg, hsl(28, 75%, 50%), hsl(28, 75%, 70%));
It's unfortunate that I have to set color in css, and set icon type in js. Makes
me handle twice as much. Can we avoid that?

[lushnikov, 2016-12-19 19:55:21]

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css
(right):

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css:31:
margin: -3px -3px -3px -7px;
On 2016/12/19 18:32:43, dgozman wrote:
> Instead of this, change the size of the icons. They are not 32x24.

I tried this, two reasons I decided to keep this as-is:
1. Since margin is not symmetrical, this line will stay, but with different
numbers
2. Since icons are colored via linear-gradient, and the size of the icon gets
changed, every gradient has to be changed as well. This seems just not worth it

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css:45:
background: white !important;
On 2016/12/19 18:32:43, dgozman wrote:
> Not needed.

Done.

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css:49:
background: white !important;
On 2016/12/19 18:32:43, dgozman wrote:
> Not needed.

Done.

https://codereview.chromium.org/2580163002/diff/20001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/navigatorTree.css:68:
background: linear-gradient(45deg, hsl(28, 75%, 50%), hsl(28, 75%, 70%));
On 2016/12/19 18:32:43, dgozman wrote:
> It's unfortunate that I have to set color in css, and set icon type in js.
Makes
> me handle twice as much. Can we avoid that?

This is needed to support dark theme. It would be great to have a better build
system for icons to support dark themes; i have a few ideas regarding this.

[lushnikov, 2016-12-19 19:55:28]

The CQ bit was checked by lushnikov@chromium.org to run a CQ dry run

[commit-bot: I haz the power, 2016-12-19 19:56:16]

Dry run: CQ is trying da patch. Follow status at
 
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[dgozman, 2016-12-19 20:24:37]

lgtm

https://codereview.chromium.org/2580163002/diff/40001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/front_end/ui/treeoutline.css (right):

https://codereview.chromium.org/2580163002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/ui/treeoutline.css:94: align-items:
center;
margin-right: 4px;

[lushnikov, 2016-12-19 20:42:40]

Thanks.

(Also, added a center aligning for the trailing icons)

https://codereview.chromium.org/2580163002/diff/40001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/front_end/ui/treeoutline.css (right):

https://codereview.chromium.org/2580163002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/ui/treeoutline.css:94: align-items:
center;
On 2016/12/19 20:24:37, dgozman wrote:
> margin-right: 4px;

Done.

[lushnikov, 2016-12-19 20:43:11]

The CQ bit was checked by lushnikov@chromium.org

[lushnikov, 2016-12-19 20:43:11]

The patchset sent to the CQ was uploaded after l-g-t-m from dgozman@chromium.org
Link to the patchset: https://codereview.chromium.org/2580163002/#ps60001
(title: "address comments")

[commit-bot: I haz the power, 2016-12-19 20:43:50]

CQ is trying da patch. Follow status at
 
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[commit-bot: I haz the power, 2016-12-19 23:46:18]

CQ is committing da patch.

Bot data: {"patchset_id": 60001, "attempt_start_ts": 1482180191266810,
"parent_rev": "b57e25fe4827658b99bee603be420ea80808d4d1", "commit_rev":
"325ca93e89abceb0434d1dab0bbae13e8c8cf99d"}

[commit-bot: I haz the power, 2016-12-19 23:46:44]

Description was changed from

==========
DevTools: migrate navigator icons to UI.Icon

This patch migrates navigator icons to UI.Icon. As a part of the effort,
the patch introduces TreeElement.setLeadingIcons() method, which
is symmetrical to the TreeElement.setTrailingIcons() method.

BUG=669323
R=dgozman
==========

to

==========
DevTools: migrate navigator icons to UI.Icon

This patch migrates navigator icons to UI.Icon. As a part of the effort,
the patch introduces TreeElement.setLeadingIcons() method, which
is symmetrical to the TreeElement.setTrailingIcons() method.

BUG=669323
R=dgozman

Review-Url: https://codereview.chromium.org/2580163002
==========

[commit-bot: I haz the power, 2016-12-19 23:46:45]

Committed patchset #4 (id:60001)

[commit-bot: I haz the power, 2016-12-19 23:49:34]

Description was changed from

==========
DevTools: migrate navigator icons to UI.Icon

This patch migrates navigator icons to UI.Icon. As a part of the effort,
the patch introduces TreeElement.setLeadingIcons() method, which
is symmetrical to the TreeElement.setTrailingIcons() method.

BUG=669323
R=dgozman

Review-Url: https://codereview.chromium.org/2580163002
==========

to

==========
DevTools: migrate navigator icons to UI.Icon

This patch migrates navigator icons to UI.Icon. As a part of the effort,
the patch introduces TreeElement.setLeadingIcons() method, which
is symmetrical to the TreeElement.setTrailingIcons() method.

BUG=669323
R=dgozman

Committed: https://crrev.com/f57bbe14987449e3024addabdb81f1c42843a977
Cr-Commit-Position: refs/heads/master@{#439618}
==========

[commit-bot: I haz the power, 2016-12-19 23:49:35]

Patchset 4 (id:??) landed as
https://crrev.com/f57bbe14987449e3024addabdb81f1c42843a977
Cr-Commit-Position: refs/heads/master@{#439618}

[lushnikov, 2016-12-20 02:38:56]

Patchset #5 (id:80001) has been deleted