Move blockly toolbox CSS into semantic.css to be shared by the monaco editor

Author: Sam El-Husseini

theme/blockly-toolbox.less

@@ -0,0 +1,33 @@
+@import 'themes/default/globals/site.variables';
+@import 'themes/pxt/globals/site.variables';
+@import 'site/globals/site.variables';
+
+/*******************************
+    Cutom Blockly toolbox CSS
+    shared by the monaco toolbox
+*******************************/
+
+div.blocklyTreeRow {
+    box-shadow: inset 0 -1px 0 0 #ecf0f1;
+    margin-bottom: 0px !important;
+    transition-property: background-color;
+    transition-duration: 1s;
+}
+
+.blocklyToolboxDiv, .monacoToolboxDiv, .blocklyAddPackageDiv {
+    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.12), 0px 2px 2px 0px rgba(0,0,0,0.24);    
+}
+
+/* Mobile */
+@media only screen and (max-width: @largestMobileScreen) {
+    .blocklyToolboxDiv, .monacoToolboxDiv, .blocklyAddPackageDiv {
+        border-left: 0 !important;
+    }
+}
+
+/* Tablet */
+@media only screen and (min-width: @tabletBreakpoint) and (max-width: @largestTabletScreen) {
+    .blocklyToolboxDiv, .monacoToolboxDiv, .blocklyAddPackageDiv {
+        border-left: 0 !important;
+    }
+}

theme/blockly.less

@@ -4,27 +4,6 @@
 
 @import 'blockly-core';
 
-div.blocklyTreeRow {
-    box-shadow: inset 0 -1px 0 0 #ecf0f1;
-    margin-bottom: 0px !important;
-    transition-property: background-color;
-    transition-duration: 1s;
-}
-
-.blocklyToolboxDiv, .monacoToolboxDiv, .blocklyAddPackageDiv {
-    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.12), 0px 2px 2px 0px rgba(0,0,0,0.24);    
-}
-
-/* Mobile */
-@media only screen and (max-width: @largestMobileScreen) {
-    .blocklyToolboxDiv, .monacoToolboxDiv, .blocklyAddPackageDiv {
-        border-left: 0 !important;
-    }
-}
-
-/* Tablet */
-@media only screen and (min-width: @tabletBreakpoint) and (max-width: @largestTabletScreen) {
-    .blocklyToolboxDiv, .monacoToolboxDiv, .blocklyAddPackageDiv {
-        border-left: 0 !important;
-    }
-}
+/*******************************
+    Cutom Blockly CSS
+*******************************/

theme/style.less

@@ -1,6 +1,7 @@
 /* Import all components */
-@import 'semantic';
+@import 'pxtsemantic';
 @import 'pxt';
+@import 'blockly-toolbox';
 @import 'themes/default/globals/site.variables';
 @import 'themes/pxt/globals/site.variables';
 @import 'site/globals/site.variables';
@@ -9,7 +10,7 @@
 @import (reference) "semantic.less";
 
 /*******************************
-    Add your custom CSS here
+    Custom editor CSS
 *******************************/
 
 .ui.item.logo .name {