fix(ui): free block resize edges

main
AlexsandrSnytkin 13 hours ago
parent 92c81cbbf3
commit d6016ccf6d

@ -1317,6 +1317,9 @@ HTML = """<!doctype html>
body[data-card-style="flat"] .config-canvas > .config-block { box-shadow: none; border-radius: 8px; } body[data-card-style="flat"] .config-canvas > .config-block { box-shadow: none; border-radius: 8px; }
body[data-card-style="neon"] .config-canvas > .config-block { border-color: color-mix(in srgb, var(--ui-accent) 48%, var(--ui-border)) !important; box-shadow: 0 0 0 1px color-mix(in srgb, var(--ui-accent) 12%, transparent), 0 10px 24px color-mix(in srgb, var(--ui-accent) 10%, transparent); } body[data-card-style="neon"] .config-canvas > .config-block { border-color: color-mix(in srgb, var(--ui-accent) 48%, var(--ui-border)) !important; box-shadow: 0 0 0 1px color-mix(in srgb, var(--ui-accent) 12%, transparent), 0 10px 24px color-mix(in srgb, var(--ui-accent) 10%, transparent); }
.config-canvas > .config-block { cursor: grab; touch-action: none; } .config-canvas > .config-block { cursor: grab; touch-action: none; }
.config-canvas > .config-block, .network-block { scrollbar-width: none; }
.config-canvas > .config-block::-webkit-scrollbar, .network-block::-webkit-scrollbar { width: 0; height: 0; }
.config-canvas > .config-block::after, .network-block::after { content: ""; position: absolute; right: 4px; bottom: 4px; z-index: 4; width: 13px; height: 13px; border-right: 2px solid color-mix(in srgb, var(--ui-accent) 62%, transparent); border-bottom: 2px solid color-mix(in srgb, var(--ui-accent) 62%, transparent); border-radius: 0 0 3px 0; opacity: .7; pointer-events: none; }
.config-canvas > .config-block:hover { border-color: color-mix(in srgb, var(--ui-accent) 45%, var(--ui-border)) !important; } .config-canvas > .config-block:hover { border-color: color-mix(in srgb, var(--ui-accent) 45%, var(--ui-border)) !important; }
.config-canvas > .config-block.is-selected { border-color: color-mix(in srgb, var(--ui-accent) 70%, var(--ui-border)) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--ui-accent) 12%, transparent), 0 6px 18px rgba(0, 0, 0, .1); } .config-canvas > .config-block.is-selected { border-color: color-mix(in srgb, var(--ui-accent) 70%, var(--ui-border)) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--ui-accent) 12%, transparent), 0 6px 18px rgba(0, 0, 0, .1); }
.config-canvas > .config-block.is-dragging, .config-canvas > .config-block.is-resizing { z-index: 5; border-color: var(--ui-accent) !important; box-shadow: 0 10px 28px color-mix(in srgb, var(--ui-accent) 16%, transparent); transition: none; } .config-canvas > .config-block.is-dragging, .config-canvas > .config-block.is-resizing { z-index: 5; border-color: var(--ui-accent) !important; box-shadow: 0 10px 28px color-mix(in srgb, var(--ui-accent) 16%, transparent); transition: none; }
@ -2465,7 +2468,7 @@ HTML = """<!doctype html>
} }
function configResizeEdge(event, block) { function configResizeEdge(event, block) {
const rect = block.getBoundingClientRect(); const rect = block.getBoundingClientRect();
const edge = 9; const edge = 14;
const left = event.clientX - rect.left <= edge; const left = event.clientX - rect.left <= edge;
const right = rect.right - event.clientX <= edge; const right = rect.right - event.clientX <= edge;
const top = event.clientY - rect.top <= edge; const top = event.clientY - rect.top <= edge;
@ -2985,7 +2988,7 @@ HTML = """<!doctype html>
} }
function networkResizeEdge(event, block) { function networkResizeEdge(event, block) {
const rect = block.getBoundingClientRect(); const rect = block.getBoundingClientRect();
const edge = 9; const edge = 14;
const left = event.clientX - rect.left <= edge; const left = event.clientX - rect.left <= edge;
const right = rect.right - event.clientX <= edge; const right = rect.right - event.clientX <= edge;
const top = event.clientY - rect.top <= edge; const top = event.clientY - rect.top <= edge;

Loading…
Cancel
Save