...

/

Connecting the ColorPicker Dialog

Connecting the ColorPicker Dialog

We'll cover the following...

Now that we have a dialog, we also need an input to show the current color:

Commit 9e9c02f: Add a simple ColorPickerButton

common/components/ColorPickerButton.jsx

import React from "react";

import {Button} from "semantic-ui-react";

const ColorPickerButton = ({value, onClick, disabled=false}) => {
    return (
        <Button
            type="button"
            style={{padding: "4px", margin: 0}}
            disabled={disabled}
            onClick={onClick}
        >
            <div
                style={{
                    width : 30,
                    height : 15,
                    backgroundColor : value
                }}
            />
        </Button>
    )
}

export
...