text flag customization

adding color, add it to docs

readme.md

@@ -119,6 +119,15 @@ You can change the emoji in `emojiCursor`'s emoji with the `emoji` option (a lis
 new cursoreffects.emojiCursor({ emoji: ["🔥", "🐬", "🦆"] });
 ```
 
+### textFlag
+
+You can change the  `textFlag`'s text with the `text` option (String),
+and color of the text with the `color` (an array)
+
+```js
+ new textFlag({element: targetElement, text: "test",color:["#FF6800"]});
+```
+
 ## Accessibility
 
 The cursor won't display if the user's system accessibility settings have [prefers-reduced-motion](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion) enabled.

src/textFlag.js

@@ -8,6 +8,8 @@ export function textFlag(options) {
   let element = hasWrapperEl || document.body;
 
   let text = cursorOptions.text ? " " + options.text : " Your Text Here";
+  let color = options?.color || "#000000";
+
 
   let font = cursorOptions.font || "monospace";
   let textSize = cursorOptions.textSize || 12;
@@ -119,6 +121,7 @@ export function textFlag(options) {
       charArray[i].x = charArray[i - 1].x + gap;
       charArray[i].y = charArray[i - 1].y;
 
+      context.fillStyle = color;
       context.font = fontFamily;
       context.fillText(charArray[i].letter, charArray[i].x, charArray[i].y);
     }