fix: Safari overflowing issues (#11385)

apps/web/pages/[user].tsx

@@ -154,7 +154,7 @@ export function UserPage(props: InferGetServerSidePropsType<typeof getServerSide
                       <div className="flex flex-wrap items-center">
                         <h2 className=" text-default pr-2 text-sm font-semibold">{type.title}</h2>
                       </div>
-                      <EventTypeDescription eventType={type} isPublic={true} />
+                      <EventTypeDescription eventType={type} isPublic={true} shortenDescription />
                     </Link>
                   </div>
                 </div>

packages/features/eventtypes/components/EventTypeDescription.tsx

@@ -47,7 +47,7 @@ export const EventTypeDescription = ({
           <div
             className={classNames(
               "text-subtle line-clamp-3 break-words py-1 text-sm sm:max-w-[650px] [&_a]:text-blue-500 [&_a]:underline [&_a]:hover:text-blue-600",
-              shortenDescription ? "line-clamp-4" : ""
+              shortenDescription ? "line-clamp-4 [&>*:not(:first-child)]:hidden" : ""
             )}
             dangerouslySetInnerHTML={{
               __html: eventType.descriptionAsSafeHTML || "",