beter add button

src/app/course/[courseName]/calendar/day/DayTitle.tsx

@@ -71,9 +71,34 @@ export function DayTitle({ day, dayAsDate }: { day: string; dayAsDate: Date }) {
         )}
       </ClientOnly>
       <Modal
+        buttonComponent={({ openModal }) => (
+          <svg
+            viewBox="0 0 24 24"
+            width={22}
+            height={22}
+            className="cursor-pointer hover:scale-125 hover:stroke-slate-300 stroke-slate-400 transition-all m-0.5"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+            onClick={openModal}
+          >
+            <g id="SVGRepo_bgCarrier" stroke-width="0"></g>
+            <g
+              id="SVGRepo_tracerCarrier"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+            ></g>
+            <g id="SVGRepo_iconCarrier">
+              <path
+                d="M6 12H18M12 6V18"
+                className=" "
+                stroke-width="3"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              ></path>
+            </g>
+          </svg>
+        )}
         modalControl={modal}
-        buttonText="+"
-        buttonClass="unstyled hover:font-bold hover:scale-125 px-1 mb-auto mt-0 pt-0"
         modalWidth="w-135"
       >
         {({ closeModal }) => (