Issue #2440Opened December 2, 2019by edwinjoel19841 reactions

Resize by class :(

Question

The main problem that i have is I'm trying to do a resize in a component that I made, but if I have Two Components equals, when I do the resize one of them the other do the same resize. So, I think that I would need manage the style of them by id and not by class.

Code SnippetTEXT

This is my code: 
`const buttonComponent = {
    name: "button-bk",
    data: {
      id: "button",
      label: `Button`,
      category: "Basic Components",
      draggable: true,
      content: `<button class="btn-builder" data-gjs-draggable=".cell" data-gjs-resizable='{"tl":0,"tc":0,"tr":0,"cl":0,"cr":1,"bl":0,"br":0,"minDim":1,"bc":0,"currentUnit":1,"step":0.2}' data-gjs-name="Button">Send</button>`,
    },
  };
editor.BlockManager.add('button', buttonComponent);
`
View Example https://cl.ly/c4bfaf626adc

_Originally posted by @edwinjoel1984 in https://github.com/artf/grapesjs/issues/2435#issuecomment-560447001_

Answers (3)

pouyamiralayi• December 3, 20191 reactions

@ramusesan @edwinjoel1984 your issues is because of the shared selectors. similar issue here. for the solution i suggest this thread. cheers!

edwinjoel1984• December 2, 20190 reactions

@artf this is the problem

ramusesan• December 3, 20190 reactions

even i am facing the same issue its probably issue with precedence, assume incase i have an id and class for the same element i.e <table id="myId" class="myClass"> ..... </table> and trying to resize a table then styles are applying on .myClass not #myId

why class taking more precedence than id

how to fix

live demo here : https://stackblitz.com/edit/react-mcv9vz

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.

Presets Plugins Components Blocks Assets Commands I18n Layers Styles Storages RTE Newsletters Web pages Site builders

Resize by class :(

Question

Answers (3)

Related Questions and Answers

[Question] Firing events with custom components

Restrict Droppable Components to specific Component Types

BUG: Style gone on link or nested text elements after exiting edit

BUG: Move component from Child

Paid Plugins That Match This Issue

Browse Plugin Categories