Merge pull request #105 from cameron-toy/stylefix

fixed style import

Author: cameron-toy

.gitignore

@@ -113,3 +113,6 @@ dmypy.json
 .DS_Store
 .eslintcache
 .vscode
+
+# Local testing
+__test/

style/base.css

@@ -0,0 +1,131 @@
+.pr-JupyterDashboard {
+  overflow: auto;
+}
+
+.pr-DashboardWidget {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.pr-DashboardWidget .pr-MarkdownOutput {
+  display: inline-block;
+}
+
+.pr-EditableWidget {
+  border: var(--jp-border-width) solid var(--jp-inverse-layout-color4);
+  background: var(--jp-layout-color0);
+}
+
+.pr-EditableWidget > .pr-DashboardWidgetChild {
+  pointer-events: none;
+}
+
+.pr-EditableWidget:focus {
+  border: var(--jp-border-width) solid var(--jp-brand-color1);
+}
+
+.pr-EditableWidget:focus:after {
+  content: '';
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+  background: rgba(0,0,0,.10);
+}
+
+.pr-EditableWidget:hover {
+  border: var(--jp-border-width) solid var(--jp-brand-color1);
+  cursor: move;
+}
+
+.pr-EditableWidget:hover:after {
+  content: '';
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+  background: rgba(0,0,0,.10);
+}
+
+.pr-DashboardArea {
+  overflow: auto;
+}
+
+.pr-Resizer {
+  display: none;
+  width: 15px;
+  height: 15px;
+  right: 0;
+  bottom: 0;
+  z-index: 3;
+  cursor: nwse-resize;
+  position: absolute;
+}
+
+.pr-DashboardWidgetChild {
+  display: inline-block;
+}
+
+.pr-EditableWidget:hover .pr-Resizer {
+  display: block;
+}
+
+
+.pr-Canvas {
+  pointer-events: none;
+}
+
+.pr-Canvas.pr-FreeLayout {
+  background-image: linear-gradient(45deg, rgba(160,160,160,.15) 25%, transparent 25%), linear-gradient(-45deg, rgba(160,160,160,.15) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(160,160,160,.15) 75%), linear-gradient(-45deg, transparent 75%, rgba(160,160,160,.15) 70%);
+  background-size: 20px 20px;
+  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+}
+
+.pr-Canvas.pr-TiledLayout {
+  background-image: linear-gradient(45deg, rgba(160,160,160,.15) 25%, transparent 25%), linear-gradient(-45deg, rgba(160,160,160,.15) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(160,160,160,.15) 75%), linear-gradient(-45deg, transparent 75%, rgba(160,160,160,.15) 70%);
+  background-size: 64px 64px;
+  background-position: 0 0, 0 32px, 32px -32px, -32px 0px;
+}
+
+.pr-OnboardingGif {
+  position: absolute;
+  visibility: hidden;
+  object-fit: contain;
+  left: 0;
+  top: 0;
+}
+
+.pr-DashboardToolbar {
+  padding: 2px;
+}
+
+.jp-Toolbar-item.pr-ToolbarModeSwitcher .jp-select-wrapper.jp-mod-focused {
+  border: none;
+  box-shadow: none;
+}
+
+select.pr-ToolbarSelector.jp-mod-styled {
+  height: 24px;
+  font-size: var(--jp-ui-font-size1);
+  line-height: 14px;
+  border-radius: 0;
+  display: block;
+  box-shadow: none;
+  border: none;
+}
+
+.pr-ToolbarSelector.jp-mod-styled select {
+  height: 24px;
+  font-size: var(--jp-ui-font-size1);
+  line-height: 14px;
+  border-radius: 0;
+  display: block;
+  box-shadow: none;
+  border: none;
+}
+
+.pr-DragImage {
+  box-shadow: var(--jp-elevation-z1);
+  border: var(--jp-border-width) solid var(--jp-brand-color1);
+}