History: Reduce visual importance of the domain in entries.

chrome/browser/resources/history.html

Index: chrome/browser/resources/history.html
diff --git a/chrome/browser/resources/history.html b/chrome/browser/resources/history.html
index b156868b15249b67e7a613a25bbf44ac1033fd56..e3ceaadc41b1faf8fdf946b13696dfc4867db509 100644
--- a/chrome/browser/resources/history.html
+++ b/chrome/browser/resources/history.html
@@ -24,222 +24,7 @@
 <script src="chrome://history/strings.js"></script>
 
 <link rel="stylesheet" href="old_webui.css">
-
-<style>
-#results-separator {
-  border-top: 1px solid #9cc2ef;
-  background-color: #ebeff9;
-  font-weight: bold;
-  padding: 3px;
-  margin-bottom: -8px;
-  margin-top: 12px;
-}
-
-#results-separator table {
-  width: 100%;
-}
-
-#results-summary {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  width: 50%;
-}
-
-#editing-controls button {
-  margin: 18px 0 -8px 0;
-}
-
-#results-display {
-  margin: 16px 0 0 0;
-  max-width: 740px;
-}
-
-.day {
-  color: #6a6a6a;
-  font-size: 13px;
-  font-weight: bold;
-  margin: 0 0 4px 0;
-  text-transform: uppercase;
-}
-
-.edit-button {
-  -webkit-appearance: none;
-  background: none;
-  border: 0;
-  color: blue; /* -webkit-link makes it purple :'( */
-  cursor: pointer;
-  display: inline-block;
-  font: inherit;
-  text-decoration: underline;
-  padding: 0px 9px;
-}
-
-.gap,
-.entry,
-.no-entries {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-.gap {
-  -webkit-border-end: 1px solid #ddd;
-  height: 14px;
-  width: 35px;
-}
-
-.entry {
-  overflow: auto; /* Make sure it's at least as large as its children. */
-}
-
-.entry-box {
-  -webkit-box-orient: horizontal;
-  cursor: default;
-  display: -webkit-box;
-  float: left;
-  line-height: 1.6em;
-/* Don't allow it to be bigger than its parent but make the box shrink to fit
- * its content. */
-  max-width: 100%;
-  overflow: hidden;
-}
-
-html[dir=rtl] .entry-box {
-  float: right; /* To make the box shrink to fit its content. */
-}
-
-.entry-box > label > * {
-  display: inline-block;
-  white-space: nowrap;
-}
-
-.search-results, .day-results {
-  margin: 0 0 24px 0;
-  padding: 0;
-}
-
-.snippet {
-  -webkit-margin-start: 90px; /* Align it with .domain. */
-  clear: both;
-  font-size: 12px;
-  line-height: 1.6em;
-  margin-bottom: 12px;
-}
-
-.entry .domain {
-  -webkit-padding-end: 8px;
-  -webkit-padding-start: 20px;
-  background-position-y: center;
-  background-repeat: no-repeat;
-  color: #282;
-}
-
-.drop-down {
-  -webkit-margin-end: 4px;
-  -webkit-margin-start: 8px;
-  background: #fff -webkit-canvas(drop-down-arrow) no-repeat center center;
-  border: 1px solid hsl(214, 91%, 85%);
-  border-radius: 2px;
-  height: 13px;
-  position: relative;
-  top: 2px;
-  width: 13px;
-}
-
-.drop-down:hover {
-  background-image: -webkit-canvas(drop-down-arrow-hover);
-  border-color: #6A86DE;
-}
-
-.drop-down[menu-shown], .drop-down:focus {
-  background-color: #6A86DE;
-  background-image: -webkit-canvas(drop-down-arrow-active);
-  border-color: #6A86DE;
-}
-
-html[dir='rtl'] .entry .domain {
-  background-position-x: right;
-}
-
-.entry .time {
-  color:#9a9a9a;
-  width: 90px;
-}
-
-.entry input[type=checkbox] {
-  -webkit-margin-end: 6px;
-  -webkit-margin-start: 4px;
-  height: 13px;
-  line-height: 12px;
-  text-indent: -1px;
-  top: 2px;
-  width: 14px;
-}
-
-/* Checkboxes are shown when checked or focused, or when the entry is hovered.
-   Fade in on focus, but not on hover, because it makes the UI feel laggy. */
-.entry input[type=checkbox]:not(:checked) {
-  -webkit-transition: opacity 150ms;
-  opacity: 0;
-}
-
-.entry-box:hover input[type=checkbox],
-.entry-box input[type=checkbox]:focus {
-  opacity: 1;
-}
-
-.entry-box input[type=checkbox]:focus {
-  -webkit-transition: opacity 150ms;
-}
-
-.entry-box {
-  -webkit-transition: background-color 150ms;
-  background-color: none;
-}
-
-.entry-box:hover, .entry-box.contains-focus {
-  background-color: #e4ecf7;
-  border-radius: 2px;
-}
-.entry .title {
-  -webkit-box-flex: 1;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.entry .title > .starred {
-  -webkit-margin-start: 4px;
-  background: url('shared/images/star_small.png');
-  background-repeat: no-repeat;
-  display: inline-block;
-  height: 11px;
-  width: 11px;
-}
-
-.entry .title > a {
-  color: #11c;
-  text-decoration: none;
-}
-
-.entry .title > a.to-be-removed {
-  text-decoration: line-through;
-}
-
-.entry .title > a:hover {
-  text-decoration: underline;
-}
-
-/* Since all history links are visited, we can make them blue. */
-.entry .title > a:visted {
-  color: #11c;
-}
-
-.fade-out {
-  -webkit-transition: opacity 200ms;
-  opacity: 0;
-}
-</style>
+<link rel="stylesheet" href="history.css">
 </head>
 <body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize">
 <div class="header">