History: Add option to group visits by domain

chrome/browser/resources/history/history.css

Index: chrome/browser/resources/history/history.css
diff --git a/chrome/browser/resources/history/history.css b/chrome/browser/resources/history/history.css
index bf70cd03bbf8f7058333a806f4acfd46090a63c8..ced290e4e439e771576a3bdf281cecb2c2d405d0 100644
--- a/chrome/browser/resources/history/history.css
+++ b/chrome/browser/resources/history/history.css
@@ -24,13 +24,26 @@ body:not(.uber-frame) {
   top: 3px;
 }
 
+#editing-controls,
+#filter-controls,
+#results-display {
+  max-width: 718px;
+}
+
 #editing-controls button:first-of-type {
   -webkit-margin-start: 0;
 }
 
+#filter-controls div {
+  display: inline-block;
+}
+
+#display-filter-controls {
+  float: right;
+}
+
 #results-display {
   margin: 16px 0 0 0;
-  max-width: 740px;

[Patrick Dubroy, 2013/01/21 09:42:40]

I don't see the CSS that will ensure that everything will line up on the right
hand side. Can you please add that? I think you need to add "margin: 0" for the
.menu-button items and for the "Search history" button. That should do the
trick.

[Sergiu, 2013/01/21 10:38:29]

Done.

 }
 
 .edit-button {
@@ -45,9 +58,10 @@ body:not(.uber-frame) {
   text-decoration: underline;
 }
 
-.gap,
 .entry,
-.no-entries {
+.gap,
+.no-entries,
+.site-entry {
   list-style: none;
   margin: 0;
   padding: 0;
@@ -64,7 +78,8 @@ body:not(.uber-frame) {
   overflow: auto; /* Make sure it's at least as large as its children. */
 }
 
-.entry-box {
+.entry-box,
+.site-domain-wrapper {
   -webkit-box-orient: horizontal;
   cursor: default;
   display: -webkit-box;
@@ -78,6 +93,10 @@ body:not(.uber-frame) {
   padding-bottom: 1px;
 }
 
+.site-domain-wrapper {
+  cursor: pointer;
+}
+
 html[dir=rtl] .entry-box {
   float: right; /* To make the box shrink to fit its content. */
 }
@@ -92,6 +111,18 @@ html[dir=rtl] .entry-box {
   padding: 0;
 }
 
+.site-results {
+  -webkit-transition: height 350ms ease-in-out;
+  clear: left;
+  margin: 0;
+  overflow: hidden;
+  padding: 0;
+}
+
+h2.timeframe {
+  font-size: 1.5em;
+}
+
 .snippet {
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
@@ -111,6 +142,14 @@ html[dir=rtl] .entry-box {
   padding-right: 6px;
 }
 
+.site-results .domain {
+  display: none;
+}
+
+.number-visits {
+  color: rgb(151, 156, 160);
+}
+
 .drop-down {
   -webkit-margin-end: 5px;
   background: white -webkit-canvas(drop-down-arrow) no-repeat center 4px;
@@ -192,13 +231,32 @@ html[dir='rtl'] .entry .title {
   white-space: nowrap;
 }
 
-.entry .title {
+.day-results > .entry .title,
+.search-results > .entry .title,
+.site-domain {
   /* Make room for the favicon. */
   -webkit-padding-start: 20px;
 
   /* Control the favicon appearance. */
   background-position-y: 3px;
   background-repeat: no-repeat;
+  background-size: 16px;
+}
+
+.site-domain-arrow {
+  -webkit-transition: -webkit-transform 300ms linear;
+  /* Make room for the arrow and place it. */
+  background: url('../twisty_closed.png') no-repeat center center;
+  height: 21px;
+  width: 21px;
+}
+
+.site-domain-arrow.collapse {
+  -webkit-transform: rotate(0);
+}
+
+.site-domain-arrow.expand {
+  -webkit-transform: rotate(90deg);
 }
 
 .entry .starred {