fix: calendar styles (#1612)

Author: lukasvinclav

src/unfold/static/unfold/css/styles.css

@@ -509,29 +509,33 @@ fieldset details[open] > summary:after {
 /*******************************************************
  Calendar
  *******************************************************/
+.calendarbox .calendar {
+  @apply min-h-[320px];
+}
+
 .calendarbox,
 .clockbox {
-  @apply bg-white border border-base-200 rounded-default shadow-xs text-base-500 text-sm w-80 z-50 dark:bg-base-800 dark:border-base-700 fixed! left-1/2! top-1/2! -translate-x-1/2 -translate-y-1/2;
+  @apply bg-white border border-base-200 rounded-default shadow-xs w-80 z-50 dark:bg-base-800 dark:border-base-700 fixed! left-1/2! top-1/2! -translate-x-1/2 -translate-y-1/2;
 }
 
 .calendar caption {
-  @apply font-medium mb-3 py-3 text-base-700 dark:text-base-200;
+  @apply font-semibold mb-3 py-3 text-important;
 }
 
 .calendar table {
   @apply mb-3 w-full;
 }
 
 .calendar table th {
-  @apply font-medium text-center text-base-700 text-xs dark:text-base-200;
+  @apply font-semibold text-center text-important text-xs;
 }
 
 .calendar table td {
   @apply h-10 p-1 text-center w-10;
 }
 
 .calendar table td a {
-  @apply block flex h-8 items-center justify-center rounded-full transition-all w-8 dark:text-base-300;
+  @apply block flex h-8 items-center justify-center rounded-full w-8 dark:text-base-300;
 }
 
 .calendar table td a:hover {
@@ -547,7 +551,7 @@ fieldset details[open] > summary:after {
 }
 
 .calendar-shortcuts a {
-  @apply border border-base-200  font-medium leading-none mx-1 px-2 py-2 rounded-default shadow-xs text-center text-base-500 text-xs transition-all w-1/3 dark:border-base-700 dark:hover:border-base-600 dark:text-base-300 dark:hover:text-base-200;
+  @apply border border-base-200 font-medium leading-none mx-1 px-2 py-2 rounded-default shadow-xs text-center text-base-500 text-xs w-1/3 dark:border-base-700 dark:text-base-300 ;
 }
 
 .calendar-cancel {
@@ -558,28 +562,25 @@ fieldset details[open] > summary:after {
   @apply absolute block ml-2 mt-2 left-0 text-[0px] top-0;
 }
 
-.calendarnav-next:after,
-.calendarnav-previous:after {
-  @apply border border-base-200 flex h-7 items-center justify-center material-symbols-outlined rounded-full text-base-400 transition-all w-7 hover:border-primary-600 hover:text-primary-500 dark:bg-base-800 dark:border-base-700 dark:hover:border-base-800;
+.calendarnav-next,
+.calendarnav-previous {
+  @apply after:border after:border-base-200 after:flex after:h-7 after:items-center after:justify-center after:material-symbols-outlined after:rounded-full after:transition-all after:w-7 dark:after:bg-base-800 dark:after:border-base-700;
+}
 
+.calendarnav-previous:after {
   content: "navigate_before";
   display: flex;
 }
 
-.calendarnav-next:hover:after,
-.calendarnav-previous:hover:after {
-  @apply dark:border-base-600 dark:text-base-200;
+.calendarnav-next:after {
+  content: "navigate_next";
+  display: flex;
 }
 
 .calendarnav-next {
   @apply absolute block mr-2 mt-2 right-0 text-[0px] top-0;
 }
 
-.calendarnav-next:after {
-  content: "navigate_next";
-  display: flex;
-}
-
 /*******************************************************
  Timepicker
  *******************************************************/