mirror of
https://github.com/lingble/twenty.git
synced 2025-10-29 20:02:29 +00:00
Merge pull request #43 from twentyhq/sammy/t-103-i-see-company-chip-designed-with-picture
Sammy/t 103 i see company chip designed with picture
This commit is contained in:
@@ -10,17 +10,20 @@ type OwnProps = {
|
||||
|
||||
const StyledContainer = styled.span`
|
||||
background-color: ${(props) => props.theme.tertiaryBackground};
|
||||
border-radius: 4px;
|
||||
border-radius: ${(props) => props.theme.spacing(1)};
|
||||
color: ${(props) => props.theme.text80};
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 4px 8px 4px 4px;
|
||||
gap: 4px;
|
||||
padding: ${(props) => props.theme.spacing(1)};
|
||||
gap: ${(props) => props.theme.spacing(1)};
|
||||
|
||||
:hover {
|
||||
filter: brightness(95%);
|
||||
}
|
||||
|
||||
img {
|
||||
height: 1rem;
|
||||
width: 1rem;
|
||||
border-radius: 0.5rem;
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
object-fit: cover;
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
export interface Company {
|
||||
id: number;
|
||||
name: string;
|
||||
logo: string;
|
||||
domain: string;
|
||||
}
|
||||
|
||||
@@ -48,7 +48,7 @@ const defaultData: Array<Person> = [
|
||||
fullName: 'Alexandre Prot',
|
||||
picture: personPlaceholder,
|
||||
email: 'alexandre@qonto.com',
|
||||
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' },
|
||||
company: { id: 1, name: 'Qonto', domain: 'qonto.com' },
|
||||
phone: '06 12 34 56 78',
|
||||
creationDate: new Date('Feb 23, 2018'),
|
||||
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
|
||||
@@ -59,7 +59,7 @@ const defaultData: Array<Person> = [
|
||||
fullName: 'Alexandre Prot',
|
||||
picture: personPlaceholder,
|
||||
email: 'alexandre@qonto.com',
|
||||
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' },
|
||||
company: { id: 2, name: 'LinkedIn', domain: 'linkedin.com' },
|
||||
phone: '06 12 34 56 78',
|
||||
creationDate: new Date('Feb 23, 2018'),
|
||||
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
|
||||
@@ -70,7 +70,7 @@ const defaultData: Array<Person> = [
|
||||
fullName: 'Alexandre Prot',
|
||||
picture: personPlaceholder,
|
||||
email: 'alexandre@qonto.com',
|
||||
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' },
|
||||
company: { id: 1, name: 'Qonto', domain: 'qonto.com' },
|
||||
phone: '06 12 34 56 78',
|
||||
creationDate: new Date('Feb 23, 2018'),
|
||||
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
|
||||
@@ -81,7 +81,7 @@ const defaultData: Array<Person> = [
|
||||
fullName: 'Alexandre Prot',
|
||||
picture: personPlaceholder,
|
||||
email: 'alexandre@qonto.com',
|
||||
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' },
|
||||
company: { id: 1, name: 'Slack', domain: 'slack.com' },
|
||||
phone: '06 12 34 56 78',
|
||||
creationDate: new Date('Feb 23, 2018'),
|
||||
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
|
||||
@@ -92,7 +92,7 @@ const defaultData: Array<Person> = [
|
||||
fullName: 'Alexandre Prot',
|
||||
picture: personPlaceholder,
|
||||
email: 'alexandre@qonto.com',
|
||||
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' },
|
||||
company: { id: 2, name: 'Facebook', domain: 'facebook.com' },
|
||||
phone: '06 12 34 56 78',
|
||||
creationDate: new Date('Feb 23, 2018'),
|
||||
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
|
||||
@@ -133,7 +133,7 @@ const columns = [
|
||||
cell: (props) => (
|
||||
<CellLink
|
||||
name={props.row.original.company.name}
|
||||
picture={props.row.original.company.logo}
|
||||
picture={`https://www.google.com/s2/favicons?domain=${props.row.original.company.domain}&sz=256`}
|
||||
href="#"
|
||||
/>
|
||||
),
|
||||
|
||||
Reference in New Issue
Block a user