uiwjs / react-color

🎨 Is a tiny color picker widget component for React apps.
https://uiwjs.github.io/react-color
MIT License
274 stars 92 forks source link

Circle with margin #142

Open FlorianBEME opened 6 months ago

FlorianBEME commented 6 months ago

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

jaywcjlove commented 6 months ago

@FlorianBEME

<Circle rectProps={{ className: 'name' }} />
FlorianBEME commented 6 months ago

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

jaywcjlove commented 6 months ago

I added a class name to it. @FlorianBEME

image
FlorianBEME commented 6 months ago

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.

jaywcjlove commented 6 months ago

@FlorianBEME I accepted your advice. Upgrade v2.1.0

cyz1901 commented 6 months ago

@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,
          },
        }}
jaywcjlove commented 6 months ago

@cyz1901 Upgrade v2.1.1

cyz1901 commented 6 months ago

thx lgtm