Create parseStyle method in ParserCss

src/css_composer/model/CssRule.js

@@ -26,6 +26,10 @@ module.exports = Backbone.Model.extend(Styleable).extend({
     // Type of at-rule, eg. 'media', 'font-face', etc.
     atRuleType: '',
 
+    // This particolar property is used only on at-rules, like 'page' or
+    // 'font-face', where the block containes only style declarations
+    noSelectors: 0,
+
     // If true, sets '!important' on all properties
     // You can use an array to specify properties to set important
     // Used in view
@@ -87,9 +91,10 @@ module.exports = Backbone.Model.extend(Styleable).extend({
     const atRule = this.getAtRule();
     const style = this.styleToString(opts);
     const selectors = this.selectorsToString();
+    const noSelectors = this.get('noSelectors');
 
     if (selectors && style) {
-      result = `${selectors}{${style}}`;
+      result = noSelectors ? style : `${selectors}{${style}}`;
     }
 
     if (atRule && result) {

src/parser/model/ParserCss.js

@@ -52,6 +52,25 @@ module.exports = config => ({
     };
   },
 
+  /**
+   * Parse style declarations of the node
+   * @param {CSSRule} node
+   * @return {Object}
+   */
+  parseStyle(node) {
+    const stl = node.style;
+    const style = {};
+
+    for (var i = 0, len = stl.length; i < len; i++) {
+      const propName = stl[i];
+      const propValue = stl.getPropertyValue(propName);
+      const important = stl.getPropertyPriority(propName);
+      style[propName] = `${propValue}${important ? ` !${important}` : ''}`;
+    }
+
+    return style;
+  },
+
   /**
    * Fetch data from node
    * @param  {StyleSheet|CSSRule} el
@@ -73,8 +92,8 @@ module.exports = config => ({
         const condition =
           node.conditionText ||
           (node.media && node.media.mediaText) ||
-          node.selectorText ||
           node.name ||
+          sels ||
           '';
 
         for (var s = 0, lens = subRules.length; s < lens; s++) {
@@ -92,16 +111,8 @@ module.exports = config => ({
       sels = selsParsed.result;
       selsAdd = selsParsed.add;
 
-      // Create style object from the big one
-      var stl = node.style;
-      var style = {};
-
-      for (var j = 0, len2 = stl.length; j < len2; j++) {
-        const propName = stl[j];
-        const propValue = stl.getPropertyValue(propName);
-        const important = stl.getPropertyPriority(propName);
-        style[propName] = `${propValue}${important ? ` !${important}` : ''}`;
-      }
+      // Create the style object from the big one
+      const style = this.parseStyle(node);
 
       var lastRule = '';
       // For each group of selectors