Merged in feature/VBV-377-umsetzung-das-lernst-du-in-diese (pull request #93)

Umsetzung: das lernst du in diesem Circle

Approved-by: Christian Cueni

client/src/pages/learningPath/circlePage/CircleOverview.vue

@@ -11,15 +11,28 @@ const emit = defineEmits(["closemodal"]);
 </script>
 
 <template>
-  <!-- eslint-disable vue/no-v-html -->
   <ItFullScreenModal :show="show" @closemodal="emit('closemodal')">
     <div v-if="circle" class="container-medium">
-      <h1 class="">Überblick: Circle «{{ circle.title }}»</h1>
+      <h2 data-cy="lc-title">Überblick: Circle «{{ circle.title }}»</h2>
 
-      <div class="mt-8 border p-4">
-        <div class="text-large" v-html="circle.goals"></div>
-      </div>
+      <!-- eslint-disable vue/no-v-html -->
+      <div
+        v-if="circle.goals"
+        class="default-wagtail-rich-text my-4"
+        v-html="circle.goals"
+      ></div>
     </div>
+    <nav class="nav absolute bottom-0 left-0 w-full border-t px-6 py-4">
+      <div class="relative z-10 flex flex-row place-content-end bg-white">
+        <button
+          type="button"
+          class="btn-blue z-10 flex items-center"
+          @click="emit('closemodal')"
+        >
+          {{ $t("general.close") }}
+        </button>
+      </div>
+    </nav>
   </ItFullScreenModal>
 </template>
 

server/vbv_lernwelt/learnpath/models.py

@@ -84,7 +84,7 @@ class Circle(CourseBasePage):
 
     description = models.TextField(default="", blank=True)
 
-    goals = RichTextField()
+    goals = RichTextField(features=DEFAULT_RICH_TEXT_FEATURES_WITH_HEADER)
 
     content_panels = Page.content_panels + [
         FieldPanel("description"),