Move bookmarks star to its own column between the timestamp and the f…

…avicon. Star image not updated. Right aligned times - not sure about that look.

BUG=173041

Review URL: https://chromiumcodereview.appspot.com/15907018

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@205027 0039d316-1c4b-4281-b951-d872f2087c98

chrome/browser/resources/history/history.css

@@ -234,23 +234,28 @@ html[dir='rtl'] .site-domain {
 
 .entry .time {
   color: rgb(151, 156, 160);
-  min-width: 90px;
+  min-width: 55px;
   overflow: hidden;
+  text-align: right;
   text-overflow: ellipsis;
   white-space: nowrap;
-  width: 90px;
+}
+
+html[dir='rtl'] .entry .time {
+  text-align: left;
 }
 
 .search-results .time,
 .month-results .time {
-  min-width: 110px;
-  width: 110px;
+  min-width: 85px;
 }
 
 .entry input[type='checkbox'] {
   -webkit-margin-end: 6px;
   -webkit-margin-start: 4px;
   line-height: 1em;
+  margin-top: 2px;
+  min-width: 13px;
 }
 
 <if expr="not is_android">
@@ -413,13 +418,17 @@ html[dir='rtl'] .site-domain-arrow.expand {
   -webkit-transform: rotate(180deg);
 }
 
+.entry .bookmark-section {
+  -webkit-margin-end: 3px;
+  -webkit-margin-start: 8px;
+  display: inline-block;
+  height: 11px;
+  min-width: 15px;
+}
+
 .entry .starred {
-  -webkit-margin-start: 4px;
   background:
       url(../../../../ui/webui/resources/images/star_small.png) no-repeat;
-  display: inline-block;
-  height: 11px;
-  width: 11px;
 }
 
 .entry .title > a {

chrome/browser/resources/history/history.js

@@ -135,7 +135,7 @@ Visit.prototype.getResultDOM = function(propertyBag) {
     checkbox.id = 'checkbox-' + this.id_;
     checkbox.time = this.date.getTime();
     checkbox.addEventListener('click', checkboxClicked);
-    time.appendChild(checkbox);
+    entryBox.appendChild(checkbox);
 
     // Clicking anywhere in the entryBox will check/uncheck the checkbox.
     entryBox.setAttribute('for', checkbox.id);
@@ -155,6 +155,19 @@ Visit.prototype.getResultDOM = function(propertyBag) {
   domain.textContent = this.getDomainFromURL_(this.url_);
 
   entryBox.appendChild(time);
+
+  var bookmarkSection = createElementWithClassName('div', 'bookmark-section');
+  if (this.starred_) {
+    bookmarkSection.classList.add('starred');
+    bookmarkSection.addEventListener('click', function f(e) {
+      bookmarkSection.classList.remove('starred');
+      chrome.send('removeBookmark', [self.url_]);
+      bookmarkSection.removeEventListener('click', f);
+      e.preventDefault();
+    });
+  }
+  entryBox.appendChild(bookmarkSection);
+
   var titleAndDomainWrapper = entryBox.appendChild(
       createElementWithClassName('div', 'title-and-domain'));
   if (this.blockedVisit) {
@@ -310,12 +323,6 @@ Visit.prototype.getTitleDOM_ = function() {
   this.addHighlightedText_(link, this.title_, this.model_.getSearchText());
   node.appendChild(link);
 
-  if (this.starred_) {
-    var star = createElementWithClassName('div', 'starred');
-    node.appendChild(star);
-    star.addEventListener('click', this.starClicked_.bind(this));
-  }
-
   return node;
 };
 
@@ -351,18 +358,6 @@ Visit.prototype.showMoreFromSite_ = function() {
   historyView.setSearch(this.getDomainFromURL_(this.url_));
 };
 
-/**
- * Click event handler for the star icon that appears beside bookmarked URLs.
- * When clicked, the bookmark is removed for that URL.
- * @param {Event} event The click event.
- * @private
- */
-Visit.prototype.starClicked_ = function(event) {
-  chrome.send('removeBookmark', [this.url_]);
-  event.currentTarget.hidden = true;
-  event.preventDefault();
-};
-
 // Visit, private, static: ----------------------------------------------------
 
 /**