uiwjs/react-color

Circle with margin

Opened this issue · 8 comments

Hello there,

Using your library, I see that a margin has slipped around the circles. Is this a normal behavior? Do you know how I can center them? Is there a prop to add CSS classes (or styles) to override the style of the colored circles?

Thank you in advance and have a great day =D

Capture d’écran 2024-02-19 à 16 05 23

@FlorianBEME

<Circle rectProps={{ className: 'name' }} />

I thank you for your response; Perhaps something is escaping me, however, I have the impression that the className does not apply to the correct HTML tag.

Capture d’écran 2024-02-23 à 11 24 45

Capture d’écran 2024-02-23 à 11 25 34
Capture d’écran 2024-02-23 à 11 25 24

I added a class name to it. @FlorianBEME

image

First, I thank you for taking the time to address the issue ^^.
However, it seems that the div you pointed out is not the one with this margin.

It appears that this 12px margin is applied within the 'style' section. The issue is that if I try to override these properties, the content of the 'style' section seems to take priority.
Capture d’écran 2024-02-23 à 14 49 25

It might be wiser to create a 'pointProps' prop where we could pass the elements in a similar way as 'rectProp,' allowing us to override the style more effectively.

regardless, thank you for taking the time to respond to me.

@FlorianBEME I accepted your advice. Upgrade v2.1.0

@jaywcjlove sorry i have a small problem. Using it this way seems to overwrite all styles. I only want to override the specified styles.

    pointProps={{
        style: {
          marginBottom: 0,
        },
      }}

@cyz1901 Upgrade v2.1.1

thx lgtm