Atlas48/grungnet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Remove primary colour from colour options

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/map/controls/DrawingToolSettings.tsx
View File

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

2
src/components/map/controls/PointerToolSettings.tsx
View File

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

58
src/components/note/NoteMenu.tsx
View File

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

62
src/components/token/TokenMenu.tsx
View File

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