config_service: make UI responsive and change colors.

config_service: make UI responsive and change colors.

Add colors, fix word-wrap. Adjust header and make UI responsive.

BUG=740775
Review-Url: https://codereview.chromium.org/2983493002
Committed: https://github.com/luci/luci-py/commit/dc53549f921bcf9acc826ef43baba70635182af2

[ayanaadylova, 2017-07-13 17:28:17]

ayanaadylova@google.com changed reviewers:
+ hinoka@chromium.org, sergeyberezin@chromium.org

[ayanaadylova, 2017-07-13 17:28:18]

PTAL
Link to the staging version:
https://2963-4d627a5-tainted-ayanaadylova-dot-luci-config.appspot.com/newui

[Sergey Berezin, 2017-07-13 19:06:54]

LGTM, assuming the existing tests still pass.

Very nice, thank you! I don't have any comments, but please wait for hinoka@ to
review.

[Ryan Tseng, 2017-07-13 22:16:52]

hinoka@google.com changed reviewers:
+ hinoka@google.com

[Ryan Tseng, 2017-07-13 22:16:53]

This looks really good!  lgtm

Some things i'd add (in a separate CL):
* Alt/Hover text for the iron-icons.  This is also good for accessibility
* Remove the "open" button and just make the entire card clickable.

https://codereview.chromium.org/2983493002/diff/1/appengine/config_service/ui...
File appengine/config_service/ui/src/config-ui/config-set-card.html (right):

https://codereview.chromium.org/2983493002/diff/1/appengine/config_service/ui...
appengine/config_service/ui/src/config-ui/config-set-card.html:48: <iron-icon
icon="icons:check-circle" style="color: var(--paper-green-600);"></iron-icon>
should give these class names and add them to the <style> block instead.

https://codereview.chromium.org/2983493002/diff/1/appengine/config_service/ui...
File appengine/config_service/ui/src/config-ui/config-set.html (right):

https://codereview.chromium.org/2983493002/diff/1/appengine/config_service/ui...
appengine/config_service/ui/src/config-ui/config-set.html:82: <iron-icon
id="valid" icon="icons:check-circle" style="color:
var(--paper-green-600);"></iron-icon>
Styles go in <style> block

[ayanaadylova, 2017-07-13 23:23:12]

The CQ bit was checked by ayanaadylova@google.com

[ayanaadylova, 2017-07-13 23:23:12]

The patchset sent to the CQ was uploaded after l-g-t-m from
sergeyberezin@chromium.org, hinoka@google.com
Link to the patchset: https://codereview.chromium.org/2983493002/#ps20001
(title: "Move styles to the <style> section.")

[commit-bot: I haz the power, 2017-07-13 23:23:19]

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, 2017-07-13 23:25:51]

CQ is committing da patch.

Bot data: {"patchset_id": 20001, "attempt_start_ts": 1499988192282540,
"parent_rev": "7c6ec1179bb17cb5c726655e2a5a4845d150feba", "commit_rev":
"dc53549f921bcf9acc826ef43baba70635182af2"}

[commit-bot: I haz the power, 2017-07-13 23:25:55]

Description was changed from

==========
config_service: make UI responsive and change colors.

Add colors, fix word-wrap. Adjust header and make UI responsive.

BUG=740775
==========

to

==========
config_service: make UI responsive and change colors.

Add colors, fix word-wrap. Adjust header and make UI responsive.

BUG=740775

Review-Url: https://codereview.chromium.org/2983493002
Committed:
https://github.com/luci/luci-py/commit/dc53549f921bcf9acc826ef43baba70635182af2
==========

[commit-bot: I haz the power, 2017-07-13 23:25:56]

Committed patchset #2 (id:20001) as
https://github.com/luci/luci-py/commit/dc53549f921bcf9acc826ef43baba70635182af2