Add a disabled property to DOMUI lists

chrome/browser/resources/options/options_page.css

 body {
   -webkit-user-select: none;
   cursor: default;
   font-size: 100%;
 }
 
 #settings-title {
   -webkit-padding-end: 24px;
   color: #53637d;
   font-size: 200%;
@@ skipping 330 matching lines @@
 
 list > * {
   -webkit-box-align: center;
   -webkit-box-sizing: border-box;
   border-radius: 0px;
   display: -webkit-box;
   height: 32px;
   border: none;
 }
 
-list > :hover {
+list:not([disabled]) > :hover {
   background-color: #f2f2f2;
 }
 
 list > [selected],
 list:focus > [selected],
 list:focus > [lead][selected],
 list > [selected]:hover {
   background-color: #f2f2f2;
-  border-top: 1px solid #b2b2b2;
-  border-bottom: 1px solid #b2b2b2;
   background-image: none;
 }
 
+list > [lead][selected],
+list:focus > [lead][selected] {
+  border-top: 1px solid #b2b2b2;
+  border-bottom: 1px solid #b2b2b2;
+  z-index: 3;
+}
+
+list[disabled] > [lead][selected],
+list[disabled]:focus > [lead][selected] {
+  border: none;
+}
+
+list[disabled] {
+  opacity: 0.6;
+}
+
 list > .heading {
   color: #666666;
 }
 
 list > .heading:hover {
   background-color: transparent;
   border-color: transparent;
 }
 
 .left-side-table {
@@ skipping 81 matching lines @@
 label.radio > span,
 .suboption {
   -webkit-margin-start: 16px;
   display: block;
 }
 
 html[os=mac] label.checkbox > input,
 html[os=mac] label.radio > input {
   margin-top: 2px;
 }