fix(annotator): adjust underline position to the center of two lines, closes #2772 (#2793)

2025-12-26 16:51:02 +08:00
parent 12d284cd22
commit 674fed5230
3 changed files with 7 additions and 6 deletions
@@ -261,13 +261,14 @@ const Annotator: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      const node = range.startContainer;
      const el = node.nodeType === 1 ? node : node.parentElement;
      const { writingMode, lineHeight, fontSize } = defaultView.getComputedStyle(el);
-      const lineHeightValue =
-        parseFloat(lineHeight) || viewSettings.lineHeight * viewSettings.defaultFontSize;
      const fontSizeValue = parseFloat(fontSize) || viewSettings.defaultFontSize;
+      const lineHeightValue = parseFloat(lineHeight) || viewSettings.lineHeight * fontSizeValue;
      const strokeWidth = 2;
+      const verticalCompensation = appService?.isMobile ? 0 : -1;
+      const horizontalCompensation = appService?.isMobile ? -1 : 0;
      const padding = viewSettings.vertical
-        ? (lineHeightValue - fontSizeValue - strokeWidth) / 2
-        : strokeWidth;
+        ? (lineHeightValue - fontSizeValue) / 2 - strokeWidth + verticalCompensation
+        : (lineHeightValue - fontSizeValue) / 2 - strokeWidth + horizontalCompensation;
      draw(Overlayer[style as keyof typeof Overlayer], { writingMode, color: hexColor, padding });
    }
  };
@@ -201,7 +201,7 @@ const TranslatorPopup: React.FC<TranslatorPopupProps> = ({
            </div>
          )}
        </div>
-        <div className='absolute bottom-0 flex h-8 w-full items-center justify-between bg-gray-600 px-4'>
+        <div className='absolute bottom-0 flex h-8 w-full items-center justify-between px-4'>
          <div className='line-clamp-1 text-xs opacity-60'>
            {provider &&
              !loading &&