MD History: Display synced tabs history

chrome/browser/resources/md_history/history_card.html

Index: chrome/browser/resources/md_history/history_card.html
diff --git a/chrome/browser/resources/md_history/history_card.html b/chrome/browser/resources/md_history/history_card.html
index 3fd46e4d958a0749f6fce2475da7bec64f7cbd59..c09492f4fcbe251ebecc4df72ee9de4223b613fd 100644
--- a/chrome/browser/resources/md_history/history_card.html
+++ b/chrome/browser/resources/md_history/history_card.html
@@ -3,50 +3,24 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/shadow.html">
 <link rel="import" href="chrome://history/history_item.html">
 
+<link rel="import" href="chrome://history/shared_style.html">
 <dom-module id="history-card">
   <template>
+    <style include="shared-style"></style>
     <style>
-      :host {
-        @apply(--layout-center);
-        @apply(--layout-vertical);
-        padding: 0 24px 20px;
-      }
-
-      #main-container {
-        @apply(--shadow-elevation-2dp);
-        background: #fff;
-        border-radius: 2px;
-        max-width: 960px;
-        min-width: 500px;
-        width: 100%;
-      }
-
       #time-gap-separator {
         -webkit-border-start: 1px solid #888;
         -webkit-margin-start: 77px;
         height: 15px;
       }
 
-      #date-accessed {
-        @apply(--layout-center);
-        @apply(--layout-horizontal);
-        -webkit-padding-start: 20px;
-        background: #fafafa;
-        border-bottom: 1px solid rgba(0, 0, 0, 0.14);
-        border-radius: 2px 2px 0 0;
-        color: #333;
-        font-size: 14px;
-        font-weight: 500;
-        height: 48px;
-      }
-
       #history-item-list {
         padding: 8px 0;
       }
     </style>
 
     <div id="main-container">
-      <div id="date-accessed">[[historyDate]]</div>
+      <div id="card-title">[[historyDate]]</div>
       <div id="history-item-list">
         <template is="dom-repeat" items="{{historyItems}}"
             as="historyItem">