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

minor layout changes to /integrations (#913)

Browse source
This commit is contained in:
Peer Richelsen 2021-10-12 12:39:02 +01:00 committed by GitHub
parent 2fd25acc3c
commit 392c8e8da4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
components/List.tsx
View file

@ -50,7 +50,7 @@ export function ListItemTitle<TComponent extends keyof JSX.IntrinsicElements = "
component, component,
{ {
...passThroughProps, ...passThroughProps,
className: classNames("text-sm font-medium text-neutral-900 truncate", props.className), className: classNames("font-cal text-sm font-medium text-neutral-900 truncate", props.className),
}, },
props.children props.children
); );

1
components/Shell.tsx
View file

@ -66,7 +66,6 @@ export function ShellSubHeading(props: {
return ( return (
<div className={classNames("block sm:flex justify-between mb-3", props.className)}> <div className={classNames("block sm:flex justify-between mb-3", props.className)}>
<div> <div>
{/* TODO should be Roboto */}
<h2 className="text-lg font-bold text-gray-900 flex items-center content-center space-x-2"> <h2 className="text-lg font-bold text-gray-900 flex items-center content-center space-x-2">
{props.title} {props.title}
</h2> </h2>

20
pages/integrations/index.tsx
View file

@ -171,7 +171,11 @@ function ConnectOrDisconnectIntegrationButton(props: {
); );
} }
if (!props.installed) { if (!props.installed) {
return <Alert severity="warning" title="Not installed" />; return (
<div className="h-12 -mt-1">
<Alert severity="warning" title="Not installed" />
</div>
);
} }
return ( return (
<ConnectIntegration type={props.type} render={(btnProps) => <Button {...btnProps}>Connect</Button>} /> <ConnectIntegration type={props.type} render={(btnProps) => <Button {...btnProps}>Connect</Button>} />
@ -187,11 +191,9 @@ function IntegrationListItem(props: {
}) { }) {
return ( return (
<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")}> <div className={classNames("flex flex-1 space-x-2 w-full p-4 items-center")}>
<div>
<Image width={40} height={40} src={`/${props.imageSrc}`} alt={props.title} /> <Image width={40} height={40} src={`/${props.imageSrc}`} alt={props.title} />
</div> <div className="pl-2 flex-grow">
<div className="flex-grow">
<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>
@ -257,6 +259,7 @@ export function CalendarSwitch(props: {
} }
); );
return ( return (
<div className="py-1">
<Switch <Switch
key={props.externalId} key={props.externalId}
name="enabled" name="enabled"
@ -266,6 +269,7 @@ export function CalendarSwitch(props: {
mutation.mutate({ isOn }); mutation.mutate({ isOn });
}} }}
/> />
</div>
); );
} }
@ -395,7 +399,11 @@ export default function IntegrationsPage() {
actions={ actions={
<ConnectIntegration <ConnectIntegration
type={item.type} type={item.type}
render={(btnProps) => <Button {...btnProps}>Connect</Button>} render={(btnProps) => (
<Button color="secondary" {...btnProps}>
Connect
</Button>
)}
/> />
} }
/> />