From 57d9ecf3284c6e7a7484eacd563fdfb4488e3a54 Mon Sep 17 00:00:00 2001 From: Prem Kishore Pachouri Date: Sat, 12 Nov 2022 22:00:06 +0530 Subject: [PATCH] Resolved an issue related with Underline @fchasen I am using epubjs in my react application where I tried to impliment underline feature of epubjs. below are the problems which I was facing: Unable to set color of underline After marking as underline, rectangle shape is created like below image After these changes: Able to pass color of underline by setting below css .epubjs-ul { stroke: red; stroke-width: 2px; stroke-linecap: square; stroke-opacity: 0.8; } Below are the output: image --- src/marks.js | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/src/marks.js b/src/marks.js index 0aa17c4..d6f4b1e 100644 --- a/src/marks.js +++ b/src/marks.js @@ -176,14 +176,6 @@ export class Underline extends Highlight { for (var i = 0, len = filtered.length; i < len; i++) { var r = filtered[i]; - var rect = svg.createElement('rect'); - rect.setAttribute('x', r.left - offset.left + container.left); - rect.setAttribute('y', r.top - offset.top + container.top); - rect.setAttribute('height', r.height); - rect.setAttribute('width', r.width); - rect.setAttribute('fill', 'none'); - - var line = svg.createElement('line'); line.setAttribute('x1', r.left - offset.left + container.left); line.setAttribute('x2', r.left - offset.left + container.left + r.width); @@ -191,11 +183,8 @@ export class Underline extends Highlight { line.setAttribute('y2', r.top - offset.top + container.top + r.height - 1); line.setAttribute('stroke-width', 1); - line.setAttribute('stroke', 'black'); //TODO: match text color? line.setAttribute('stroke-linecap', 'square'); - docFrag.appendChild(rect); - docFrag.appendChild(line); }