From 458406feaf376b49950051205ff7e3dedb4a3a5f Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@gmail.com>
Date: Wed, 7 Sep 2022 14:49:30 +0200
Subject: [PATCH] fixed booking navbar, fixed bookings buttons, fixed /success
 dark mode (#4230)

---
 apps/web/components/ui/TableActions.tsx                |  2 +-
 apps/web/pages/v2/success.tsx                          | 10 +++++-----
 packages/ui/v2/core/layouts/AppsLayout.tsx             |  2 +-
 packages/ui/v2/core/layouts/BookingLayout.tsx          |  2 +-
 .../ui/v2/core/navigation/tabs/VerticalTabItem.tsx     |  2 +-
 5 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/apps/web/components/ui/TableActions.tsx b/apps/web/components/ui/TableActions.tsx
index 24bb4b052b..9401571eae 100644
--- a/apps/web/components/ui/TableActions.tsx
+++ b/apps/web/components/ui/TableActions.tsx
@@ -72,7 +72,7 @@ const TableActions: FC<Props> = ({ actions }) => {
   });
   return (
     <>
-      <div className="hidden space-x-2 rtl:space-x-reverse lg:block">
+      <div className="hidden space-x-2 rtl:space-x-reverse lg:flex">
         {actions.map((action) => {
           const button = (
             <Button
diff --git a/apps/web/pages/v2/success.tsx b/apps/web/pages/v2/success.tsx
index 5f53903256..2f7128df49 100644
--- a/apps/web/pages/v2/success.tsx
+++ b/apps/web/pages/v2/success.tsx
@@ -261,7 +261,7 @@ export default function Success(props: SuccessProps) {
   const locationToDisplay = getSuccessPageLocationMessage(location, t);
 
   return (
-    <div className={isEmbed ? "" : "h-screen bg-neutral-100 dark:bg-neutral-900"} data-testid="success-page">
+    <div className={isEmbed ? "" : "h-screen"} data-testid="success-page">
       {userIsOwner && !isEmbed && (
         <div className="mt-2 ml-4 -mb-4">
           <Link href={eventType.recurringEvent?.count ? "/bookings/recurring" : "/bookings/upcoming"}>
@@ -289,7 +289,7 @@ export default function Success(props: SuccessProps) {
               <div
                 className={classNames(
                   "inline-block transform overflow-hidden rounded-lg border sm:my-8 sm:max-w-xl",
-                  isBackgroundTransparent ? "" : "bg-white dark:border-neutral-700 dark:bg-gray-800",
+                  isBackgroundTransparent ? "" : "dark:bg-darkgray-100 bg-white dark:border-neutral-700",
                   "px-8 pt-5 pb-4 text-left align-bottom transition-all sm:w-full sm:py-8 sm:align-middle"
                 )}
                 role="dialog"
@@ -333,7 +333,7 @@ export default function Success(props: SuccessProps) {
                   <div className="mt-3">
                     <p className="text-neutral-600 dark:text-gray-300">{getTitle()}</p>
                   </div>
-                  <div className="border-bookinglightest text-bookingdark mt-8 grid grid-cols-3 border-t pt-8 text-left dark:border-gray-900 dark:text-gray-300">
+                  <div className="border-bookinglightest text-bookingdark dark:border-darkgray-300 mt-8 grid grid-cols-3 border-t pt-8 text-left dark:text-gray-300">
                     <div className="font-medium">{t("what")}</div>
                     <div className="col-span-2 mb-6 last:mb-0">{eventName}</div>
                     <div className="font-medium">{t("when")}</div>
@@ -561,7 +561,7 @@ export default function Success(props: SuccessProps) {
                 {session === null && !(userIsOwner || props.hideBranding) && (
                   <>
                     <hr className="border-bookinglightest" />
-                    <div className="border-bookinglightest text-booking-lighter pt-8 text-center text-xs dark:border-gray-900 dark:text-white">
+                    <div className="border-bookinglightest text-booking-lighter dark:border-darkgray-300 pt-8 text-center text-xs dark:text-white">
                       <a href="https://cal.com/signup">{t("create_booking_link_with_calcom")}</a>
 
                       <form
@@ -577,7 +577,7 @@ export default function Success(props: SuccessProps) {
                           name="email"
                           id="email"
                           defaultValue={router.query.email}
-                          className="focus:border-brand border-bookinglightest mt-0 block w-full rounded-sm border-gray-300 shadow-sm focus:ring-black dark:border-gray-900 dark:bg-black dark:text-white sm:text-sm"
+                          className="focus:border-brand border-bookinglightest dark:border-darkgray-300 mt-0 block w-full rounded-sm border-gray-300 shadow-sm focus:ring-black dark:bg-black dark:text-white sm:text-sm"
                           placeholder="rick.astley@cal.com"
                         />
                         <Button size="lg" type="submit" className="min-w-max" color="primary">
diff --git a/packages/ui/v2/core/layouts/AppsLayout.tsx b/packages/ui/v2/core/layouts/AppsLayout.tsx
index b4229328dd..446e636031 100644
--- a/packages/ui/v2/core/layouts/AppsLayout.tsx
+++ b/packages/ui/v2/core/layouts/AppsLayout.tsx
@@ -22,7 +22,7 @@ export default function AppsLayout({
 }: { children: React.ReactNode } & ComponentProps<typeof Shell>) {
   return (
     <Shell {...rest}>
-      <div className="flex flex-col p-2 md:p-0 xl:flex-row ">
+      <div className="flex flex-col xl:flex-row ">
         <div className="block lg:hidden">
           <HorizontalTabs tabs={tabs} />
         </div>
diff --git a/packages/ui/v2/core/layouts/BookingLayout.tsx b/packages/ui/v2/core/layouts/BookingLayout.tsx
index 57cab522db..fb1f145b5f 100644
--- a/packages/ui/v2/core/layouts/BookingLayout.tsx
+++ b/packages/ui/v2/core/layouts/BookingLayout.tsx
@@ -43,7 +43,7 @@ export default function BookingLayout({
 }: { children: React.ReactNode } & ComponentProps<typeof Shell>) {
   return (
     <Shell {...rest}>
-      <div className="flex flex-col p-2 md:p-0 xl:flex-row ">
+      <div className="flex flex-col xl:flex-row ">
         <div className="hidden xl:block">
           <VerticalTabs tabs={tabs} sticky />
         </div>
diff --git a/packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx b/packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx
index f91447c2c5..5ca5120298 100644
--- a/packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx
+++ b/packages/ui/v2/core/navigation/tabs/VerticalTabItem.tsx
@@ -66,7 +66,7 @@ const VerticalTabItem: FC<VerticalTabItemProps> = ({ name, href, tabName, info,
               onClick={onClick}
               className={classNames(
                 props.textClassNames || "text-sm font-medium leading-none text-gray-600",
-                "group flex h-14 w-64 flex-row items-center rounded-md px-3 py-[10px] hover:bg-gray-100 group-hover:text-gray-700  [&[aria-current='page']]:bg-gray-200 [&[aria-current='page']]:text-gray-900",
+                "group flex w-64 flex-row items-center rounded-md px-3 py-[10px] hover:bg-gray-100 group-hover:text-gray-700  [&[aria-current='page']]:bg-gray-200 [&[aria-current='page']]:text-gray-900",
                 props.disabled && "pointer-events-none !opacity-30",
                 (isChild || !props.icon) && "ml-7 mr-5 w-auto",
                 !info ? "h-9" : "h-14",