💃🏻 Settings menu styling

This commit is contained in:
ajnart
2022-08-02 02:21:04 +02:00
parent 847e0855d8
commit 12c13de1bd
4 changed files with 10 additions and 10 deletions

View File

@@ -37,7 +37,7 @@ export default function TitleChanger() {
}; };
return ( return (
<Stack mb="lg"> <Stack mb="md" mr="sm" mt="xs">
<form onSubmit={form.onSubmit((values) => saveChanges(values))}> <form onSubmit={form.onSubmit((values) => saveChanges(values))}>
<Stack> <Stack>
<TextInput label="Page title" placeholder="Homarr 🦞" {...form.getInputProps('title')} /> <TextInput label="Page title" placeholder="Homarr 🦞" {...form.getInputProps('title')} />

View File

@@ -24,8 +24,8 @@ export default function CommonSettings(args: any) {
); );
return ( return (
<Stack mb="lg"> <Stack mb="md" mr="sm">
<Stack spacing={0}> <Stack spacing={0} mt="xs">
<Text>Search engine</Text> <Text>Search engine</Text>
<Tip> <Tip>
Use the prefixes <b>!yt</b> and <b>!t</b> in front of your query to search on YouTube or Use the prefixes <b>!yt</b> and <b>!t</b> in front of your query to search on YouTube or

View File

@@ -1,10 +1,10 @@
import { Group, ActionIcon, Anchor, Text } from '@mantine/core'; import { Group, ActionIcon, Anchor, Text, Stack } from '@mantine/core';
import { IconBrandDiscord, IconBrandGithub } from '@tabler/icons'; import { IconBrandDiscord, IconBrandGithub } from '@tabler/icons';
import { CURRENT_VERSION } from '../../../data/constants'; import { CURRENT_VERSION } from '../../../data/constants';
export default function Credits(props: any) { export default function Credits(props: any) {
return ( return (
<Group position="center" direction="row" mr="xs"> <Group position="center" mt="xs">
<Group spacing={0}> <Group spacing={0}>
<ActionIcon<'a'> component="a" href="https://github.com/ajnart/homarr" size="lg"> <ActionIcon<'a'> component="a" href="https://github.com/ajnart/homarr" size="lg">
<IconBrandGithub size={18} /> <IconBrandGithub size={18} />

View File

@@ -1,4 +1,4 @@
import { Checkbox, Group, SimpleGrid, Title } from '@mantine/core'; import { Checkbox, Group, SimpleGrid, Stack, Title } from '@mantine/core';
import * as Modules from '../../modules'; import * as Modules from '../../modules';
import { useConfig } from '../../tools/state'; import { useConfig } from '../../tools/state';
@@ -6,13 +6,13 @@ export default function ModuleEnabler(props: any) {
const { config, setConfig } = useConfig(); const { config, setConfig } = useConfig();
const modules = Object.values(Modules).map((module) => module); const modules = Object.values(Modules).map((module) => module);
return ( return (
<Group direction="column"> <Stack>
<Title order={4}>Module enabler</Title> <Title order={4}>Module enabler</Title>
<SimpleGrid cols={2} spacing="md"> <SimpleGrid cols={3} spacing="xs">
{modules.map((module) => ( {modules.map((module) => (
<Checkbox <Checkbox
key={module.title} key={module.title}
size="md" size="sm"
checked={config.modules?.[module.title]?.enabled ?? false} checked={config.modules?.[module.title]?.enabled ?? false}
label={`${module.title}`} label={`${module.title}`}
onChange={(e) => { onChange={(e) => {
@@ -30,6 +30,6 @@ export default function ModuleEnabler(props: any) {
/> />
))} ))}
</SimpleGrid> </SimpleGrid>
</Group> </Stack>
); );
} }