diff --git a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsSettingsSection.tsx b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsSettingsSection.tsx
index 3c5337e65..0bd6a76e2 100644
--- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsSettingsSection.tsx
+++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsSettingsSection.tsx
@@ -12,6 +12,10 @@ const StyledCardsContainer = styled.div`
margin-top: ${({ theme }) => theme.spacing(6)};
`;
+const StyledSettingsNavigationCard = styled(SettingsNavigationCard)`
+ color: ${({ theme }) => theme.font.color.extraLight};
+`;
+
export const SettingsAccountsSettingsSection = () => {
const navigate = useNavigate();
@@ -29,14 +33,14 @@ export const SettingsAccountsSettingsSection = () => {
>
Set email visibility, manage your blocklist and more.
-
Configure and customize your calendar preferences.
-
+
);
diff --git a/packages/twenty-front/src/modules/settings/components/SettingsNavigationCard.tsx b/packages/twenty-front/src/modules/settings/components/SettingsNavigationCard.tsx
index 001ed5f8f..3167f4257 100644
--- a/packages/twenty-front/src/modules/settings/components/SettingsNavigationCard.tsx
+++ b/packages/twenty-front/src/modules/settings/components/SettingsNavigationCard.tsx
@@ -15,6 +15,7 @@ type SettingsNavigationCardProps = {
Icon: IconComponent;
onClick?: () => void;
title: string;
+ className?: string;
};
const StyledCard = styled(Card)<{
@@ -63,15 +64,16 @@ export const SettingsNavigationCard = ({
Icon,
onClick,
title,
+ className,
}: SettingsNavigationCardProps) => {
const theme = useTheme();
return (
-
+
-
+
{title}
{hasSoonPill && }