ChromeOS: Update styles of material design OOBE.

chrome/browser/resources/chromeos/login/oobe_i18n_dropdown.css

Index: chrome/browser/resources/chromeos/login/oobe_i18n_dropdown.css
diff --git a/chrome/browser/resources/chromeos/login/oobe_i18n_dropdown.css b/chrome/browser/resources/chromeos/login/oobe_i18n_dropdown.css
new file mode 100644
index 0000000000000000000000000000000000000000..d7c86af1a6c3aeeed0ad3f5648645e00373fb1f0
--- /dev/null
+++ b/chrome/browser/resources/chromeos/login/oobe_i18n_dropdown.css
@@ -0,0 +1,38 @@
+/* Copyright 2016 The Chromium Authors. All rights reserved.
+   Use of this source code is governed by a BSD-style license that can be

[michaelpg, 2016/08/18 19:40:59]

asterisks

+   found in the LICENSE file. */
+
+:host {
+  --paper-font-subhead_-_font-family: Roboto, sans-serif;

[michaelpg, 2016/08/18 19:40:59]

These names are implementation details of Polymer's mixin shim; do not use them.

Whatever you're trying to style that uses @apply(--paper-font-subhead), see if
you can style that directly or if it provides variables or mixins to override
these styles.

If you really have to, override the mixin itself, without throwing away
--paper-font-common-base:

https://github.com/PolymerElements/paper-styles/blob/5fabbe6799996e1c1f3c4903...

[Alexander Alekseev, 2016/08/19 06:00:06]

This is needed to style <input> element inside <paper-dropdown-menu>. And I
didn't find another way to style it.
I couldn't get overridden mixin to work.

[michaelpg, 2016/08/19 06:10:49]

I'm sorry, but this is not a good way of doing it. Polymer could (and probably
will) change this at any time, and whoever is pulling Polymer into Chrome won't
know to check that the <input> of a dropdown menu in OOBE is a certain exact
font.

Again, check the paper-dropdown-menu docs and look for mixins, there are
definitely ways to style the input.

[Alexander Alekseev, 2016/08/19 06:25:43]

Ok, let's remove this by now (this will result in incorrect font height, but I
will return to this later).

+  --paper-font-subhead_-_font-size: 13px;
+  --paper-font-subhead_-_font-weight: normal;
+}
+
+.selected-icon {
+  --iron-icon-height: 16px;
+  --iron-icon-width: 16px;
+  color: var(--google-blue-500);
+  padding-left: 8px;
+}
+
+paper-item:not([hr]) {

[michaelpg, 2016/08/18 19:40:59]

:not([hr]) probably isn't necessary

[Alexander Alekseev, 2016/08/19 06:00:06]

Done.

[Alexander Alekseev, 2016/08/19 06:00:06]

Done.

+  min-height: 32px;
+}
+
+paper-item[hr] {
+  min-height: 10px;
+}
+
+.option-name {
+  color: rgba(0, 0, 0, 0.87);
+  font-family: Roboto, sans-serif;
+  font-size: 13px;
+  font-variant: normal;
+}
+
+.hr {
+  border-top-color: rgba(0, 0, 0, 0.14);

[michaelpg, 2016/08/18 19:40:59]

use "border" shorthand

[Alexander Alekseev, 2016/08/19 06:00:06]

Done.

+  border-top-style: solid;
+  border-top-width: 1px;
+  width: 100%;
+}