MD Settings: Fix internet focus and styling

ui/webui/resources/cr_elements/shared_style_css.html

Index: ui/webui/resources/cr_elements/shared_style_css.html
diff --git a/ui/webui/resources/cr_elements/shared_style_css.html b/ui/webui/resources/cr_elements/shared_style_css.html
index bdbfcdcb8386bed851a09ec482fc43346d501d35..dec1c8228730ca44860a256261b6a93845479de0 100644
--- a/ui/webui/resources/cr_elements/shared_style_css.html
+++ b/ui/webui/resources/cr_elements/shared_style_css.html
@@ -41,6 +41,14 @@
         @apply(--cr-actionable);
       }
 
+      [actionable] button[is='paper-icon-button-light'].subpage-arrow {
+        background-image: url(../images/arrow_right.svg);
+      }
+
+      [actionable] button[is='paper-icon-button-light'].icon-external {
+        background-image: url(../images/open_in_new.svg);
+      }

[Dan Beam, 2016/12/09 00:11:38]

sorry, but you're propagating this.

this implementation isn't great.

it leaves around buttons that have ripples but no backgrounds.

it's annoying in cases where ONLY the button should be actionable, but you have
to wrap with an extra node or add actionable on an ancestor.

additionally, not all things use the [actionable] attribute, but instead might
@apply(--cr-actionable); or @apply(--settings-actionable); directly.

can we drop the [actionable] part of the selector and figure out a better way to
do this?

[stevenjb, 2016/12/09 00:57:52]

The [actionable] seems unnecessary/unwanted. Dave, is there a reason it was
included in the first place?

[dschuyler, 2016/12/09 01:15:52]

The reason it was initially done is that the issues mentioned above where not
known to me/us and it seemed to be correct. Other than the @apply() vs
[actionable] was known as something that could need and extra attribute, but
wasn't an issue as used.

The bug at 655292 may also be considered - it asks that those buttons not have
ripples at all.

[stevenjb, 2016/12/09 01:29:30]

I think we should address 655292 separately, and eliminate the [actionable] part
of these selectors, since I can't imagine we would ever not want e.g.
button[is='paper-icon-button-light'].subpage-arrow not to have the specified
background. Sound good?

+
       [scrollable] {
         border-color: transparent;
         border-style: solid;