fix: no more blurry countdown

src/modules/note/components/CacheAllNote.vue

@@ -19,16 +19,7 @@ const confirmBeforeCachingAllNotes = async () => {
       class="progress progress-accent w-56"
       :max="totalOfNotes"
     ></progress>
-    <div>
+    <div class="numeric">{{ noteCompleted }}/{{ totalOfNotes }}</div>
-      <span class="countdown">
-        <span
-          :style="{ '--value': noteCompleted }"
-          aria-live="polite"
-          :aria-label="`${noteCompleted}`"
-          >{{ noteCompleted }}</span
-        ></span
-      >/{{ totalOfNotes }}
-    </div>
   </div>
   <button v-else class="button" @click="() => confirmBeforeCachingAllNotes()">
     <svg
@@ -56,4 +47,8 @@ const confirmBeforeCachingAllNotes = async () => {
 .cache-all-notes {
   text-align: center;
 }
+
+.numeric {
+  font-family: "Courier Prime", monospace;
+}
 </style>