Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 | 45x 21x 45x | import { Box } from "@mui/material";
import { PAYBUILDER_WHITE_BACKGROUND } from "@sections/PayBuilder/consts";
export const ColorOptionCircle = ({
bgColor,
width,
height,
borderColor = "#292928",
}: {
bgColor: string;
width?: string;
height?: string;
borderColor?: string;
}) => {
return (
<Box
sx={{
width: width || "32px",
height: height || "32px",
backgroundColor: bgColor,
borderRadius: "50%",
border: 1,
borderColor: borderColor,
}}
/>
);
};
export const bgColorOptions = [
{
label: "Black",
value: "rgb(40, 40, 40)",
Image: <ColorOptionCircle bgColor="rgb(40, 40, 40)" />,
},
{
label: "White",
value: PAYBUILDER_WHITE_BACKGROUND,
Image: <ColorOptionCircle bgColor={PAYBUILDER_WHITE_BACKGROUND} />,
},
{
label: "Sepia",
value: "rgb(107, 65, 17)",
Image: <ColorOptionCircle bgColor="rgb(107, 65, 17)" />,
},
{
label: "Royal Blue",
value: "rgb(50, 79, 108)",
Image: <ColorOptionCircle bgColor="rgb(50, 79, 108)" />,
},
{
label: "Brunswick Green",
value: "rgb(32, 87, 70)",
Image: <ColorOptionCircle bgColor="rgb(32, 87, 70)" />,
},
{
label: "Royal Red",
value: "rgb(98, 44, 44)",
Image: <ColorOptionCircle bgColor="rgb(98, 44, 44)" />,
},
{
label: "Grey",
value: "rgb(226, 223, 221)",
Image: <ColorOptionCircle bgColor="rgb(226, 223, 221)" />,
},
{
label: "Azureish Blue",
value: "rgb(213, 235, 240)",
Image: <ColorOptionCircle bgColor="rgb(213, 235, 240)" />,
},
{
label: "Pale Lavender",
value: "rgb(219, 213, 240)",
Image: <ColorOptionCircle bgColor="rgb(219, 213, 240)" />,
},
{
label: "Pale Green",
value: "rgb(223, 242, 230)",
Image: <ColorOptionCircle bgColor="rgb(223, 242, 230)" />,
},
{
label: "Pastel Gray",
value: "rgb(206, 221, 188)",
Image: <ColorOptionCircle bgColor="rgb(206, 221, 188)" />,
},
];
|