Remove primary colour from colour options

This commit is contained in:
Mitchell McCaffrey 2021-07-18 09:42:07 +10:00
parent 1141dcf554
commit 4983ddbc17
4 changed files with 64 additions and 59 deletions

View File

@ -123,6 +123,7 @@ function DrawingToolSettings({
<ColorControl
color={settings.color}
onColorChange={(color) => onSettingChange({ color })}
exclude={["primary"]}
/>
<Divider vertical />
<ToolSection

View File

@ -18,7 +18,7 @@ function PointerToolSettings({
<ColorControl
color={settings.color}
onColorChange={(color) => onSettingChange({ color })}
exclude={["black", "darkGray", "lightGray", "white"]}
exclude={["black", "darkGray", "lightGray", "white", "primary"]}
/>
</Flex>
);

View File

@ -167,34 +167,36 @@ function NoteMenu({
justifyContent: "space-between",
}}
>
{colorOptions.map((color) => (
<Box
key={color}
sx={{
width: "16.66%",
paddingTop: "16.66%",
borderRadius: "50%",
transform: "scale(0.75)",
backgroundColor: colors[color],
cursor: "pointer",
}}
onClick={() => handleColorChange(color)}
aria-label={`Note label Color ${color}`}
>
{note && note.color === color && (
<Box
sx={{
width: "100%",
height: "100%",
border: "2px solid white",
position: "absolute",
top: 0,
borderRadius: "50%",
}}
/>
)}
</Box>
))}
{colorOptions
.filter((color) => color !== "primary")
.map((color) => (
<Box
key={color}
sx={{
width: "16.66%",
paddingTop: "16.66%",
borderRadius: "50%",
transform: "scale(0.75)",
backgroundColor: colors[color],
cursor: "pointer",
}}
onClick={() => handleColorChange(color)}
aria-label={`Note label Color ${color}`}
>
{note && note.color === color && (
<Box
sx={{
width: "100%",
height: "100%",
border: "2px solid white",
position: "absolute",
top: 0,
borderRadius: "50%",
}}
/>
)}
</Box>
))}
</Box>
<Flex sx={{ alignItems: "center" }}>
<Text

View File

@ -190,36 +190,38 @@ function TokenMenu({
justifyContent: "space-between",
}}
>
{colorOptions.map((color) => (
<Box
key={color}
sx={{
width: "16.66%",
paddingTop: "16.66%",
borderRadius: "50%",
transform: "scale(0.75)",
backgroundColor: colors[color],
cursor: "pointer",
}}
onClick={() => handleStatusChange(color)}
aria-label={`Token label Color ${color}`}
>
{tokenState &&
tokenState.statuses &&
tokenState.statuses.includes(color) && (
<Box
sx={{
width: "100%",
height: "100%",
border: "2px solid white",
position: "absolute",
top: 0,
borderRadius: "50%",
}}
/>
)}
</Box>
))}
{colorOptions
.filter((color) => color !== "primary")
.map((color) => (
<Box
key={color}
sx={{
width: "16.66%",
paddingTop: "16.66%",
borderRadius: "50%",
transform: "scale(0.75)",
backgroundColor: colors[color],
cursor: "pointer",
}}
onClick={() => handleStatusChange(color)}
aria-label={`Token label Color ${color}`}
>
{tokenState &&
tokenState.statuses &&
tokenState.statuses.includes(color) && (
<Box
sx={{
width: "100%",
height: "100%",
border: "2px solid white",
position: "absolute",
top: 0,
borderRadius: "50%",
}}
/>
)}
</Box>
))}
</Box>
<Flex sx={{ alignItems: "center" }}>
<Text