Added rich text to event description

app/components/calendar/event/Details.vue

@@ -160,8 +160,8 @@ function deployDeleteModal() {
       <template v-if="event.description">
         <hr class="border-border mt-2" >
 
-        <div class="max-h-48 overflow-y-auto mt-2 text-sm text-slate-600 dark:text-slate-300">
-          {{ event.description }}
+        <div class="max-h-48 overflow-y-auto mt-2 text-sm opacity-80">
+          <div class="content-editor" v-html="event.description" />
         </div>
       </template>
     </div>

app/components/calendar/form/CreateEvent.vue

@@ -74,14 +74,11 @@ function handleCancel() {
       </div>
 
       <div class="col-span-2 my-2 pl-8">
-        <textarea
-          id="new-event-description"
+        <InputEditor
+          disable-blocks
           v-model="eventSkeleton.description"
-          name="new-event-description"
-          :placeholder="$t('entity.addDescription')"
-          :maxlength="1200"
-          class="w-full -my-1 py-1 -mx-1 px-1 min-h-24 max-h-36 text-sm border-b-[1px] bg-transparent focus-visible:outline-hidden focus-visible:border-primary invalid:border-destructive"
         />
+
         <div class="mt-2 mb-1 text-xs opacity-50">
           {{ t('entity.calendar.event.patterns.description') }}
         </div>

app/components/calendar/form/UpdateEvent.vue

@@ -92,14 +92,11 @@ function handleCancel() {
       </div>
 
       <div class="col-span-2 my-2 ml-8">
-        <textarea
-          id="new-event-description"
+        <InputEditor
+          disable-blocks
           v-model="eventSkeleton.description"
-          name="new-event-description"
-          :placeholder="$t('entity.addDescription')"
-          :maxlength="1200"
-          class="w-full -my-1 py-1 -mx-1 px-1 min-h-24 max-h-36 text-sm border-b-[1px] bg-transparent focus-visible:outline-hidden focus-visible:border-primary invalid:border-destructive"
         />
+
         <div class="mt-2 mb-1 text-xs opacity-50">
           {{ t('entity.calendar.event.patterns.description') }}
         </div>

app/components/calendar/search/lists/EventCallout.vue

@@ -113,9 +113,7 @@ const dateDuration = computed<string | null>(() => props.event.endDate ? getRela
 
     <div v-if="event.description" class="text-xs md:text-sm">
       <hr class="my-3 md:my-2 border-white opacity-50" >
-      <span class="opacity-75">
-        {{ event.description }}
-      </span>
+      <div class="content-editor opacity-75" v-html="event.description" />
     </div>
   </button>
 </template>