Automation selection looking good

This commit is contained in:
Connor Yoh 2025-08-19 14:30:24 +01:00
parent d9547ecd20
commit 6ea300ddd3
2 changed files with 18 additions and 17 deletions

View File

@ -32,11 +32,11 @@ export default function AutomationEntry({
{BadgeIcon && ( {BadgeIcon && (
<BadgeIcon <BadgeIcon
style={{ style={{
color: keepIconColor ? 'inherit' : 'var(--mantine-color-dimmed)' color: keepIconColor ? 'inherit' : 'var(--mantine-color-text)'
}} }}
/> />
)} )}
<Text fw={600} size="sm" style={{ flex: 1, textAlign: 'left', color: 'var(--mantine-color-dimmed)' }}> <Text size="sm" style={{ flex: 1, textAlign: 'left', color: 'var(--mantine-color-text)' }}>
{title} {title}
</Text> </Text>
</Group> </Group>
@ -48,18 +48,19 @@ export default function AutomationEntry({
{BadgeIcon && ( {BadgeIcon && (
<BadgeIcon <BadgeIcon
style={{ style={{
color: keepIconColor ? 'inherit' : 'var(--mantine-color-dimmed)' color: keepIconColor ? 'inherit' : 'var(--mantine-color-text)'
}} }}
/> />
)} )}
<Group gap="xs" justify="flex-start" style={{ flex: 1 }}> <Group gap="xs" justify="flex-start" style={{ flex: 1 }}>
{operations.map((op, index) => ( {operations.map((op, index) => (
<React.Fragment key={`${op}-${index}`}> <React.Fragment key={`${op}-${index}`}>
<Badge size="xs" variant="outline" style={{ color: 'var(--mantine-color-dimmed)', borderColor: 'var(--mantine-color-dimmed)' }}> <Text size="sm" style={{ color: 'var(--mantine-color-text)' }}>
{String(t(`${op}.title`, op))} {t(`${op}.title`, op)}
</Badge> </Text>
{index < operations.length - 1 && ( {index < operations.length - 1 && (
<Text size="xs" c="dimmed" style={{ color: 'var(--mantine-color-dimmed)' }}> <Text size="xs" c="dimmed" style={{ color: 'var(--mantine-color-text)' }}>
</Text> </Text>
)} )}

View File

@ -20,7 +20,7 @@ export default function AutomationSelection({ onSelectCustom, onSelectSuggested,
return ( return (
<div> <div>
<Title order={3} size="h4" mb="md"> <Title order={3} size="h4" fw={600} mb="md" style={{color: 'var(--mantine-color-dimmed)'}}>
{t("automate.selection.saved.title", "Saved")} {t("automate.selection.saved.title", "Saved")}
</Title> </Title>
@ -42,11 +42,11 @@ export default function AutomationSelection({ onSelectCustom, onSelectSuggested,
onClick={() => onSelectCustom()} onClick={() => onSelectCustom()}
/> />
))} ))}
<Divider /> <Divider pb='sm' />
{/* Suggested Automations */} {/* Suggested Automations */}
<div> <div>
<Title order={3} size="h4" mb="md"> <Title order={3} size="h4" fw={600} mb="md"style={ {color: 'var(--mantine-color-dimmed)'}}>
{t("automate.selection.suggested.title", "Suggested")} {t("automate.selection.suggested.title", "Suggested")}
</Title> </Title>
<Stack gap="xs"> <Stack gap="xs">