[Chrome Settings UI] Show overruled User Exceptions as strike-through.

chrome/browser/resources/options/content_settings.css

Index: chrome/browser/resources/options/content_settings.css
diff --git a/chrome/browser/resources/options/content_settings.css b/chrome/browser/resources/options/content_settings.css
index 36c6393af3d8c36c1f3e28a955bd31de595b17f3..b4268a4ec753c56cc9fbd2c16b5662c0dcfc1975 100644
--- a/chrome/browser/resources/options/content_settings.css
+++ b/chrome/browser/resources/options/content_settings.css
@@ -21,10 +21,24 @@
   width: 120px;
 }
 
+.settings-list div[role='listitem'][controlled-by='policy'] .exception-setting,
+.settings-list div[role='listitem'][controlled-by='extension']
+    .exception-setting {
+  width: 112px;
+}
+
 select.exception-setting {
   vertical-align: middle;
 }
 
+.overruled .exception-setting {
+  width: 96px;
+}
+
+.overruled span.exception-setting {

[Bernhard Bauer, 2016/05/18 09:55:13]

Why is the span selector necessary?

[huangs, 2016/05/18 13:52:49]

If we do don't do this, then "select.exception-setting" is included, and when we
edit an exception the selected item drop down list will have the strike-through
always.  If we do that then the <select> options and the text box should get it
also.  I think that seeing strike-through while editing would be considered
annoying -- but please propose this in the UI review if you'd prefer that.

[Bernhard Bauer, 2016/05/19 14:20:40]

Hm... can we use an additional class for this? Otherwise it might inadvertently
apply to another <span> element as well if we add one.

[huangs, 2016/05/20 15:16:46]

This is applied to ".overruled span.exception-setting", i.e., we'd have

<some-tag class="overruled">
  <span class="exception-settings">I have line-through</span>
  <span>I have normal style</span>
</some-tag>

So sibling <span> that doesn't have class="exception-settings" will be
unaffected.  Unless you  mean something else?

[Bernhard Bauer, 2016/05/23 13:34:11]

Mostly I'd be concerned that <span> is too narrow if we'd ever use a different
tag for the display label. But I guess we only have two types right now, and we
can cross that bridge when we come to it.

[huangs, 2016/05/24 05:02:00]

Acknowledged.

+  text-decoration: line-through;
+}
+
 #exception-column-headers {
   -webkit-margin-start: 17px;
   display: -webkit-box;
@@ -107,3 +121,4 @@ select.media-device-control:empty {
 #media-video-column {
   width: 8.5em;
 }
+y

[Bernhard Bauer, 2016/05/18 09:55:13]

Remove

[huangs, 2016/05/18 13:52:49]

Done.