Change the size (width/height) of swatches on Github Picker

[guilhermepohl]

Hey, I'd like to know if it's possible to change those props and also include a margin within each swatch color on the Github Picker.

The widht and height attributes are on the GithubSwatch.js file.

Thanks in advance, Guilherme

[jkhaui]

@guilhermepohl I agree, there should definitely be an option to modify all the inline styles of each color picker via props. But for now, if you just need to do it by any means possible, you can use CSS. E.g.

.github-picker > span > div {
    width: 30px!important;
    height: 30px!important;
}

[tordans]

Just a few quick links to the code in case someone else looks at this:

• Github.js can receive a custom styles hash https://github.com/casesandberg/react-color/blob/master/src/components/github/Github.js#L12

https://github.com/casesandberg/react-color/blob/bc9a0e1dc5d11b06c511a8e02a95bd85c7129f4b/src/components/github/Github.js#L12-L35

• … but does not pass swatch styles to GithubSwatch.js https://github.com/casesandberg/react-color/blob/master/src/components/github/Github.js#L103-L108

https://github.com/casesandberg/react-color/blob/bc9a0e1dc5d11b06c511a8e02a95bd85c7129f4b/src/components/github/Github.js#L103-L108

• … which in turn only has hard coded width/height styles https://github.com/casesandberg/react-color/blob/master/src/components/github/GithubSwatch.js#L14-L28

https://github.com/casesandberg/react-color/blob/bc9a0e1dc5d11b06c511a8e02a95bd85c7129f4b/src/components/github/GithubSwatch.js#L14-L28