From 4267c9063b9b936cef0f0580b4b4d1f0448ed0d5 Mon Sep 17 00:00:00 2001
From: Jeroen Reumkens <hello@jeroenreumkens.nl>
Date: Thu, 4 May 2023 11:53:50 +0100
Subject: [PATCH] CAL-1556: Alignment of current day dot in datepicker. (#8663)

---
 packages/features/calendars/DatePicker.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/features/calendars/DatePicker.tsx b/packages/features/calendars/DatePicker.tsx
index 5ef4b0d7d5..53a31852c7 100644
--- a/packages/features/calendars/DatePicker.tsx
+++ b/packages/features/calendars/DatePicker.tsx
@@ -44,6 +44,7 @@ export const Day = ({
   active: boolean;
   date: Dayjs;
 }) => {
+  const { t } = useLocale();
   const enabledDateButtonEmbedStyles = useEmbedStyles("enabledDateButton");
   const disabledDateButtonEmbedStyles = useEmbedStyles("disabledDateButton");
   return (
@@ -64,7 +65,9 @@ export const Day = ({
       {...props}>
       {date.date()}
       {date.isToday() && (
-        <span className="absolute left-0 right-0 bottom-0 h-2/5 align-middle text-4xl leading-[0rem]">.</span>
+        <span className="absolute left-1/2 top-1/2 flex h-[5px] w-[5px] translate-y-[8px] -translate-x-1/2 items-center justify-center rounded-full bg-white align-middle sm:translate-y-[12px]">
+          <span className="sr-only">{t("today")}</span>
+        </span>
       )}
     </button>
   );