From 9a4746844fa23e1ff2d6f0bfb5315c197497e621 Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@gmail.com>
Date: Fri, 14 Oct 2022 19:04:54 +0100
Subject: [PATCH] fixed booking page padding (#5009)

---
 apps/web/components/booking/AvailableTimes.tsx         | 2 +-
 apps/web/components/booking/pages/AvailabilityPage.tsx | 4 ++--
 packages/ui/v2/modules/booker/DatePicker.tsx           | 6 +++++-
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/apps/web/components/booking/AvailableTimes.tsx b/apps/web/components/booking/AvailableTimes.tsx
index 1a8d73185a..7d55b70292 100644
--- a/apps/web/components/booking/AvailableTimes.tsx
+++ b/apps/web/components/booking/AvailableTimes.tsx
@@ -57,7 +57,7 @@ const AvailableTimes: FC<AvailableTimesProps> = ({
           {date.toDate().toLocaleString(i18n.language, { month: "long" })}
         </span>
       </div>
-      <div className="grid flex-grow grid-cols-1 gap-x-2 overflow-y-auto sm:block md:h-[364px]">
+      <div className="-mb-5 grid flex-grow grid-cols-1 gap-x-2 overflow-y-auto sm:block md:h-[364px]">
         {slots.length > 0 &&
           slots.map((slot) => {
             type BookingURL = {
diff --git a/apps/web/components/booking/pages/AvailabilityPage.tsx b/apps/web/components/booking/pages/AvailabilityPage.tsx
index be007cceef..0260a2db2e 100644
--- a/apps/web/components/booking/pages/AvailabilityPage.tsx
+++ b/apps/web/components/booking/pages/AvailabilityPage.tsx
@@ -401,7 +401,7 @@ const AvailabilityPage = ({ profile, eventType }: Props) => {
       <div>
         <main
           className={classNames(
-            "flex flex-col",
+            "flex-col md:mx-4 lg:flex",
             shouldAlignCentrally ? "items-center" : "items-start",
             !isEmbed && classNames("mx-auto my-0 ease-in-out md:my-24")
           )}>
@@ -412,7 +412,7 @@ const AvailabilityPage = ({ profile, eventType }: Props) => {
                 isBackgroundTransparent
                   ? ""
                   : "dark:bg-darkgray-100 sm:dark:border-darkgray-300 bg-white pb-4 md:pb-0",
-                "border-bookinglightest overflow-hidden rounded-md md:border",
+                "border-bookinglightest overflow-hidden md:rounded-md md:border",
                 isEmbed && "mx-auto"
               )}>
               <div className="overflow-hidden md:flex">
diff --git a/packages/ui/v2/modules/booker/DatePicker.tsx b/packages/ui/v2/modules/booker/DatePicker.tsx
index a2ce860038..3f24ae32c7 100644
--- a/packages/ui/v2/modules/booker/DatePicker.tsx
+++ b/packages/ui/v2/modules/booker/DatePicker.tsx
@@ -54,7 +54,11 @@ export const Day = ({
       data-disabled={props.disabled}
       {...props}>
       {date.date()}
-      {date.isToday() && <span className="absolute left-0 bottom-0 mx-auto -mb-px w-full text-4xl">.</span>}
+      {date.isToday() && (
+        <span className="absolute left-0 bottom-0 mx-auto -mb-px w-full text-4xl md:-bottom-1 lg:bottom-0">
+          .
+        </span>
+      )}
     </button>
   );
 };