fix: navbar zoom

src/components/widgets/navbar/Notes.jsx

@@ -6,6 +6,7 @@ import TextareaAutosize from '@mui/material/TextareaAutosize';
 import { toast } from 'react-toastify';
 import Tooltip from '../../helpers/tooltip/Tooltip';
 import { saveFile } from 'modules/helpers/settings/modals';
+import EventBus from 'modules/helpers/eventbus';
 
 class Notes extends PureComponent {
   constructor() {
@@ -17,6 +18,25 @@ class Notes extends PureComponent {
     };
   }
 
+  setZoom() {
+    this.setState({
+      zoomFontSize: Number(((localStorage.getItem('zoomNavbar') || 100) / 100) * 1.2) + "rem"
+    })
+  }
+
+  componentDidMount() {
+    EventBus.on('refresh', (data) => {
+      if (data === 'navbar' || data === 'background') {
+        this.forceUpdate();
+        try {
+          this.setZoom();
+        } catch (e) {}
+      }
+    });
+
+    this.setZoom();
+  }
+
   setNotes = (e) => {
     localStorage.setItem('notes', e.target.value);
     this.setState({
@@ -70,7 +90,7 @@ class Notes extends PureComponent {
           onFocus={() => this.showNotes()}
           onBlur={() => this.hideNotes()}
           ref={this.props.notesRef}
-          style={{ fontSize: this.props.fontSize }}
+          style={{ fontSize: this.state.zoomFontSize }}
         >
           <MdAssignment className="topicons"/>
         </button>

src/components/widgets/navbar/Todo.jsx

@@ -12,6 +12,7 @@ import Tooltip from '../../helpers/tooltip/Tooltip';
 import Checkbox from '@mui/material/Checkbox';
 import { shift, useFloating } from '@floating-ui/react-dom';
 import { sortableContainer, sortableElement } from 'react-sortable-hoc';
+import EventBus from 'modules/helpers/eventbus';
 
 const SortableItem = sortableElement(({ value }) => <div>{value}</div>);
 const SortableContainer = sortableContainer(({ children }) => <div>{children}</div>);
@@ -32,6 +33,25 @@ class Todo extends PureComponent {
     };
   }
 
+  setZoom() {
+    this.setState({
+      zoomFontSize: Number(((localStorage.getItem('zoomNavbar') || 100) / 100) * 1.2) + "rem"
+    })
+  }
+
+  componentDidMount() {
+    EventBus.on('refresh', (data) => {
+      if (data === 'navbar' || data === 'background') {
+        this.forceUpdate();
+        try {
+          this.setZoom();
+        } catch (e) {}
+      }
+    });
+
+    this.setZoom();
+  }
+
   arrayMove(array, oldIndex, newIndex) {
     const result = Array.from(array);
     const [removed] = result.splice(oldIndex, 1);
@@ -120,7 +140,7 @@ class Todo extends PureComponent {
           onFocus={() => this.hideTodo()}
           onBlur={() => this.showTodo()}
           ref={this.props.todoRef}
-          style={{ fontSize: this.props.fontSize }}
+          style={{ fontSize: this.state.zoomFontSize }}
         >
           <MdChecklist className="topicons" />
         </button>