mythic-insight/calcom
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 5

more layout changes to /integrations (#914)

Browse source 
* added truncate to list
This commit is contained in:
Peer Richelsen 2021-10-12 13:06:12 +01:00 committed by GitHub
parent 392c8e8da4
commit 6f204ca521
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 3 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
components/List.tsx
View file

@ -65,7 +65,7 @@ export function ListItemText<TComponent extends keyof JSX.IntrinsicElements = "s
component, component,
{ {
...passThroughProps, ...passThroughProps,
className: classNames("text-sm text-gray-500", props.className), className: classNames("text-sm text-gray-500 truncate", props.className),
}, },
props.children props.children
); );

4
pages/integrations/index.tsx
View file

@ -172,7 +172,7 @@ function ConnectOrDisconnectIntegrationButton(props: {
} }
if (!props.installed) { if (!props.installed) {
return ( return (
<div className="h-12 -mt-1"> <div className="h-12 -mt-1 truncate">
<Alert severity="warning" title="Not installed" /> <Alert severity="warning" title="Not installed" />
</div> </div>
); );
@ -193,7 +193,7 @@ function IntegrationListItem(props: {
<ListItem expanded={!!props.children} className={classNames("flex-col")}> <ListItem expanded={!!props.children} className={classNames("flex-col")}>
<div className={classNames("flex flex-1 space-x-2 w-full p-4 items-center")}> <div className={classNames("flex flex-1 space-x-2 w-full p-4 items-center")}>
<Image width={40} height={40} src={`/${props.imageSrc}`} alt={props.title} /> <Image width={40} height={40} src={`/${props.imageSrc}`} alt={props.title} />
<div className="pl-2 flex-grow"> <div className="pl-2 flex-grow truncate">
<ListItemTitle component="h3">{props.title}</ListItemTitle> <ListItemTitle component="h3">{props.title}</ListItemTitle>
<ListItemText component="p">{props.description}</ListItemText> <ListItemText component="p">{props.description}</ListItemText>
</div> </div>