grapesjs-preset-newsletter icon indicating copy to clipboard operation
grapesjs-preset-newsletter copied to clipboard

Add border top, bottom, left, right individually to Decorations.

Open thanhpd56 opened this issue 6 years ago • 1 comments

There no option to add border top, bottom, left, right individually to cell, so i try to add new one by this way editor.StyleManager.addProperty('Decorations', { name: 'Border right', property: 'border-right', type: 'composite', properties: [{ name: 'Width', type: 'integer', units: ['px', 'em', 'rem'], property: 'border-right-width', },{ name: 'Style', type: 'select', property: 'border-right-style', options: [ {value: 'none'}, {value: 'solid'}, {value: 'dotted'}, {value: 'dashed'}, {value: 'double'}, {value: 'groove'}, {value: 'ridge'}, {value: 'inset'}, {value: 'outset'} ] }, { name: 'Color', type: 'color', property: 'border-right-color', }] }); But it does not appear. How can i fix it?

thanhpd56 avatar Nov 22 '18 03:11 thanhpd56

For me it worled by creting a new full menu item in the initial array configuration. Remember that this can be replicated by using the same editor.SyleManager.addProperty() function.

{ name: 'Border', open: false, buldProps : [ 'border-top', 'border-left', 'border-right', 'border-bottom' ], properties: [ { property: 'border-top', type: 'composite', properties: [ { name: 'Width', type: 'integer', units: ['px', 'em', 'rem'], property: 'border-top-width', }, { name: 'Style', type: 'select', property: 'border-top-style', options: [ {value: 'none'}, {value: 'solid'}, {value: 'dotted'}, {value: 'dashed'}, {value: 'double'}, {value: 'groove'}, {value: 'ridge'}, {value: 'inset'}, {value: 'outset'} ] }, { name: 'Color', type: 'color', property: 'border-top-color', } ] }, ] },

goodwind10 avatar Jun 11 '20 21:06 goodwind10