Various UI fixes. Block refactoring and adding touch and color blocks.

theme/blockly.less

@@ -34,13 +34,6 @@ span.blocklyTreeLabel {
     font-weight: bold;
 }
 
-.blocklyFlyoutBackground {
-    fill: #282828 !important;
-}
-.monacoFlyout {
-    background: rgba(40, 40, 40, 0.9);
-}
-
 /* Search box */
 #blocklySearchArea {
     margin: 0.5rem;

theme/site/globals/site.variables

@@ -22,7 +22,7 @@
 
 /* Lego colors */
 @red: @brightRed;
-@blue: #008ad2;
+@blue: #00a5c8; /*#008ad2;*/
 @yellow: #fccd00;
 @orange: #fa7f2a;
 @green: @brightYellowishGreen;
@@ -96,9 +96,11 @@
    Menu
 --------------------*/
 
+@mainMenuBackground: #f4f7f9;
 @mainMenuInvertedBackground: @yellow;
 @mainMenuTutorialBackground: @orange;
 
+
 @tutorialSelectedMenuColor: @blue;
 
 /*-------------------
@@ -117,6 +119,8 @@
 @editorToolsBackground: #fcfbfa;
 @blocklySvgColor: #ecf6ff;
 
+@homeScreenBackground: #f4f7f9;
+
 /*-------------------
    Full screen
 --------------------*/
@@ -152,3 +156,13 @@
 @blocklyRowHeightComputer: 50px;
 @blocklyRowHeightTablet: 50px;
 @blocklyRowHeightMobile: 50px;
+
+
+/*-------------------
+   Flyout
+--------------------*/
+
+@flyoutLabelColor: white;
+@blocklyFlyoutColor: #282828;
+@blocklyFlyoutColorOpacity: 0.9;
+@monacoFlyoutColor: rgba(40, 40, 40,0.9);

theme/style.less

@@ -44,7 +44,7 @@
 
 /* Menu bar colors */
 #menubar .ui.item {
-    color: @red;
+    color: #373737;
 }
 .fullscreensim #menubar .ui.menu {
     box-shadow: none !important;
@@ -59,11 +59,17 @@
 /* Editor menu toggle */
 #menubar .ui.menu.fixed .item.editor-menuitem .ui.grid {
     background: @blue !important;
+    border-radius: 0px !important;
 }
-
 #menubar .ui.menu.fixed .ui.item.editor-menuitem .item:not(.active) {
     color: white;
 }
+#menubar .ui.menu.fixed .ui.item.editor-menuitem .item {
+    border-radius: 0px !important;
+}
+#menubar .ui.menu.fixed .ui.item.editor-menuitem .item.active {
+    color: @blue;
+}
 
 .sandboxfooter a:not(.thin) {
     color:white !important;