Archives/Athou_commafeed
1
0
Fork 1
mirror of https://github.com/Athou/commafeed.git synced 2026-03-21 21:37:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

color names are now translatable (#1766)

Browse Source
This commit is contained in:
Athou
2025-04-28 22:39:15 +02:00
parent 3983ba6cd0
commit ec21ffc571
1 changed files with 18 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
commafeed-client/src/components/settings/DisplaySettings.tsx
View File

@@ -1,7 +1,7 @@
import { msg } from "@lingui/core/macro" import { msg } from "@lingui/core/macro"
import { useLingui } from "@lingui/react" import { useLingui } from "@lingui/react"
import { Trans } from "@lingui/react/macro" import { Trans } from "@lingui/react/macro"
import { Box, DEFAULT_THEME, Divider, Group, NumberInput, Radio, Select, type SelectProps, SimpleGrid, Stack, Switch } from "@mantine/core" import { Box, Divider, Group, NumberInput, Radio, Select, type SelectProps, SimpleGrid, Stack, Switch } from "@mantine/core"
import type { ComboboxData } from "@mantine/core/lib/components/Combobox/Combobox.types" import type { ComboboxData } from "@mantine/core/lib/components/Combobox/Combobox.types"
import { Constants } from "app/constants" import { Constants } from "app/constants"
import { useAppDispatch, useAppSelector } from "app/store" import { useAppDispatch, useAppSelector } from "app/store"
@@ -70,11 +70,26 @@ export function DisplaySettings() {
}, },
] ]
const colorData: ComboboxData = Object.keys(DEFAULT_THEME.colors).sort((a, b) => a.localeCompare(b)) const colorData: ComboboxData = [
{ value: "dark", label: _(msg`Dark`) },
{ value: "gray", label: _(msg`Gray`) },
{ value: "red", label: _(msg`Red`) },
{ value: "pink", label: _(msg`Pink`) },
{ value: "grape", label: _(msg`Grape`) },
{ value: "violet", label: _(msg`Violet`) },
{ value: "indigo", label: _(msg`Indigo`) },
{ value: "blue", label: _(msg`Blue`) },
{ value: "cyan", label: _(msg`Cyan`) },
{ value: "green", label: _(msg`Green`) },
{ value: "lime", label: _(msg`Lime`) },
{ value: "yellow", label: _(msg`Yellow`) },
{ value: "orange", label: _(msg`Orange`) },
{ value: "teal", label: _(msg`Teal`) },
].sort((a, b) => a.label.localeCompare(b.label))
const colorRenderer: SelectProps["renderOption"] = ({ option }) => ( const colorRenderer: SelectProps["renderOption"] = ({ option }) => (
<Group> <Group>
<Box h={18} w={18} bg={option.value} /> <Box h={18} w={18} bg={option.value} />
<Box>{option.value}</Box> <Box>{option.label}</Box>
</Group> </Group>
) )