Fix/email responsive bug (#6901)

* fix: prevent overflow of url

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>

* fix: manage link responsive in emails

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>

---------

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>

packages/emails/src/components/ManageLink.tsx

@@ -23,25 +23,37 @@ export function ManageLink(props: { calEvent: CalendarEvent; attendee: Person })
           style={{
             fontWeight: 400,
             lineHeight: "24px",
-            display: "flex",
-            justifyContent: "center",
+            textAlign: "center",
             width: "100%",
-            gap: "8px",
           }}>
           <>{t("need_to_make_a_change")}</>
+
           {!props.calEvent.recurringEvent && (
-            <>
+            <span>
               <a
                 href={getRescheduleLink(props.calEvent)}
-                style={{ color: "#374151", marginLeft: "5px", marginRight: "5px" }}>
+                style={{
+                  color: "#374151",
+                  marginLeft: "5px",
+                  marginRight: "5px",
+                  textDecoration: "underline",
+                }}>
                 <>{t("reschedule")}</>
               </a>
               <>{t("or_lowercase")}</>
-            </>
+            </span>
           )}
-          <a href={getCancelLink(props.calEvent)} style={{ color: "#374151", marginLeft: "5px" }}>
+          <span>
+            <a
+              href={getCancelLink(props.calEvent)}
+              style={{
+                color: "#374151",
+                marginLeft: "5px",
+                textDecoration: "underline",
+              }}>
               <>{t("cancel")}</>
             </a>
+          </span>
         </p>
       </div>
     );