DOMUI: Implement new-style password manager.

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 333 matching lines @@
   background-color: transparent;
   border-color: transparent;
 }
 
 #contentSettingsPage :invalid {
   background-color: pink;
 }
 
 list > * {
   -webkit-box-align: center;
+  -webkit-transition: .15s background-color;
   box-sizing: border-box;
   border-radius: 0px;
   display: -webkit-box;
   height: 32px;
   border: none;
   margin: 0;
 }
 
 list:not([disabled]) > :hover {
   background-color: #f2f2f2;
@@ skipping 19 matching lines @@
 list > .heading {
   color: #666666;
 }
 
 list > .heading:hover {
   background-color: transparent;
   border-color: transparent;
 }
 
 list .deletable-item {
+  -webkit-box-align: center;
+  -webkit-box-flex: 1;
   display: -webkit-box;
 }
 
-list .deletable-item > :first-child {
-  -webkit-box-flex: 1;
-}
-
 list .close-button {
+  -webkit-transition: .15s opacity;
   background-color: transparent;
   /* TODO(stuartmorgan): Replace with real images once they are available. */
   background-image: url("../../../app/theme/close_bar.png");
   border: none;
   height: 16px;
+  opacity: 1;
   width: 16px;
 }
 
 list > *:not(:hover) .close-button, list[disabled] .close-button {
-  display: none;
+  opacity: 0;
+  pointer-events: none;
 }
 
 list .close-button:hover {
   background-image: url("../../../app/theme/close_bar_h.png");
 }
 
 list .close-button:active {
   background-image: url("../../../app/theme/close_bar_p.png");
 }
 
@@ skipping 86 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;
 }