MD History: Add responsive layout which hides the sidebar in thin windows

chrome/browser/resources/md_history/app.html

Index: chrome/browser/resources/md_history/app.html
diff --git a/chrome/browser/resources/md_history/app.html b/chrome/browser/resources/md_history/app.html
index a8f8a6fde0ce5ee5905296e8ae80d34d17e1e42f..3e56547e9d9490f06ca4f87aae79d0c07af8f5f6 100644
--- a/chrome/browser/resources/md_history/app.html
+++ b/chrome/browser/resources/md_history/app.html
@@ -1,4 +1,5 @@
 <link rel="import" href="chrome://resources/html/polymer.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/app-layout/app-drawer/app-drawer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/iron-flex-layout.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-pages/iron-pages.html">
 <link rel="import" href="chrome://history/grouped_list.html">
@@ -21,7 +22,6 @@
       :host {
         display: flex;
         flex-direction: column;
-        min-width: 800px;
       }
 
       #main-container {
@@ -54,8 +54,6 @@
     </history-toolbar>
 
     <div id="main-container">
-      <history-side-bar id="history-side-bar" selected-page="{{selectedPage_}}">
-      </history-side-bar>
       <iron-pages id="content" attr-for-selected="id"
           selected="[[getSelectedPage(selectedPage_, queryState_.range)]]">
         <history-list id="history-list" querying="[[queryState_.querying]]"
@@ -76,6 +74,10 @@
         </template>
       </iron-pages>
     </div>
+
+    <history-side-bar id="side-bar" tabindex="0"
+        selected-page="{{selectedPage_}}">
+    </history-side-bar>
   </template>
   <script src="chrome://history/app.js"></script>
 </dom-module>