Skip to content

Commit

Permalink
Update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
hxf31891 authored Dec 31, 2024
1 parent 98d36a1 commit f34f625
Showing 1 changed file with 34 additions and 11 deletions.
45 changes: 34 additions & 11 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -379,17 +379,40 @@ function MyApp() {

<a id="item-fifteen"></a>
## Styling
Many of the pickers components have css classnames you can target to change styles. Below are some of the more common, others can be found using the elements inspector.

| Class | Description |
| --------------------------- | ---------------------------------------------------------------- |
| rbgcp-control-btn-wrapper | grey area around the buttons |
| rbgcp-control-icon-btn | icon buttons |
| rbgcp-control-btn | text buttons |
| rbgcp-control-btn-selected | selected buttons, icon and text |
| rbgcp-color-model-dropdown | dropdown to select between color modes |
| rbgcp-control-input | inputs on the gradient control bar, angle and stop |
| rbgcp-input | color value inputs, hex, rgba etc |
Most of the pickers components have inline styles applied to them. In order to update, identify the key being applied to the desired component and add it as a nest object to the style object which can be passed into the picker. See below list of style keys and example.

<br />

| Key | Description |
| -------------------------------- | ------------------------------------------------ |
| body | ComingSoon |
| rbgcpControlBtnWrapper | ComingSoon |
| rbgcpControlBtn | ComingSoon |
| rbgcpControlIconBtn | ComingSoon |
| rbgcpControlIcon | ComingSoon |
| rbgcpColorModelDropdown | ComingSoon |
| rbgcpEyedropperCover | ComingSoon |
| rbgcpControlInputWrap | ComingSoon |
| rbgcpControlInput | ComingSoon |
| rbgcpInputLabel | ComingSoon |
| rbgcpInput | ComingSoon |
| rbgcpHandle | ComingSoon |
| rbgcpCanvasWrapper | ComingSoon |
| rbgcpOpacityOverlay | ComingSoon |
| rbgcpGradientHandleWrap | ComingSoon |
| rbgcpGradientHandle | ComingSoon |
| rbgcpControlIcon2 | ComingSoon |
| rbgcpControlBtnSelected | ComingSoon |
| rbgcpComparibleLabel | ComingSoon |
| rbgcpColorModelDropdownBtn | ComingSoon |
| rbgcpStopInputWrap | ComingSoon |
| rbgcpStopInput | ComingSoon |
| rbgcpDegreeInputWrap | ComingSoon |
| rbgcpDegreeInput | ComingSoon |
| rbgcpDegreeIcon | ComingSoon |
| rbgcpEyedropperBtn | ComingSoon |
| rbgcpHexInput | ComingSoon |
| rbgcpInputsWrap | ComingSoon |

<br />

Expand Down

0 comments on commit f34f625

Please sign in to comment.