DerexXD/UT-Registration-Plus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Fix popup drag hitbox (#216)

Browse Source 
* hotfix: Fix popup drag hitbox

Somehow, the drags get "lost" within a button element. Converting the parent container to a div works to fix this.

* refactor: Update styling
This commit is contained in:
Razboy20
2024-05-20 21:24:00 -05:00
committed by GitHub
parent 07cadb8c62
commit 7a40008c1e
2 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/components/common/ExtensionRoot/ExtensionRoot.module.scss
View File

@@ -13,4 +13,8 @@
.extensionRoot { .extensionRoot {
@apply font-sans h-full; @apply font-sans h-full;
color: #303030; color: #303030;
[data-rfd-drag-handle-context-id=':r1:'] {
cursor: move;
}
} }

8
src/views/components/common/PopupCourseBlock.tsx
View File

@@ -42,12 +42,12 @@ export default function PopupCourseBlock({
}; };
return ( return (
<button <div
style={{ style={{
backgroundColor: colors.primaryColor, backgroundColor: colors.primaryColor,
}} }}
className={clsx( className={clsx(
'h-full w-full inline-flex items-center justify-center gap-1 rounded pr-3 cursor-pointer focusable text-left', 'h-full w-full inline-flex items-center justify-center gap-1 rounded pr-3 focusable cursor-pointer text-left',
className className
)} )}
onClick={handleClick} onClick={handleClick}
@@ -56,7 +56,7 @@ export default function PopupCourseBlock({
style={{ style={{
backgroundColor: colors.secondaryColor, backgroundColor: colors.secondaryColor,
}} }}
className='flex cursor-move items-center self-stretch rounded rounded-r-0' className='flex items-center self-stretch rounded rounded-r-0 cursor-move!'
{...dragHandleProps} {...dragHandleProps}
> >
<DragIndicatorIcon className='h-6 w-6 text-white' /> <DragIndicatorIcon className='h-6 w-6 text-white' />
@@ -75,6 +75,6 @@ export default function PopupCourseBlock({
<StatusIcon status={course.status} className='h-5 w-5' /> <StatusIcon status={course.status} className='h-5 w-5' />
</div> </div>
)} )}
</button> </div>
); );
} }