From 43a000694783a9824c5893c728eb1a7360f8a3c4 Mon Sep 17 00:00:00 2001 From: Harshit Singh <73997189+harshit078@users.noreply.github.com> Date: Thu, 10 Oct 2024 21:13:22 +0530 Subject: [PATCH] fix: Settings card inconsitent for mobile viewports (#7464) Closes #7457 --------- Co-authored-by: Lucas Bordeau --- .../components/SettingsAccountsSettingsSection.tsx | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) 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 5ca4cb832d..5da069e0b2 100644 --- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsSettingsSection.tsx +++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsSettingsSection.tsx @@ -1,5 +1,10 @@ import styled from '@emotion/styled'; -import { H2Title, IconCalendarEvent, IconMailCog } from 'twenty-ui'; +import { + H2Title, + IconCalendarEvent, + IconMailCog, + MOBILE_VIEWPORT, +} from 'twenty-ui'; import { SettingsCard } from '@/settings/components/SettingsCard'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; @@ -12,6 +17,10 @@ const StyledCardsContainer = styled.div` display: flex; gap: ${({ theme }) => theme.spacing(4)}; margin-top: ${({ theme }) => theme.spacing(6)}; + + @media (max-width: ${MOBILE_VIEWPORT}pxF) { + flex-direction: column; + } `; export const SettingsAccountsSettingsSection = () => {