added new data attr in order to exclude elements from the draggable preview

gitbutler-ui/src/lib/utils/draggable.ts

@@ -96,6 +96,13 @@ export function cloneWithPreservedDimensions(node: any) {
 
 export function cloneWithRotation(node: any) {
 	const clone = node.cloneNode(true) as HTMLElement;
+
+	// exclude all ignored elements from the clone
+	const ignoredElements = clone.querySelectorAll('[data-remove-from-draggable]');
+	ignoredElements.forEach((element) => {
+		element.remove();
+	});
+
 	applyGhostStyle(clone);
 
 	// Style the inner node so it retains the shape and then rotate

gitbutler-ui/src/routes/[projectId]/components/BranchCard.svelte

@@ -158,21 +158,6 @@
 					}
 				}}
 			/>
-			<!-- <div
-				class="branch-card__sections"
-				use:dropzone={{
-					hover: 'cherrypick-dz-hover',
-					active: 'cherrypick-dz-active',
-					accepts: acceptCherrypick,
-					onDrop: onCherrypicked
-				}}
-				use:dropzone={{
-					hover: 'lane-dz-hover',
-					active: 'lane-dz-active',
-					accepts: acceptBranchDrop,
-					onDrop: onBranchDrop
-				}}
-			> -->
 			<!-- DROPZONES -->
 			<DropzoneOverlay class="cherrypick-dz-marker" label="Apply here" />
 			<DropzoneOverlay class="lane-dz-marker" label="Move here" />
@@ -268,7 +253,6 @@
 				{readonly}
 			/>
 		</div>
-		<!-- </div> -->
 	</ScrollableContainer>
 
 	<Resizer
@@ -303,7 +287,8 @@
 	.branch-card__contents {
 		display: flex;
 		flex-direction: column;
-		gap: var(--space-6);
+		padding-top: 20px;
+		gap: var(--space-4);
 		padding: var(--space-16) var(--space-8) var(--space-16) var(--space-8);
 	}
 

gitbutler-ui/src/routes/[projectId]/components/BranchHeader.svelte

@@ -136,12 +136,9 @@
 			{/if}
 		</div>
 	</div>
-	<div class="header__top-overlay" />
+	<div class="header__top-overlay" data-remove-from-draggable />
 </div>
 
-<!-- </div>
-</div> -->
-
 <style lang="postcss">
 	.header__wrapper {
 		z-index: 10;