Line break in the corner

[MRJCrunch]

Environments

• Framework name: N/A
• Framework version: N/A
• Moveable Component version: 0.51.1

Description

I want to change line thickness from 1px to 2px but after this style change I see a line break in the corner

.moveable-line.moveable-direction {
  height: 2px;
}

How can I avoid it?

[SidIcarus]

You'll have to modify the width/positioning of the lines to be +x/-x, where x is the height delta.

[daybrush]

@SidIcarus

• croact-moveable 0.8.0
• @moveable/helper 0.1.3
• lit-moveable 0.29.0
• moveable 0.52.0
• preact-moveable 0.54.0
• react-moveable 0.55.0
• svelte-moveable 0.44.0
• vue-moveable 2.0.0-beta.86
• vue3-moveable 0.27.0
• ngx-moveable 0.49.0

moveable' s new version is released.
Added line size calculation.

[MRJCrunch]

@daybrush thanks for the fix! It works well for 1px lines, but we set the height of rendering lines to 2px and it has a little break.

.moveable-line.moveable-direction {
    height: 2px !important;
 }

Can we fix it somehow?

[daybrush]

@daybrush

Because this calculates and sets CSS, it is difficult to support the problem of broken corners.