mirror of
https://github.com/ajnart/homarr.git
synced 2025-11-11 07:55:52 +01:00
♻️ Add translations for board customize page
This commit is contained in:
@@ -18,11 +18,7 @@ import Editor from 'react-simple-code-editor';
|
||||
import { useBoardCustomizationFormContext } from '../form';
|
||||
|
||||
export const AppearanceCustomization = () => {
|
||||
const { t } = useTranslation([
|
||||
'settings/customization/page-appearance',
|
||||
'settings/customization/color-selector',
|
||||
]);
|
||||
const theme = useMantineTheme();
|
||||
const { t } = useTranslation('settings/customization/page-appearance');
|
||||
const form = useBoardCustomizationFormContext();
|
||||
|
||||
return (
|
||||
@@ -45,7 +41,7 @@ type ColorSelectorProps = {
|
||||
type: 'primaryColor' | 'secondaryColor';
|
||||
};
|
||||
const ColorSelector = ({ type }: ColorSelectorProps) => {
|
||||
const { t } = useTranslation('settings/customization/color-selector');
|
||||
const { t } = useTranslation('boards/customize');
|
||||
const theme = useMantineTheme();
|
||||
const form = useBoardCustomizationFormContext();
|
||||
|
||||
@@ -55,7 +51,7 @@ const ColorSelector = ({ type }: ColorSelectorProps) => {
|
||||
}));
|
||||
|
||||
return (
|
||||
<Input.Wrapper label={type}>
|
||||
<Input.Wrapper label={t(`settings.appearance.${type}`)}>
|
||||
<Group>
|
||||
{colors.map(({ color, swatch }) => (
|
||||
<ColorSwatch
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import { Button, Checkbox, Grid, Stack } from '@mantine/core';
|
||||
import { IconDeviceFloppy } from '@tabler/icons-react';
|
||||
import { Checkbox, Grid, Stack } from '@mantine/core';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
|
||||
import { useBoardCustomizationFormContext } from '../form';
|
||||
|
||||
@@ -15,12 +15,12 @@ import { Trans, useTranslation } from 'next-i18next';
|
||||
import Link from 'next/link';
|
||||
import { useEditModeStore } from '~/components/Dashboard/Views/useEditModeStore';
|
||||
import { useNamedWrapperColumnCount } from '~/components/Dashboard/Wrappers/gridstack/store';
|
||||
import { BoardHeadOverride } from '~/components/layout/Meta/BoardHeadOverride';
|
||||
import { HeaderActionButton } from '~/components/layout/header/ActionButton';
|
||||
import { useConfigContext } from '~/config/provider';
|
||||
import { env } from '~/env';
|
||||
import { api } from '~/utils/api';
|
||||
|
||||
import { HeaderActionButton } from '~/components/layout/header/ActionButton';
|
||||
import { BoardHeadOverride } from '~/components/layout/Meta/BoardHeadOverride';
|
||||
import { MainLayout } from './MainLayout';
|
||||
|
||||
type BoardLayoutProps = {
|
||||
@@ -68,10 +68,10 @@ const DockerButton = () => {
|
||||
|
||||
const CustomizeBoardButton = () => {
|
||||
const { name } = useConfigContext();
|
||||
console.log('name', name);
|
||||
const { t } = useTranslation('boards/common');
|
||||
|
||||
return (
|
||||
<Tooltip label="Customize board">
|
||||
<Tooltip label={t('header.customize')}>
|
||||
<HeaderActionButton component={Link} href={`/board/${name}/customize`}>
|
||||
<IconSettings size={20} stroke={1.5} />
|
||||
</HeaderActionButton>
|
||||
@@ -158,7 +158,7 @@ const ToggleEditModeButton = () => {
|
||||
if (enabled) {
|
||||
return (
|
||||
<Button.Group>
|
||||
<Tooltip label={t('button.disabled')}>
|
||||
<Tooltip label={t('button.enabled')}>
|
||||
<HeaderActionButton onClick={save}>
|
||||
<IconEditCircleOff size={20} stroke={1.5} />
|
||||
</HeaderActionButton>
|
||||
|
||||
Reference in New Issue
Block a user