twentyhq/twenty
1
1
Fork 0
mirror of https://github.com/twentyhq/twenty.git synced 2024-11-23 22:12:24 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fix RecordTableHeaderCell (#6383)

Browse Source 
@Bonapara

Fixed! the issue (#6365) where the `background-color` style was not set,
causing the bug. Now, the background color is properly applied.



https://github.com/user-attachments/assets/668bd3cc-77ea-42a9-84d4-071fca497e07
This commit is contained in:
nitin 2024-07-24 14:11:03 +05:30 committed by GitHub
parent b0b2281fc5
commit 895910e1d1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 12 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCheckboxColumn.tsx
View File

@ -4,18 +4,25 @@ import { useRecoilValue } from 'recoil';
import { useRecordTableStates } from '@/object-record/record-table/hooks/internal/useRecordTableStates';
import { useRecordTable } from '@/object-record/record-table/hooks/useRecordTable';
import { Checkbox } from '@/ui/input/components/Checkbox';
import { useTheme } from '@emotion/react';
const StyledContainer = styled.div`
align-items: center;
display: flex;
height: 32px;
justify-content: center;
background-color: ${({ theme }) => theme.background.primary};
`;
const StyledColumnHeaderCell = styled.th`
background-color: ${({ theme }) => theme.background.primary};
border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
border-right: transparent;
border-top: 1px solid ${({ theme }) => theme.border.color.light};
max-width: 30px;
min-width: 30px;
width: 30px;
`;
export const RecordTableHeaderCheckboxColumn = () => {
const { allRowsSelectedStatusSelector } = useRecordTableStates();
@ -36,19 +43,8 @@ export const RecordTableHeaderCheckboxColumn = () => {
}
};
const theme = useTheme();
return (
<th
style={{
borderBottom: `1px solid ${theme.border.color.light}`,
borderTop: `1px solid ${theme.border.color.light}`,
width: 30,
minWidth: 30,
maxWidth: 30,
borderRight: 'transparent',
}}
>
<StyledColumnHeaderCell>
<StyledContainer>
<Checkbox
checked={checked}
@ -56,6 +52,6 @@ export const RecordTableHeaderCheckboxColumn = () => {
indeterminate={indeterminate}
/>
</StyledContainer>
</th>
</StyledColumnHeaderCell>
);
};