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

Minor style improvements + fixed nested button, DialogTrigger is a button

Browse source
This commit is contained in:
Alex van Andel 2021-08-03 23:28:12 +00:00
parent 4225016829
commit 97d727c620
1 changed files with 6 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
pages/event-types/index.tsx
View file

@ -60,13 +60,11 @@ export default function Availability({ user, types }) {
return <Loader />; return <Loader />;
} }
const CreateNewEventDialog = ( const CreateNewEventDialog = () => (
<Dialog> <Dialog>
<DialogTrigger> <DialogTrigger className="py-2 px-4 mt-6 border border-transparent rounded-sm shadow-sm text-sm font-medium text-white bg-neutral-900 hover:bg-neutral-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-neutral-900">
<button className="py-2 px-4 mt-6 border border-transparent rounded-sm shadow-sm text-sm font-medium text-white bg-neutral-900 hover:bg-neutral-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-neutral-900"> <PlusIcon className="w-5 h-5 mr-1 inline" />
<PlusIcon className="w-5 h-5 mr-1 inline" /> New event type
New event type
</button>
</DialogTrigger> </DialogTrigger>
<DialogContent> <DialogContent>
<div className="mb-4"> <div className="mb-4">
@ -170,7 +168,7 @@ export default function Availability({ user, types }) {
<Shell <Shell
heading="Event Types" heading="Event Types"
subtitle="Create events to share for people to book on your calendar." subtitle="Create events to share for people to book on your calendar."
CTA={types.length !== 0 && CreateNewEventDialog}> CTA={types.length !== 0 && <CreateNewEventDialog />}>
<div className="bg-white shadow overflow-hidden sm:rounded-sm -mx-4 sm:mx-0"> <div className="bg-white shadow overflow-hidden sm:rounded-sm -mx-4 sm:mx-0">
<ul className="divide-y divide-neutral-200"> <ul className="divide-y divide-neutral-200">
{types.map((type) => ( {types.map((type) => (
@ -591,7 +589,7 @@ export default function Availability({ user, types }) {
Event types enable you to share links that show available times on your calendar and allow Event types enable you to share links that show available times on your calendar and allow
people to make bookings with you. people to make bookings with you.
</p> </p>
{CreateNewEventDialog} <CreateNewEventDialog />
</div> </div>
</div> </div>
)} )}