From 2a66122b2acc1c2a26dcb9653d20c54d00402781 Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Wed, 24 Jan 2018 02:41:58 +0100 Subject: [PATCH] Create parseStyle method in ParserCss --- src/css_composer/model/CssRule.js | 7 ++++++- src/parser/model/ParserCss.js | 33 ++++++++++++++++++++----------- 2 files changed, 28 insertions(+), 12 deletions(-) diff --git a/src/css_composer/model/CssRule.js b/src/css_composer/model/CssRule.js index 096a542dd..23ae3490b 100644 --- a/src/css_composer/model/CssRule.js +++ b/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) { diff --git a/src/parser/model/ParserCss.js b/src/parser/model/ParserCss.js index d88f49975..e2f544af6 100644 --- a/src/parser/model/ParserCss.js +++ b/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