Revert "feat(cupang): 드래그 조작감 개선 — 핸들·플레이스홀더·오토스크롤"
This reverts commit 47e09b94d7.
This commit is contained in:
+1
-49
@@ -596,7 +596,7 @@
|
||||
}
|
||||
|
||||
/* ② 요약: 카드가 드래그 가능함을 알린다 */
|
||||
.cpg-sum-prod.is-draggable, .cpg-box-card.is-draggable { cursor: pointer; }
|
||||
.cpg-sum-prod.is-draggable, .cpg-box-card.is-draggable { cursor: grab; }
|
||||
.cpg-sum-prod.is-draggable:hover, .cpg-box-card.is-draggable:hover {
|
||||
border-color: var(--color-rich-black);
|
||||
}
|
||||
@@ -695,51 +695,3 @@ body.cpg-dragging { cursor: grabbing; user-select: none; }
|
||||
/* 드래그 중일 때 ③ 영역을 강조 — 어디에 놓아야 하는지 보이게 */
|
||||
.cpg-dist-card.is-drop-ready { outline: 2px dashed var(--color-rich-black); outline-offset: 2px; }
|
||||
.cpg-dist-card.is-drop-ready .cpg-dist-center { border-color: var(--color-midtone-gray); }
|
||||
|
||||
/* 드래그 핸들 / 플레이스홀더 / 고스트 배지 */
|
||||
.cpg-drag-handle {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 4px;
|
||||
border-radius: 5px;
|
||||
color: var(--color-midtone-gray);
|
||||
cursor: grab;
|
||||
touch-action: none; /* 모바일에서 스크롤 제스처와 충돌 방지 */
|
||||
user-select: none;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
.cpg-drag-handle:hover { background: var(--color-ghost-gray); color: var(--color-rich-black); }
|
||||
body.cpg-dragging .cpg-drag-handle { cursor: grabbing; }
|
||||
|
||||
.cpg-drop-placeholder {
|
||||
margin-top: 6px;
|
||||
padding: 8px;
|
||||
border: 1.5px dashed var(--color-rich-black);
|
||||
border-radius: 8px;
|
||||
font-size: 12px;
|
||||
color: var(--color-rich-black);
|
||||
background: var(--color-ghost-gray);
|
||||
animation: cpg-ph-in .15s ease-out;
|
||||
}
|
||||
@keyframes cpg-ph-in {
|
||||
from { opacity: 0; transform: translateY(-4px); }
|
||||
to { opacity: 1; transform: none; }
|
||||
}
|
||||
|
||||
.cpg-drag-badge {
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
padding: 2px 8px;
|
||||
border-radius: 999px;
|
||||
background: var(--color-rich-black);
|
||||
color: var(--color-canvas-white);
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.cpg-drag-ghost.is-invalid { border-color: var(--color-callout-red); }
|
||||
.cpg-drag-ghost.is-invalid .cpg-drag-badge { background: var(--color-callout-red); }
|
||||
|
||||
Reference in New Issue
Block a user