refactor: use bare CSS to override builtin cursor animation

Author: kotaindah55

main.ts

@@ -55,7 +55,6 @@ export default class AnimatedCursorPlugin extends Plugin {
 
 		_iterMarkdownView(this.app, view => {
 			let cursorPlugin = hookCursorPlugin(view.editor.cm);
-			cursorPlugin?.dom.style.setProperty("animation-name", "cm-blink");
 			cursorPlugin?.dom.removeClass("cm-blinkLayer");
 		});
 
@@ -80,11 +79,6 @@ export default class AnimatedCursorPlugin extends Plugin {
 		this.originalLayerConfig = patchCursorPlugin(cursorPlugin);
 		this.alreadyPatched = true;
 
-		_iterMarkdownView(this.app, view => {
-			let cursorPlugin = hookCursorPlugin(view.editor.cm);
-			cursorPlugin?.dom.style.removeProperty("animation-name");
-		});
-
 		// Detach the handler after a successful attemp.
 		this.app.workspace.off("active-leaf-change", this.tryPatch);
 	}

styles.css

@@ -56,7 +56,7 @@ settings:
     }
     &>.cm-scroller>.cm-layer.cm-cursorLayer {
         &.cm-blinkLayer {
-            animation-name: cm-cursor-blink;
+            animation-name: cm-cursor-blink !important;
             animation-duration: calc(var(--cursor-blink-rate) / 2) !important;
             animation-timing-function: var(--cursor-blink-easing);
             animation-direction: alternate-reverse;
@@ -66,7 +66,9 @@ settings:
             }
         }
         &:not(.cm-blinkLayer) {
-            animation: none;
+            animation-name: none !important;
+            animation-duration: 0 !important;
+            animation: none !important;
         }
         &>.cm-cursor {
             transition-property: top, left, height;