CSS Panel - Allow ":" to be used in selector field

2 files changed, 24 insertions, 1 deletions

diff --git a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js
index ac714bfa..71fe8470 100644
--- a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js
+++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js
@@ -115,6 +115,8 @@ exports.CssStyleRule = Montage.create(Component, {
     },
     prepareForDraw : {
         value: function() {
+            this.selectorField.keyActions = this.keyActions;
+
             if(this.rule.type === 'inline') {
                 this.selectorField.readOnly = true;
                 this.declarationComponent.type = 'inline';
@@ -144,5 +146,26 @@ exports.CssStyleRule = Montage.create(Component, {
                 this.element.classList.add(this.unappliedClass);
             }
         }
+    },
+
+    keyActions : {
+        value : {
+            hint : {
+                accept : [9,13], // accept hint
+                stop   : [27],   // stop editing
+                next   : [40],   // cycle to next hint
+                prev   : [38],   // cycle to prev hint
+                revert : [27],   // revert value
+                backsp : [8]     // backspace hit
+            },
+            noHint : {
+                stop   : [27,9,13],
+                next   : [40],
+                prev   : [38],
+                revert : [27],
+                backsp : [8]
+            }
+        },
+        distinct: true
     }
 });
diff --git a/js/panels/css-panel/rule-list.reel/rule-list.js b/js/panels/css-panel/rule-list.reel/rule-list.js
index b7244a2c..2cd5ac5c 100644
--- a/js/panels/css-panel/rule-list.reel/rule-list.js
+++ b/js/panels/css-panel/rule-list.reel/rule-list.js
@@ -61,7 +61,7 @@ exports.RuleList = Montage.create(Component, {
                     // found rule in our component list, or it's the inline rule
                     ruleComponent.update();
                     foundIndices.push(index);
-                } else {
+                } else if(!rule.applied) { /// remove rule (unless unapplied)
                     this.rulesToRemove.push(ruleComponent);
                 }
             }, this);