DOMUI: Alter the focus and selected list item background colors.

chrome/browser/resources/options/options_page.css

 body {
   cursor: default;
   font-size: 100%;
 }
 
 #settings-title {
   -webkit-padding-end: 24px;
   color: #53637d;
   cursor: pointer;
   font-size: 200%;
@@ skipping 339 matching lines @@
   -webkit-transition: .15s background-color;
   box-sizing: border-box;
   border-radius: 0;
   display: -webkit-box;
   height: 32px;
   border: none;
   margin: 0;
 }
 
 list:not([disabled]) > :hover {
-  background-color: #f2f2f2;
+  background-color: rgb(228, 236, 247);
 }
 
 list > [selected],
 list:focus > [selected],
 list:focus > [lead][selected],
 list > [selected]:hover {
-  background-color: #f2f2f2;
+  background-color: rgb(187, 206, 233);
   background-image: none;
 }
 
 list:focus > [lead],
 list:focus > [lead][selected],
 list [lead][selected][editing] {
-  border-top: 1px solid #b2b2b2;
-  border-bottom: 1px solid #b2b2b2;
+  border-top: 1px solid #7892b4;
+  border-bottom: 1px solid #7892b4;

[stuartmorgan, 2011/01/19 19:48:51]

Why rgb() for the backgrounds and hex for the border? It makes it hard to see
how the colors relate, which is weird for colors that need to go together, so it
would be cleaner to change one or the other so they all match.

[James Hawkins, 2011/01/19 20:00:24]

Done.

 }
 
 list:focus > [lead]:nth-child(2),
 list:focus > [lead][selected]:nth-child(2),
 list [lead][selected][editing]:nth-child(2) {
-  border-top: 1px solid #f2f2f2;
+  border-top: 1px transparent;
 }
 
 list:focus > [lead]:nth-last-child(2),
 list:focus > [lead][selected]:nth-last-child(2),
 list [lead][selected][editing]:nth-last-child(2) {
-  border-bottom: 1px solid #f2f2f2;
+  border-bottom: 1px transparent;
 }
 
 list[disabled] > [lead][selected],
 list[disabled]:focus > [lead][selected] {
   border: none;
 }
 
 list[disabled] {
   opacity: 0.6;
 }
@@ skipping 132 matching lines @@
 }
 
 .suboption {
   -webkit-margin-start: 16px;
 }
 
 html[os=mac] label > input[type=checkbox],
 html[os=mac] label > input[type=radio] {
   margin-top: 2px;
 }