fix: Presenter Notes with Click Markers are difficult to see in dark mode (#2299)

Author: Slinetrac

packages/client/internals/NoteDisplay.vue

@@ -148,20 +148,20 @@ watchEffect(() => {
   <div
     v-if="noteHtml"
     ref="noteDisplay"
-    class="prose overflow-auto outline-none slidev-note"
+    class="prose dark:prose-invert overflow-auto outline-none slidev-note"
     :class="[props.class, withClicks ? 'slidev-note-with-clicks' : '']"
     v-html="noteHtml"
   />
   <div
     v-else-if="note"
-    class="prose overflow-auto outline-none slidev-note"
+    class="prose dark:prose-invert overflow-auto outline-none slidev-note"
     :class="props.class"
   >
     <p v-text="note" />
   </div>
   <div
     v-else
-    class="prose overflow-auto outline-none opacity-50 italic select-none slidev-note"
+    class="prose dark:prose-invert overflow-auto outline-none opacity-50 italic select-none slidev-note"
     :class="props.class"
   >
     <p v-text="props.placeholder || 'No notes.'" />

packages/client/styles/index.css

@@ -83,6 +83,10 @@ html {
   color: #888888ab;
 }
 
+.dark .slidev-note-with-clicks .slidev-note-fade {
+  color: #a1a1a1ab;
+}
+
 .slidev-note-click-mark {
   user-select: none;
   font-size: 0.7em;