DevTools: Update styles for full text search drawer panel

DevTools: Update styles for full text search drawer panel

BUG=604833
Committed: https://crrev.com/de496bd9eb61224a98706299f73b1898a3a210c0
Cr-Commit-Position: refs/heads/master@{#390177}

[luoe, 2016-04-19 21:17:51]

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

[luoe, 2016-04-19 21:19:29]

Description was changed from

==========
Update styles for full text search drawer panel

Update styling for full text search

BUG=604833
==========

to

==========
Update styles for full text search drawer panel

This CL depends on another: https://codereview.chromium.org/1897383002
which makes the panel-separator CSS class available.

BUG=604833
==========

[luoe, 2016-04-20 21:55:58]

Description was changed from

==========
Update styles for full text search drawer panel

This CL depends on another: https://codereview.chromium.org/1897383002
which makes the panel-separator CSS class available.

BUG=604833
==========

to

==========
Update styles for full text search drawer panel

BUG=604833
==========

[luoe, 2016-04-22 18:32:15]

Style/icon reflects new design.  Ready for review.

[lushnikov, 2016-04-22 19:19:08]

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/devtools.gypi (right):

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/devtools.gypi:855:
'front_end/Images/search.png',
Let's put this icon into toolbarButtonGlyphs

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js
(right):

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js:27:
this._search.placeholder = WebInspector.UIString("Search all sources (use
\"path:\" to filter by path)");
Should be "Use "file:" to filter by path

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js:35:
this._searchClearQueryElement.classList.add("hidden");
this._searchClearQueryElemen.hidden = true

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js:275:
this._searchClearQueryElement.classList.remove("hidden");
when do you want to show this button? Only for focused input? Only for focused
non-empty input?

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/front_end/sources/sourcesSearch.css
(right):

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/sourcesSearch.css:33:
.search-config-search::-webkit-search-cancel-button {
hmm, can't we simply use input type=search? Won't it show both the looking glass
and cancel icons?

[luoe, 2016-04-22 19:44:12]

Description was changed from

==========
Update styles for full text search drawer panel

BUG=604833
==========

to

==========
DevTools: Update styles for full text search drawer panel

BUG=604833
==========

[luoe, 2016-04-23 00:01:57]

Comments addressed.  Ready for review

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/devtools.gypi (right):

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/devtools.gypi:855:
'front_end/Images/search.png',
On 2016/04/22 19:19:08, lushnikov wrote:
> Let's put this icon into toolbarButtonGlyphs 

Done.

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js
(right):

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js:27:
this._search.placeholder = WebInspector.UIString("Search all sources (use
\"path:\" to filter by path)");
On 2016/04/22 19:19:08, lushnikov wrote:
> Should be "Use "file:" to filter by path

Done.

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js:35:
this._searchClearQueryElement.classList.add("hidden");
On 2016/04/22 19:19:08, lushnikov wrote:
> this._searchClearQueryElemen.hidden = true

Done.

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js:275:
this._searchClearQueryElement.classList.remove("hidden");
On 2016/04/22 19:19:08, lushnikov wrote:
> when do you want to show this button? Only for focused input? Only for focused
> non-empty input?

In patch 4, it only shows up when there is text in the field.

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
File third_party/WebKit/Source/devtools/front_end/sources/sourcesSearch.css
(right):

https://codereview.chromium.org/1902283002/diff/40001/third_party/WebKit/Sour...
third_party/WebKit/Source/devtools/front_end/sources/sourcesSearch.css:33:
.search-config-search::-webkit-search-cancel-button {
On 2016/04/22 19:19:08, lushnikov wrote:
> hmm, can't we simply use input type=search? Won't it show both the looking
glass
> and cancel icons?

It would give us system default icons, but we don't have total control in
styling the 'x' with CSS.  It allows us to add outlines to it, but we can't
change the background image.

[lushnikov, 2016-04-25 23:53:32]

can you please revaseline this patch so that I can apply it locally?

[luoe, 2016-04-26 00:19:03]

On 2016/04/25 23:53:32, lushnikov wrote:
> can you please revaseline this patch so that I can apply it locally?

Ok, I just rebased, it should work after compiling Chromium

[luoe, 2016-04-27 02:44:58]

I'm pretty sure this is good, but please give a LGTM if you think it's ready.

[luoe, 2016-04-27 18:14:11]

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

[commit-bot: I haz the power, 2016-04-27 18:14:34]

Dry run: CQ is trying da patch. Follow status at
 https://chromium-cq-status.appspot.com/patch-status/1902283002/80001
View timeline at
 https://chromium-cq-status.appspot.com/patch-timeline/1902283002/80001

[lushnikov, 2016-04-27 18:54:31]

lgtm, thanks!

[commit-bot: I haz the power, 2016-04-27 19:23:11]

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

[commit-bot: I haz the power, 2016-04-27 19:23:17]

Dry run: This issue passed the CQ dry run.

[luoe, 2016-04-27 20:46:55]

The CQ bit was checked by luoe@chromium.org

[commit-bot: I haz the power, 2016-04-27 20:47:19]

CQ is trying da patch. Follow status at
 https://chromium-cq-status.appspot.com/patch-status/1902283002/80001
View timeline at
 https://chromium-cq-status.appspot.com/patch-timeline/1902283002/80001

[commit-bot: I haz the power, 2016-04-27 20:52:36]

Description was changed from

==========
DevTools: Update styles for full text search drawer panel

BUG=604833
==========

to

==========
DevTools: Update styles for full text search drawer panel

BUG=604833
==========

[commit-bot: I haz the power, 2016-04-27 20:52:38]

Committed patchset #5 (id:80001)

[commit-bot: I haz the power, 2016-04-30 17:12:51]

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

[commit-bot: I haz the power, 2016-04-30 17:51:46]

Description was changed from

==========
DevTools: Update styles for full text search drawer panel

BUG=604833
==========

to

==========
DevTools: Update styles for full text search drawer panel

BUG=604833

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