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

feature: align checkbox and cellLink

Browse Source
This commit is contained in:
Sammy Teillet 2023-04-18 18:13:56 +02:00
parent 0d9b04ea14
commit 4d23390989
No known key found for this signature in database
GPG Key ID: 687E513E74D28696
2 changed files with 19 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
front/src/layout/containers/HorizontalyAlignedContainer.tsx Normal file
View File

@ -0,0 +1,16 @@
import styled from '@emotion/styled';
type OwnProps = {
children: JSX.Element[];
};
const StyledContainer = styled.div`
display: flex;
align-items: center;
`;
function HorizontalyAlignedContainer({ children: children }: OwnProps) {
return <StyledContainer>{children}</StyledContainer>;
}
export default HorizontalyAlignedContainer;

5
front/src/pages/people/People.tsx
View File

@ -17,6 +17,7 @@ import ColumnHead from '../../components/table/ColumnHead';
import personPlaceholder from './placeholder.png';
import { parsePhoneNumber, CountryCode } from 'libphonenumber-js';
import Checkbox from '../../components/form/Checkbox';
import HorizontalyAlignedContainer from '../../layout/containers/HorizontalyAlignedContainer';
type Person = {
fullName: string;
@ -106,7 +107,7 @@ const columns = [
columnHelper.accessor('fullName', {
header: () => <ColumnHead viewName="People" viewIcon={faUser} />,
cell: (props) => (
<>
<HorizontalyAlignedContainer>
<Checkbox
id={`person-selected-${props.row.original.email}`}
name={`person-selected${props.row.original.email}`}
@ -116,7 +117,7 @@ const columns = [
picture={props.row.original.picture}
href="#"
/>
</>
</HorizontalyAlignedContainer>
),
}),
columnHelper.accessor('email', {