from last

1 files changed, 15 insertions, 14 deletions

diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index be9ab7960..a615d8b26 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -463,25 +463,26 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
         if (useRotation && docView) {
             const inkData = Cast(SelectionManager.Views().lastElement().rootDoc.data, InkField)?.inkData ?? [{ X: 0, Y: 0 }];
             const inkDoc = SelectionManager.Views().lastElement().layoutDoc;
+            const swidth = docView.screenToLocal().inverse().transformDirection(NumCast(seldoc.props.Document.strokeWidth, 1), NumCast(seldoc.props.Document.strokeWidth, 1));
 
             const points = inkData.map((point) => docView.screenToLocal().inverse().transformPoint(point.X, point.Y)).map(p => ({ X: p[0], Y: p[1] }));
 
-            const strokeWidth = 4;
-            const lineTop = Math.min(...points.map(p => p.Y));
-            const lineBottom = Math.max(...points.map(p => p.Y));
-            const lineLeft = Math.min(...points.map(p => p.X));
-            const lineRight = Math.max(...points.map(p => p.X));
-            const left = lineLeft - strokeWidth / 2;
-            const top = lineTop - strokeWidth / 2;
-            const right = lineRight + strokeWidth / 2;
-            const bottom = lineBottom + strokeWidth / 2;
+            const strokeWidth = 1;
+            const lineTop = Math.min(...points.map(p => p.Y)) - swidth[0] / 2;
+            const lineBottom = Math.max(...points.map(p => p.Y)) + swidth[0] / 2;
+            const lineLeft = Math.min(...points.map(p => p.X)) - swidth[0] / 2;
+            const lineRight = Math.max(...points.map(p => p.X)) + swidth[0] / 2;
+            const left = lineLeft;
+            const top = lineTop;
+            const right = lineRight;
+            const bottom = lineBottom;
             const width = Math.max(1, right - left);
             const height = Math.max(1, bottom - top);
-            const scaleX = width === strokeWidth ? 1 : (this.props.PanelWidth - strokeWidth) / (width - strokeWidth);
-            const scaleY = height === strokeWidth ? 1 : (this.props.PanelHeight - strokeWidth) / (height - strokeWidth);
+            const scaleX = width === strokeWidth ? 1 : (bounds.r - bounds.x) / (width - strokeWidth);
+            const scaleY = height === strokeWidth ? 1 : (bounds.b - bounds.y) / (height - strokeWidth);
 
             selectedLine = InteractionUtils.CreatePolyline(points, left, top, Colors.MEDIUM_BLUE, strokeWidth, strokeWidth, StrCast(inkDoc.strokeBezier), StrCast(inkDoc.fillColor, "none"),
-                StrCast(inkDoc.strokeStartMarker), StrCast(inkDoc.strokeEndMarker), StrCast(inkDoc.strokeDash), 1, 1, "", "none", 1.0, false);
+                StrCast(inkDoc.strokeStartMarker), StrCast(inkDoc.strokeEndMarker), StrCast(inkDoc.strokeDash), scaleX, scaleY, "", "none", 1.0, false);
         }
 
         return (<div className="documentDecorations" style={{ background: CurrentUserUtils.ActiveDashboard?.darkScheme ? "dimgray" : "" }} >
@@ -526,8 +527,8 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number, P
                 </div >
                 <div className="documentDecorations-inkstroke" style={{
                     position: "absolute",
-                    width: (bounds.r - bounds.x + this._resizeBorderWidth) + "px",
-                    height: (bounds.b - bounds.y + this._resizeBorderWidth) + "px",
+                    width: (bounds.r - bounds.x) + "px",
+                    height: (bounds.b - bounds.y) + "px",
                     left: bounds.x,
                     top: bounds.y,
                     overflow: "visible",