Skip to content

Commit

Permalink
Fixes for scss
Browse files Browse the repository at this point in the history
  • Loading branch information
nidaqg committed Nov 1, 2024
1 parent 910f021 commit fe3d96d
Show file tree
Hide file tree
Showing 2 changed files with 1 addition and 20 deletions.
16 changes: 1 addition & 15 deletions playbook/app/pb_kits/playbook/pb_draggable/_draggable.scss
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,8 @@
.pb_draggable_item:hover {
cursor: grab;
}
&.active_container {
background-color: rgba(0, 0, 0, 0.05);
}
}

.pb_draggable_placeholder {
background-color: #e0e0e0;
border: 2px dashed #999;
margin: 4px 0;
border-radius: 4px;
}

.pb_draggable_item {
&.is_dragging {
opacity: 0.5;
position: relative;
z-index: 1000;
}
background-color: rgba($neutral, $opacity_5);
}
5 changes: 0 additions & 5 deletions playbook/app/pb_kits/playbook/pb_draggable/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -70,10 +70,8 @@ export default class PbDraggable extends PbEnhancedElement {
const targetIndex = items.indexOf(targetItem);

if (draggedIndex !== -1 && targetIndex !== -1) {
// Remove existing placeholder
this.placeholder.remove();

// Insert placeholder based on mouse position
const rect = targetItem.getBoundingClientRect();
const midpoint = rect.top + rect.height / 2;

Expand All @@ -97,7 +95,6 @@ export default class PbDraggable extends PbEnhancedElement {
if (container) {
container.classList.add("active_container");

// Handle empty container
if (!container.querySelector('.pb_draggable_item:not(.is_dragging)')) {
container.appendChild(this.placeholder);
}
Expand All @@ -112,15 +109,13 @@ export default class PbDraggable extends PbEnhancedElement {
container.classList.remove("active_container");
this.draggedItem.style.opacity = '1';

// Replace placeholder with dragged item
if (this.placeholder.parentNode) {
this.placeholder.parentNode.insertBefore(this.draggedItem, this.placeholder);
this.placeholder.remove();
} else {
container.appendChild(this.draggedItem);
}

// Trigger custom event
const customEvent = new CustomEvent('pb-draggable-reorder', {
detail: {
itemId: this.draggedItemId,
Expand Down

0 comments on commit fe3d96d

Please sign in to comment.