fix: Fix Note WYSIWYG style - MEED-2534 - Meeds-io/meeds#1102

Prior to this change, the Note editor content wasn't using the reset style classes for displaying Rich editor contents. This change will add those classes to ensure hamonizing the display of reach editors with other tools.
Meeds-io · Sep 19, 2023 · ab5489a · ab5489a
1 parent aa84ccf
commit ab5489a
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 9 deletions.
diff --git a/notes-webapp/src/main/webapp/javascript/eXo/wiki/ckeditor/plugins/ExoWikiPage.vue b/notes-webapp/src/main/webapp/javascript/eXo/wiki/ckeditor/plugins/ExoWikiPage.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="wiki-include-page" v-html="pageContent"></div>
+  <div class="wiki-include-page reset-style-box rich-editor-content" v-sanitized-html="pageContent"></div>
 </template>
 
 <script>

diff --git a/...tes/components/ExoNotesFavoriteAction.vue → ...p/notes/components/NoteFavoriteAction.vue b/...tes/components/ExoNotesFavoriteAction.vue → ...p/notes/components/NoteFavoriteAction.vue
diff --git a/notes-webapp/src/main/webapp/vue-app/notes/components/NotesOverview.vue b/notes-webapp/src/main/webapp/vue-app/notes/components/NotesOverview.vue
@@ -60,7 +60,7 @@
                 </v-tooltip>
               </div>
 
-              <exo-notes-favorite-action
+              <note-favorite-action
                 :note="note"
                 :activity-id="note.activityId" />
               <div
@@ -357,7 +357,7 @@ export default {
   computed: {
     notesContentProcessor() {
       return {
-        template: `<div>${this.formatContent(this.noteContent)}</div>`,
+        template: `<div class='reset-style-box rich-editor-content'>${this.formatContent(this.noteContent)}</div>`,
         data() {
           return {
             vTreeComponent: {

diff --git a/notes-webapp/src/main/webapp/vue-app/notes/initComponents.js b/notes-webapp/src/main/webapp/vue-app/notes/initComponents.js
@@ -6,7 +6,7 @@ import NoteImportDrawer from './components/NoteImportDrawer.vue';
 import AttachmentsNotesUploadInput from './components/importNotes/AttachmentsNotesUploadInput.vue';
 import AttachmentsUploadedNotes from './components/importNotes/AttachmentsNotesUploaded.vue';
 import AttachmentsNotesItem from './components/importNotes/AttachmentsNotesItem.vue';
-import ExoNotesFavoriteAction from './components/ExoNotesFavoriteAction.vue';
+import NoteFavoriteAction from './components/NoteFavoriteAction.vue';
 
 const components = {
   'notes-overview': NotesOverview,
@@ -17,7 +17,7 @@ const components = {
   'attachments-notes-upload-input': AttachmentsNotesUploadInput,
   'attachments-uploaded-notes': AttachmentsUploadedNotes,
   'attachments-notes-item': AttachmentsNotesItem,
-  'exo-notes-favorite-action': ExoNotesFavoriteAction
+  'note-favorite-action': NoteFavoriteAction
 };
 
 for (const key in components) {

diff --git a/notes-webapp/src/main/webapp/vue-app/wikiSearch/components/WikiSearchCard.vue b/notes-webapp/src/main/webapp/vue-app/wikiSearch/components/WikiSearchCard.vue
@@ -3,7 +3,7 @@
     class="wikiSearchCard d-flex flex-column border-radius box-shadow"
     flat
     min-height="227">
-    <exo-notes-favorite-action
+    <note-favorite-action
       :note="result"
       absolute
       top="0"
@@ -35,7 +35,7 @@
             <a
               :title="wikiTitleText"
               class="wikiTitle px-3 pt-2 pb-1 ps-0 text-start text-truncate"
-              v-html="wikiTitle">
+              v-sanitized-html="wikiTitle">
             </a>
           </v-list-item-title>
           <v-list-item-subtitle>

diff --git a/notes-webapp/src/main/webapp/vue-app/wikiSearch/initComponents.js b/notes-webapp/src/main/webapp/vue-app/wikiSearch/initComponents.js
@@ -1,9 +1,9 @@
 import WikiSearchCard from './components/WikiSearchCard.vue';
-import ExoNotesFavoriteAction from '../notes/components/ExoNotesFavoriteAction.vue';
+import NoteFavoriteAction from '../notes/components/NoteFavoriteAction.vue';
 
 const components = {
   'wiki-search-card': WikiSearchCard,
-  'exo-notes-favorite-action': ExoNotesFavoriteAction,
+  'note-favorite-action': NoteFavoriteAction,
 };
 
 for (const key in components) {