Update styles

packages/theming/style/datagrid.css

@@ -0,0 +1,27 @@
+/*-----------------------------------------------------------------------------
+| Copyright (c) Jupyter Development Team.
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+
+
+.p-DataGrid {
+  min-width: 64px;
+  min-height: 64px;
+  border: 1px solid #A0A0A0;
+}
+
+
+.p-DataGrid-scrollCorner {
+  background-color: #F0F0F0;
+}
+
+
+.p-DataGrid-scrollCorner::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 1px;
+  height: 1px;
+  background-color: #A0A0A0;
+}

packages/theming/style/icons/md/left_caret.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 18 18" transform="translate(1000, 700) rotate(180)">
+    <path d="M5.2,5.9L9,9.7l3.8-3.8l1.2,1.2l-4.9,5l-4.9-5L5.2,5.9z"/>
+    <path fill="none" d="M0-0.6h18v18H0V-0.6z"/>
+</svg>

packages/theming/style/index.css

@@ -18,10 +18,12 @@ body {
 
 
 /* Sibling imports */
+@import './datagrid.css';
 @import './dockpanel.css';
 @import './images.css';
 @import './icons.css';
 @import './menus.css';
+@import './scrollbars.css';
 @import './tabs.css';
 
 

packages/theming/style/scrollbar.css

@@ -0,0 +1,96 @@
+/*-----------------------------------------------------------------------------
+| Copyright (c) Jupyter Development Team.
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+
+
+.p-ScrollBar[data-orientation='horizontal'] {
+  min-height: 16px;
+  max-height: 16px;
+  min-width: 45px;
+  border-top: 1px solid #A0A0A0;
+}
+
+
+.p-ScrollBar[data-orientation='vertical'] {
+  min-width: 16px;
+  max-width: 16px;
+  min-height: 45px;
+  border-left: 1px solid #A0A0A0;
+}
+
+
+.p-ScrollBar-button {
+  background-color: #F0F0F0;
+  background-position: center center;
+  min-height: 15px;
+  max-height: 15px;
+  min-width: 15px;
+  max-width: 15px;
+}
+
+
+.p-ScrollBar-button:hover {
+  background-color: #DADADA;
+}
+
+
+.p-ScrollBar-button.p-mod-active {
+  background-color: #CDCDCD;
+}
+
+
+.p-ScrollBar-track {
+  background: #F0F0F0;
+}
+
+
+.p-ScrollBar-thumb {
+  background: #CDCDCD;
+}
+
+
+.p-ScrollBar-thumb:hover {
+  background: #BABABA;
+}
+
+
+.p-ScrollBar-thumb.p-mod-active {
+  background: #A0A0A0;
+}
+
+
+.p-ScrollBar[data-orientation='horizontal'] .p-ScrollBar-thumb {
+  height: 100%;
+  min-width: 15px;
+  border-left: 1px solid #A0A0A0;
+  border-right: 1px solid #A0A0A0;
+}
+
+
+.p-ScrollBar[data-orientation='vertical'] .p-ScrollBar-thumb {
+  width: 100%;
+  min-height: 15px;
+  border-top: 1px solid #A0A0A0;
+  border-bottom: 1px solid #A0A0A0;
+}
+
+
+.p-ScrollBar[data-orientation='horizontal'] .p-ScrollBar-button[data-action='decrement'] {
+  background-image: url(../images/caretleft.png);
+}
+
+
+.p-ScrollBar[data-orientation='horizontal'] .p-ScrollBar-button[data-action='increment'] {
+  background-image: url(../images/caretright.png);
+}
+
+
+.p-ScrollBar[data-orientation='vertical'] .p-ScrollBar-button[data-action='decrement'] {
+  background-image: url(../images/caretup.png);
+}
+
+
+.p-ScrollBar[data-orientation='vertical'] .p-ScrollBar-button[data-action='increment'] {
+  background-image: url(../images/caretdown.png);
+}