backup

frontend/app/components/viewer/TopBar.vue

@@ -21,7 +21,7 @@ import TopSearchBar from './topbar/TopSearchBar.vue';
     flex-shrink: 0;
     min-height: 40px;
     width: 100%;
-    background-color: var(--top-bar-background-color);
+    background-color: var(--color-background-light);
     display: flex;
 }
 

frontend/app/components/viewer/content/NoteContainer.vue

@@ -1,8 +1,7 @@
 <script setup>
 import { ref, onMounted } from 'vue';
 import Note from './Note.vue';
-
-const emitter = useEmitter();
+import { emitter } from '~/services/Emitter';
 
 let noteData = ref([]);
 
@@ -61,6 +60,7 @@ emitter.on("delete-note", (key) => {
     height: 100%;
     margin: 0;
     height: 100%;
+    background-color: var(--color-background);
 }
 </style>
 

frontend/app/components/viewer/statusbar/FetchStatus.vue

@@ -1,6 +1,7 @@
 <script setup>
 import { ref,onMounted } from 'vue';
-const emitter = useEmitter();
+import { emitter } from '~/services/Emitter';
+
 
 const statusIcon = ref(null);
 const statusMessage = ref(null);

frontend/app/components/viewer/statusbar/StatusBar.vue

@@ -22,7 +22,7 @@ import FetchStatus from './FetchStatus.vue';
     min-height: 24px;
     max-height: 24px;
     width: 100%;
-    background-color: var(--top-bar-background-color);
+    background-color: var(--color-background-light);
     display: flex;
     font-size: 14px;
 }