Restyle history view

Change-Id: history-style

Author: christian-schilling

josh-ui/src/App.scss

@@ -147,6 +147,20 @@ nav {
   }
 }
 
+.history-list-entry .summary {
+  @include ui-link-clickable;
+  &:hover {
+    background: $color-background-highlight;
+  }
+}
+
+.history-list-entry .hash {
+  @include ui-link-clickable;
+  &:hover {
+    background: $color-background-highlight;
+  }
+}
+
 .commit-list-entry-browse {
   @include ui-link-clickable;
   &:hover {
@@ -157,19 +171,24 @@ nav {
 
 .commit-list-entry {
   padding: .4em .4em;
+  display: block;
+
+  &:hover {
+    background: $color-background-highlight;
+  }
 
   span.hash {
     margin: 0 0.7em 0 0;
     color: $color-highlight;
     font-weight: bolder;
   }
   span.authorEmail {
+    float: right;
     margin: 0 0.7em 0 0;
-    color: $color-highlight;
+    color: $color-font-shadowed;
     font-weight: bolder;
   }
   span.summary {
-    display: block;
     margin: 0 0.7em 0 0;
     font-weight: bolder;
   }

josh-ui/src/History.tsx

@@ -91,17 +91,19 @@ export class HistoryList extends React.Component<HistoryBrowserProps, State> {
 
         return values.map((entry) => {
             return <div key={entry.hash} className="commit-list-entry">
-            <div
-                className="commit-list-entry-dir"
-                onClick={navigateChange.bind(this, entry.original.hash)}>
-                <span className="summary">{entry.summary}</span>
+            <div className="history-list-entry" >
+                <span
+                    className="hash"
+                    onClick={navigateBrowse.bind(this, entry.original.hash)}>
+                    {entry.hash.slice(0,8)}
+                </span>
+                <span
+                    className="summary"
+                    onClick={navigateChange.bind(this, entry.original.hash)}>
+                    {entry.summary}
+                </span>
                 <span className="authorEmail">{entry.authorEmail}</span>
             </div>
-            <div
-                className="commit-list-entry-browse"
-                onClick={navigateBrowse.bind(this, entry.original.hash)}>
-                Browse
-            </div>
             </div>
 
         })