Refined new folder icon, style the hover state of the toolbar buttons for the file browser and the notebook, refined sizing of the notebook toolbar to accomodate new buttons

packages/apputils/style/toolbar.css

@@ -5,7 +5,7 @@
 |----------------------------------------------------------------------------*/
 
 :root {
-  --jp-private-toolbar-height: 24px;
+  --jp-private-toolbar-height: 32px;
 }
 
 
@@ -15,7 +15,7 @@
   display: flex;
   flex-direction: row;
   border-bottom: var(--jp-border-width) solid var(--jp-toolbar-border-color);
-  height: calc(var(--jp-private-toolbar-height) + var(--jp-border-width));
+  height: var(--jp-private-toolbar-height);
 }
 
 
@@ -31,11 +31,13 @@
 
 .jp-Toolbar-item.jp-Toolbar-button {
   display: inline-block;
+  height: 24px;
   width: 32px;
   background-color: white;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
+  border: 1px solid var(--jp-layout-color0);
 }
 
 
@@ -46,11 +48,19 @@
 
 
 .jp-Toolbar-button:hover {
-  background-color: var(--jp-layout-color2);
-  box-shadow: inset 0 0px 1px rgba(0, 0, 0, 0.5);
+  border: 1px solid #BDBDBD;
+  background-color: var(--jp-layout-color0);
+  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.24);
+
 }
 
 
+.jp-Toolbar-button:active {
+  border: 1px solid #BDBDBD;
+  background-color: #E0E0E0;
+  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.24);
+}
+
 .jp-Toolbar > .jp-Toolbar-item.jp-Toolbar-spacer {
   flex-grow: 1;
   flex-shrink: 1;
@@ -74,4 +84,3 @@
   background-position: center;
   background-size: 16px;
 }
-

packages/filebrowser/style/index.css

@@ -32,6 +32,7 @@
 .jp-FileBrowser-toolbar {
   border-bottom: none;
   height: auto;
+  margin: 4px 4px 0px 4px;
 }
 
 
@@ -67,9 +68,9 @@
   height: var(--jp-private-filebrowser-button-height);
   line-height: var(--jp-private-filebrowser-button-height);
   color: var(--jp-ui-font-color1);
-  border: none;
   font-size: var(--jp-ui-icon-font-size);
   outline: 0;
+  margin-bottom: 4px;
 }
 
 

packages/notebook/style/toolbar.css

@@ -14,6 +14,7 @@
 
 
 .jp-NotebookPanel-toolbar {
+  padding: 4px;
   box-shadow: var(--jp-toolbar-box-shadow);
   background: var(--jp-toolbar-background);
   z-index: 1;

packages/theming/style/icons/md/new-folder.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 10 9" style="enable-background:new 0 0 10 9;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;}
+	.st1{fill:none;stroke:#FFFFFF;stroke-miterlimit:10;}
+</style>
+<g transform="translate(-1.000000, -1.148148)">
+	<path id="Shape" d="M5,2H2C1.5,2,1,2.5,1,3v6c0,0.6,0.5,1,1,1h8c0.6,0,1-0.4,1-1V4c0-0.5-0.4-1-1-1H6L5,2L5,2z"/>
+	<polygon id="Shape_1_" class="st0" points="0,0 12,0 12,12 0,12 	"/>
+</g>
+<g>
+	<line class="st1" x1="5" y1="3.3" x2="5" y2="7.7"/>
+	<line class="st1" x1="7.2" y1="5.5" x2="2.8" y2="5.5"/>
+</g>
+</svg>