CSS Panel - Inline style editing

2 files changed, 11 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 d2c81b93..7b5a736f 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
@@ -104,6 +104,7 @@ exports.CssStyleRule = Montage.create(Component, {
         value: function() {
             if(this.rule.type === 'inline') {
                 this.selectorField.readOnly = true;
+                this.declarationComponent.type = 'inline';
             } else {
                 this.selectorField.addEventListener('change', this, false);
             }
diff --git a/js/panels/css-panel/style.reel/style.js b/js/panels/css-panel/style.reel/style.js
index b079bc73..c73da6e5 100644
--- a/js/panels/css-panel/style.reel/style.js
+++ b/js/panels/css-panel/style.reel/style.js
@@ -145,7 +145,16 @@ exports.Style = Montage.create(TreeNode, {
 
     getRule : {
         value: function() {
-            return this.treeView.parentComponent.declaration.parentRule;
+            var declarationComponent = this.treeView.parentComponent,
+                rule;
+
+            if(declarationComponent.type === 'inline') {
+                rule = { style : declarationComponent.declaration }
+            } else {
+                rule = this.treeView.parentComponent.declaration.parentRule;
+            }
+
+            return rule;
         }
     },