Browse Source

Update CssRule docs

pull/3691/head
Artur Arseniev 5 years ago
parent
commit
cec5ab0fd6
  1. 44
      src/css_composer/model/CssRule.js

44
src/css_composer/model/CssRule.js

@ -88,8 +88,14 @@ export default class CssRule extends Model.extend(Styleable) {
} }
/** /**
* Returns an at-rule statement if possible, eg. '@media (...)', '@keyframes' * Return the at-rule statement when exists, eg. '@media (...)', '@keyframes'
* @return {string} * @returns {String}
* @example
* const cssRule = editor.Css.setRule('.class1', { color: 'red' }, {
* atRuleType: 'media',
* atRuleParams: '(min-width: 500px)'
* });
* cssRule.getAtRule(); // "@media (min-width: 500px)"
*/ */
getAtRule() { getAtRule() {
const type = this.get('atRuleType'); const type = this.get('atRuleType');
@ -101,8 +107,14 @@ export default class CssRule extends Model.extend(Styleable) {
} }
/** /**
* Return selectors fo the rule as a string * Return selectors of the rule as a string
* @return {string} * @param {Object} [opts] Options
* @param {Boolean} [opts.skipState] Skip state from the result
* @returns {String}
* @example
* const cssRule = editor.Css.setRule('.class1:hover', { color: 'red' });
* cssRule.selectorsToString(); // ".class1:hover"
* cssRule.selectorsToString({ skipState: true }); // ".class1"
*/ */
selectorsToString(opts = {}) { selectorsToString(opts = {}) {
const result = []; const result = [];
@ -123,9 +135,15 @@ export default class CssRule extends Model.extend(Styleable) {
} }
/** /**
* Get declaration block * Get declaration block (without the at-rule statement)
* @param {Object} [opts={}] Options * @param {Object} [opts={}] Options (same as in `selectorsToString`)
* @return {string} * @returns {String}
* @example
* const cssRule = editor.Css.setRule('.class1', { color: 'red' }, {
* atRuleType: 'media',
* atRuleParams: '(min-width: 500px)'
* });
* cssRule.getDeclaration() // ".class1{color:red;}"
*/ */
getDeclaration(opts = {}) { getDeclaration(opts = {}) {
let result = ''; let result = '';
@ -141,9 +159,15 @@ export default class CssRule extends Model.extend(Styleable) {
} }
/** /**
* Returns CSS string of the rule * Return the CSS string of the rule
* @param {Object} [opts={}] Options * @param {Object} [opts={}] Options (same as in `getDeclaration`)
* @return {string} * @return {String} CSS string
* @example
* const cssRule = editor.Css.setRule('.class1', { color: 'red' }, {
* atRuleType: 'media',
* atRuleParams: '(min-width: 500px)'
* });
* cssRule.toCSS() // "@media (min-width: 500px){.class1{color:red;}}"
*/ */
toCSS(opts = {}) { toCSS(opts = {}) {
let result = ''; let result = '';

Loading…
Cancel
Save