Move more CSS into renderers. (#3455)

* Move more CSS into renderers.

core/css.js

@@ -321,15 +321,6 @@ Blockly.Css.CONTENT = [
     'stroke: none',
   '}',
 
-  '.injectionDiv:not(.zelos-renderer) .blocklyReplaceable .blocklyPath {',
-    'fill-opacity: .5;',
-  '}',
-
-  '.injectionDiv:not(.zelos-renderer) .blocklyReplaceable .blocklyPathLight,',
-  '.injectionDiv:not(.zelos-renderer) .blocklyReplaceable .blocklyPathDark {',
-    'display: none;',
-  '}',
-
   '.blocklyMultilineText {',
     'font-family: monospace;',
   '}',

core/renderers/common/renderer.js

@@ -158,6 +158,7 @@ Blockly.blockRendering.Renderer.prototype.getCSS_ = function() {
   var constants = this.getConstants();
   return [
     /* eslint-disable indent */
+    // Fields.
     selector + ' .blocklyText {',
       'cursor: default;',
       'fill: #fff;',
@@ -169,25 +170,43 @@ Blockly.blockRendering.Renderer.prototype.getCSS_ = function() {
     selector + ' .blocklyEditableText>rect {',
       'fill: #fff;',
       'fill-opacity: .6;',
+      'stroke: none;',
     '}',
-
     selector + ' .blocklyNonEditableText>text,',
     selector + ' .blocklyEditableText>text {',
       'fill: #000;',
     '}',
 
+    // Editable field hover.
     selector + ' .blocklyEditableText:not(.editing):hover>rect {',
       'stroke: #fff;',
       'stroke-width: 2;',
     '}',
+
+    // Text field input.
+    selector + ' .blocklyHtmlInput {',
+      'font-family: ' + constants.FIELD_TEXT_FONTFAMILY + ';',
+      'font-weight: ' + constants.FIELD_TEXT_FONTWEIGHT + ';',
+    '}',
+
+    // Selection highlight.
     selector + ' .blocklySelected>.blocklyPath {',
       'stroke: #fc3;',
       'stroke-width: 3px;',
     '}',
 
-    selector + ' .blocklyHtmlInput {',
-      'font-family: ' + constants.FIELD_TEXT_FONTFAMILY + ';',
-      'font-weight: ' + constants.FIELD_TEXT_FONTWEIGHT + ';',
+    // Connection highlight.
+    selector + ' .blocklyHighlightedConnectionPath {',
+      'stroke: #fc3;',
+    '}',
+
+    // Replacable highlight.
+    selector + ' .blocklyReplaceable .blocklyPath {',
+      'fill-opacity: .5;',
+    '}',
+    selector + ' .blocklyReplaceable .blocklyPathLight,',
+    selector + ' .blocklyReplaceable .blocklyPathDark {',
+      'display: none;',
     '}',
     /* eslint-enable indent */
   ];

core/renderers/minimalist/renderer.js

@@ -32,12 +32,13 @@ goog.require('Blockly.minimalist.RenderInfo');
 
 /**
  * The minimalist renderer.
+ * @param {string} name The renderer name.
  * @package
  * @constructor
  * @extends {Blockly.blockRendering.Renderer}
  */
-Blockly.minimalist.Renderer = function() {
-  Blockly.minimalist.Renderer.superClass_.constructor.call(this);
+Blockly.minimalist.Renderer = function(name) {
+  Blockly.minimalist.Renderer.superClass_.constructor.call(this, name);
 };
 Blockly.utils.object.inherits(Blockly.minimalist.Renderer,
     Blockly.blockRendering.Renderer);

core/renderers/zelos/constants.js

@@ -516,7 +516,7 @@ Blockly.zelos.ConstantProvider.prototype.createDom = function(svg) {
   // Color the highlight
   Blockly.utils.dom.createSvgElement('feFlood',
       {
-        'flood-color': '#FFF200', // TODO: configure colour in theme.
+        'flood-color': '#fff200', // TODO: configure colour in theme.
         'flood-opacity': 1,
         'result': 'outColor'
       },
@@ -558,7 +558,7 @@ Blockly.zelos.ConstantProvider.prototype.createDom = function(svg) {
   // Color the highlight
   Blockly.utils.dom.createSvgElement('feFlood',
       {
-        'flood-color': '#FFF200', // TODO: configure colour in theme.
+        'flood-color': '#fff200', // TODO: configure colour in theme.
         'flood-opacity': 1,
         'result': 'outColor'
       },

core/renderers/zelos/renderer.js

@@ -131,6 +131,7 @@ Blockly.zelos.Renderer.prototype.getCSS_ = function() {
   var constants = this.getConstants();
   return [
     /* eslint-disable indent */
+    // Fields.
     selector + ' .blocklyText {',
       'cursor: default;',
       'fill: #fff;',
@@ -139,13 +140,27 @@ Blockly.zelos.Renderer.prototype.getCSS_ = function() {
       'font-weight: ' + constants.FIELD_TEXT_FONTWEIGHT + ';',
     '}',
 
+    // Editable field hover.
+    selector + ' .blocklyEditableText:not(.editing):hover>rect ,',
+    selector + ' .blocklyEditableText:not(.editing):hover>.blocklyPath {',
+      'stroke: #fff;',
+      'stroke-width: 2;',
+    '}',
+
+    // Text field input.
+    selector + ' .blocklyHtmlInput {',
+      'font-family: ' + constants.FIELD_TEXT_FONTFAMILY + ';',
+      'font-weight: ' + constants.FIELD_TEXT_FONTWEIGHT + ';',
+    '}',
+  
+    // Dropdown field.
     selector + ' .blocklyDropdownText {',
       'fill: #fff !important;',
     '}',
 
-    selector + ' .blocklyHtmlInput {',
-      'font-family: ' + constants.FIELD_TEXT_FONTFAMILY + ';',
-      'font-weight: ' + constants.FIELD_TEXT_FONTWEIGHT + ';',
+    // Connection highlight.
+    selector + ' .blocklyHighlightedConnectionPath {',
+      'stroke: #fff200;',
     '}',
     /* eslint-enable indent */
   ];