twentyhq/twenty
1
1
Fork 0
mirror of https://github.com/twentyhq/twenty.git synced 2024-10-05 05:17:40 +03:00
Code Issues Packages Projects Releases Wiki Activity

Scroll tab list on record show (#3561)

Browse Source 
* scroll tab list on record show #3275

* update the style of tab

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Jeet Desai 2024-01-24 23:00:58 +05:30 committed by GitHub
parent afbb87ae12
commit 21f342c5ea
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/twenty-front/src/modules/object-record/record-relation-card/components/RecordRelationFieldCardSection.tsx
View File

@ -29,6 +29,7 @@ import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
import { DropdownScope } from '@/ui/layout/dropdown/scopes/DropdownScope';
import { Section } from '@/ui/layout/section/components/Section';
import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
import { FilterQueryParams } from '@/views/hooks/internal/useFiltersFromQueryParams';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
@ -40,6 +41,7 @@ const StyledHeader = styled.header<{ isDropdownOpen?: boolean }>`
align-items: center;
display: flex;
margin-bottom: ${({ theme }) => theme.spacing(2)};
padding: ${() => (useIsMobile() ? '0 12px' : 'unset')};
${({ isDropdownOpen, theme }) =>
isDropdownOpen

7
packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageLeftContainer.tsx
View File

@ -20,10 +20,9 @@ const StyledInnerContainer = styled.div`
display: flex;
flex-direction: column;
gap: ${({ theme }) => theme.spacing(6)};
padding: ${({ theme }) => theme.spacing(3)};
padding-right: ${({ theme }) => theme.spacing(2)};
width: ${({ theme }) =>
useIsMobile() ? `calc(100% - ${theme.spacing(5)})` : '348px'};
padding: ${({ theme }) => (useIsMobile() ? '12px 0' : theme.spacing(3))};
padding-right: ${({ theme }) => (useIsMobile() ? 0 : theme.spacing(2))};
width: ${() => (useIsMobile() ? `100%` : '348px')};
`;
const StyledIntermediateContainer = styled.div`

2
packages/twenty-front/src/modules/ui/layout/tab/components/Tab.tsx
View File

@ -30,7 +30,7 @@ const StyledTab = styled.div<{ active?: boolean; disabled?: boolean }>`
display: flex;
gap: ${({ theme }) => theme.spacing(1)};
justify-content: center;
margin-bottom: -1px;
margin-bottom: 0;
padding: ${({ theme }) => theme.spacing(2) + ' 0'};
pointer-events: ${({ disabled }) => (disabled ? 'none' : '')};
`;

1
packages/twenty-front/src/modules/ui/layout/tab/components/TabList.tsx
View File

@ -29,6 +29,7 @@ const StyledContainer = styled.div`
height: 40px;
padding-left: ${({ theme }) => theme.spacing(2)};
user-select: none;
overflow: auto;
`;
export const TabList = ({ tabs, tabListId }: TabListProps) => {