feat: Redefine Parent applications Classes to fit layout style proper…

…ties - MEED-7094 - Meeds-io/MIPs#144 (#1011)

This change will apply **application-body** class to the main body of
applications to make sure to apply layout specific CSS styles, such as
disabling default Vuetify White Background applied on v-card. At the
same time, for Top Toolbar applications, this will disable branding
styling to avoid having border radius and other styles applied on small
buttons added in Top bar as applications.

notes-webapp/src/main/webapp/vue-app/note-page-view/components/NotePageEdit.vue

@@ -19,7 +19,7 @@
 
 -->
 <template>
-  <div>
+  <div class="d-flex flex-column">
     <v-card
       v-if="fixedToolbar"
       :min-height="richEditorToolbarHeight"
@@ -32,7 +32,7 @@
       :instance-id="richEditorId"
       :toolbar-location="isSmall && 'bottom' || 'top'"
       :large-toolbar="!isSmall"
-      class="no-border-recursive"
+      class="no-border-recursive flex-grow-1"
       @ready="$root.$emit('notes-editor-ready')"
       @unloaded="$root.$emit('notes-editor-unloaded')" />
     <div

notes-webapp/src/main/webapp/vue-app/note-page-view/components/NotePageViewApp.vue

@@ -29,8 +29,7 @@
         }"
         min-width="100%"
         max-width="100%"
-        min-height="60"
-        class="d-flex flex-column border-box-sizing position-relative card-border-radius app-background-color"
+        class="d-flex flex-column border-box-sizing position-relative application-body"
         flat>
         <template v-if="edit">
           <note-page-edit-drawer
@@ -43,7 +42,7 @@
             ref="editor"
             :class="editorBackgroundLoading && 'position-absolute l-0 r-0'"
             :style="editorBackgroundLoading && 'z-index: -1;'"
-            class="full-width"
+            class="full-width full-height"
             @saved="closeEditor"
             @cancel="closeEditor" />
         </template>
@@ -56,7 +55,7 @@
           <note-page-view
             v-if="hasNote"
             :class="editorLoading && 'opacity-8 filter-blur-1'"
-            class="full-width overflow-hidden pa-1" />
+            class="full-width full-height overflow-hidden pa-1" />
         </template>
       </v-card>
     </v-hover>

notes-webapp/src/main/webapp/vue-app/notes/components/NotesOverview.vue

@@ -6,7 +6,7 @@
     <div>
       <div
         v-if="isAvailableNote"
-        class="notes-application card-border-radius app-background-color pa-5"
+        class="notes-application application-body pa-5"
         ref="content">
         <div class="notes-application-header">
           <div class="notes-title d-flex justify-space-between pb-4 ps-1">