diff --git a/service.js b/service.js
index 0e0b581..adaa471 100644
--- a/service.js
+++ b/service.js
@@ -57,6 +57,7 @@ class BesService {
     this.hostElement.setAttribute('data-gramm', 'false')
     this.hostElement.setAttribute('data-gramm_editor', 'false')
     this.hostElement.setAttribute('data-enable-grammarly', 'false')
+    this.textFont = window.getComputedStyle(this.textElement).fontFamily
 
     this.onScroll = this.onScroll.bind(this)
     this.hostElement.addEventListener('scroll', this.onScroll)
@@ -340,6 +341,13 @@ class BesService {
       const width = rect.width * dpr
       const height = rect.height * dpr
 
+      // MOCKUP text drawing
+      this.ctx.font = `5px ${this.textFont}` // Font se lahko doda na sledeč način: `25px 'Times New Roman', serif`
+      const text = 'To je izmišljeno besedilo'
+      const textLength = this.ctx.measureText(text)
+      console.log(`Dolžina texta: ${textLength.width}px`) // Dolžina texta
+      this.ctx.fillText(text, x, y)
+
       // Draw the underline
       this.ctx.beginPath()
       this.ctx.moveTo(x, y + height)
@@ -459,12 +467,7 @@ class BesService {
    * @param {*} match Grammar checking rule match
    */
   highlightMistake(match) {
-    // document.querySelectorAll('.bes-mistake-highlight-selected').forEach(el => {
-    //   el.classList.remove('bes-mistake-highlight-selected')
-    // })
-    // match.highlights.forEach(h =>
-    //   h.classList.add('bes-mistake-highlight-selected')
-    // )
+    console.log(match)
   }
 
   /**