From 76186770b54fbdb928083ab71f6c5bdbdc957600 Mon Sep 17 00:00:00 2001
From: philipp lang <philipp@aweos.de>
Date: Mon, 8 Apr 2024 20:44:50 +0200
Subject: [PATCH] Fix html layout

---
 src/components/Content.vue | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/src/components/Content.vue b/src/components/Content.vue
index 7874de0..d8332f3 100644
--- a/src/components/Content.vue
+++ b/src/components/Content.vue
@@ -1,22 +1,19 @@
 <template>
     <div class="text-sm leading-normal text-gray-800 sm:text-base prose">
         <template v-for="block in modelValue.blocks" :key="block.id">
-            <h2 class="font-arvo text-primary" v-if="block.type === 'heading' && block.data.level === 2"
-                v-text="block.data.text"></h2>
-            <h3 class="font-arvo text-primary" v-if="block.type === 'heading' && block.data.level === 3"
-                v-text="block.data.text"></h3>
-            <h4 class="font-arvo text-primary" v-if="block.type === 'heading' && block.data.level === 4"
-                v-text="block.data.text"></h4>
+            <h2 class="font-arvo text-primary" v-if="block.type === 'heading' && block.data.level === 2" v-text="block.data.text"></h2>
+            <h3 class="font-arvo text-primary" v-if="block.type === 'heading' && block.data.level === 3" v-text="block.data.text"></h3>
+            <h4 class="font-arvo text-primary" v-if="block.type === 'heading' && block.data.level === 4" v-text="block.data.text"></h4>
             <div v-if="block.type === 'paragraph'" v-html="block.data.text"></div>
             <ul v-if="block.type === 'list' && block.data.style === 'unordered'">
                 <li v-for="(item, index) in block.data.items" :key="index">
-                    <span v-text="item.content"></span>
+                    <span v-html="item.content"></span>
                     <ul v-if="item.items.length">
                         <li v-for="(sitem, sindex) in item.items" :key="`${index}-${sindex}`">
-                            <span v-text="sitem.content"></span>
+                            <span v-html="sitem.content"></span>
                             <ul v-if="sitem.items.length">
                                 <li v-for="(ssitem, ssindex) in sitem.items" :key="`${index}-${sindex}-${ssindex}`">
-                                    <span v-text="ssitem.content"></span>
+                                    <span v-html="ssitem.content"></span>
                                 </li>
                             </ul>
                         </li>
@@ -31,8 +28,7 @@
 const props = defineProps({
     modelValue: {
         required: true,
-        validator: (value) =>
-            typeof value === "object" && Object.keys(value).includes("blocks"),
+        validator: (value) => typeof value === 'object' && Object.keys(value).includes('blocks'),
     },
 });
 </script>