diff --git a/resources/views/rd/planning-design/index.blade.php b/resources/views/rd/planning-design/index.blade.php index 81d7d037..04bf04d6 100644 --- a/resources/views/rd/planning-design/index.blade.php +++ b/resources/views/rd/planning-design/index.blade.php @@ -598,9 +598,14 @@ } .sb-wireframe-content:focus { border-color: var(--pc-indigo); } .sb-wireframe-img { max-width: 100%; border-radius: 8px; } +.sb-desc-resizer { + height: 5px; flex-shrink: 0; cursor: row-resize; background: #1e293b; + transition: background .15s; +} +.sb-desc-resizer:hover, .sb-desc-resizer.active { background: #818cf8; } .sb-desc-panel { - border-top: 2px solid #1e293b; padding: 12px 16px; background: #fafbfc; - max-height: 260px; overflow-y: auto; + padding: 12px 16px; background: #fafbfc; + overflow-y: auto; flex-shrink: 0; } .sb-desc-title { font-size: 10px; font-weight: 700; color: #1e293b; margin-bottom: 8px; @@ -633,6 +638,14 @@ align-items: center; justify-content: center; flex-shrink: 0; } .sb-desc-remove:hover { color: #ef4444; background: #fef2f2; } +.sb-desc-num { cursor: grab; } +.sb-desc-num:active { cursor: grabbing; } +/* Marker (description number badge on canvas) */ +.sb-blk-marker { + width: 28px; height: 28px; border-radius: 50%; background: #1e293b; color: #fff; + font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; + user-select: none; cursor: move; +} /* Block Editor (Wireframe) */ .sb-block-toolbar { @@ -1366,6 +1379,16 @@
+ {{-- Description Marker --}} +
+ + +
+
{{-- Template Dropdown --}}
@@ -1498,8 +1521,8 @@
+ @mousemove.window="if(_sbMenuResize){ sbMenuWidth = Math.max(80, Math.min(400, _sbMenuResize.startW + $event.clientX - _sbMenuResize.startX)); } if(_sbDescResize){ sbDescHeight = Math.max(60, Math.min(500, _sbDescResize.startH - ($event.clientY - _sbDescResize.startY))); }" + @mouseup.window="if(_sbMenuResize){ _sbMenuResize = null; document.querySelector('.sb-menu-resizer.active')?.classList.remove('active'); } if(_sbDescResize){ _sbDescResize = null; document.querySelector('.sb-desc-resizer.active')?.classList.remove('active'); }"> {{-- Left Menu --}}
@@ -1531,7 +1554,9 @@ @mousemove="sbCanvasMouseMove($event)" @mouseup="sbCanvasMouseUp($event)" @click.self="if(!_sbLassoDone){ sbSelectedBlock = null; sbMultiSelected = []; } _sbLassoDone = false;" - style="min-height: 600px;"> + @dragover.prevent="$event.dataTransfer.dropEffect = 'copy'" + @drop.prevent="sbDropMarker($event)" + style="min-height: 600px; flex: 1;"> {{-- Lasso rectangle --}}
@@ -1741,16 +1766,27 @@
+ + {{-- Marker (description number) --}} +
+ {{-- Desc Resizer --}} +
{{-- Description Panel --}} -
+
Description