addded padding to sticky nav, temp removed TODAY from /booking (#4278)
parent
a8c1851c04
commit
f7119849db
|
@ -61,16 +61,13 @@ export function AvailabilityForm(props: inferQueryOutput<"viewer.availability.sc
|
|||
...values,
|
||||
});
|
||||
}}
|
||||
className="-mx-5 flex flex-col sm:mx-0 xl:flex-row">
|
||||
className="-mx-4 flex flex-col pb-16 sm:mx-0 xl:flex-row xl:space-x-6">
|
||||
<div className="flex-1">
|
||||
<div className="rounded-md border border-gray-200 bg-white px-4 py-5 sm:p-6">
|
||||
<div className="rounded-md border-gray-200 bg-white px-4 py-5 sm:border sm:p-6">
|
||||
<h3 className="mb-5 text-base font-medium leading-6 text-gray-900">{t("change_start_end")}</h3>
|
||||
<Schedule />
|
||||
</div>
|
||||
<div className="space-x-2 pt-4 text-right sm:pt-2">
|
||||
<Button color="secondary" href="/availability" tabIndex={-1}>
|
||||
{t("cancel")}
|
||||
</Button>
|
||||
<div className="flex justify-end px-4 pt-4 sm:px-0">
|
||||
<Button>{t("save")}</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -114,14 +111,10 @@ export function AvailabilityForm(props: inferQueryOutput<"viewer.availability.sc
|
|||
className="focus:border-brand mt-1 block w-full rounded-md border-gray-300 text-sm"
|
||||
/>
|
||||
</div>
|
||||
<div className="mt-6 rounded-md border border-gray-200 px-4 py-5 sm:p-6">
|
||||
<h3 className="text-base font-medium leading-6 text-gray-900">
|
||||
{t("something_doesnt_look_right")}
|
||||
</h3>
|
||||
<div className="mt-2 max-w-xl text-sm text-gray-500">
|
||||
<p>{t("troubleshoot_availability")}</p>
|
||||
</div>
|
||||
<div className="mt-5">
|
||||
<hr className="my-8" />
|
||||
<div className="rounded-md">
|
||||
<h3 className="text-sm font-medium text-gray-900">{t("something_doesnt_look_right")}</h3>
|
||||
<div className="mt-3 flex">
|
||||
<Button href="/availability/troubleshoot" color="secondary">
|
||||
{t("launch_troubleshooter")}
|
||||
</Button>
|
||||
|
|
|
@ -89,7 +89,10 @@ export default function Bookings() {
|
|||
{query.status === "success" && !isEmpty && (
|
||||
<div className="pt-2 xl:mx-6 xl:pt-0">
|
||||
<WipeMyCalActionButton bookingStatus={status} bookingsEmpty={isEmpty} />
|
||||
<p className="pb-3 text-xs font-medium capitalize leading-4 text-gray-500">{t("today")}</p>
|
||||
{/* TODO: add today only for the current day
|
||||
<p className="pb-3 text-xs font-medium uppercase leading-4 text-gray-500">{t("today")}</p>
|
||||
*/}
|
||||
|
||||
<div className="overflow-hidden rounded-md border border-gray-200">
|
||||
<table className="w-full">
|
||||
<tbody className="divide-y divide-gray-200 bg-white" data-testid="bookings">
|
||||
|
|
|
@ -53,7 +53,7 @@ const HorizontalTabItem = ({ name, href, tabName, ...props }: HorizontalTabItemP
|
|||
<a
|
||||
onClick={onClick}
|
||||
className={classNames(
|
||||
isCurrent ? "bg-gray-200 text-gray-900" : " text-gray-600 hover:bg-gray-100 hover:text-gray-900 ",
|
||||
isCurrent ? "bg-gray-200 text-gray-900" : " text-gray-600 hover:bg-gray-100 hover:text-gray-900 ",
|
||||
"mb-2 inline-flex items-center justify-center whitespace-nowrap rounded-md py-[10px] px-4 text-sm font-medium leading-4 md:mb-0",
|
||||
props.disabled && "pointer-events-none !opacity-30",
|
||||
props.className
|
||||
|
|
|
@ -18,10 +18,12 @@ const NavTabs: FC<NavTabProps> = ({ tabs, className = "", sticky, ...props }) =>
|
|||
<nav
|
||||
className={classNames(
|
||||
`no-scrollbar flex flex-col space-y-1 overflow-scroll ${className}`,
|
||||
sticky && "sticky top-0"
|
||||
sticky && "sticky top-0 -mt-7"
|
||||
)}
|
||||
aria-label="Tabs"
|
||||
{...props}>
|
||||
{/* padding top for sticky */}
|
||||
{sticky && <div className="pt-6" />}
|
||||
{props.children}
|
||||
{tabs.map((tab, idx) => (
|
||||
<VerticalTabItem {...tab} key={idx} />
|
||||
|
|
Loading…
Reference in New Issue