Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

custom styling causing drag between line in incorrect position #338

Open
kherP opened this issue Feb 16, 2024 · 4 comments
Open

custom styling causing drag between line in incorrect position #338

kherP opened this issue Feb 16, 2024 · 4 comments
Assignees

Comments

@kherP
Copy link
Contributor

kherP commented Feb 16, 2024

Describe the bug
A clear and concise description of what the bug is.

  • when rendering item using the renderItem props, the dragbetweenline component is off the position

To Reproduce
Steps to reproduce the behavior:

  1. render item using renderItem and add vertical padding to the component
  2. when drag one of the items over the nested list, see the dragbetweenline component is off position

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.
Screenshot 2024-02-16 at 4 09 07 PM

Desktop (please complete the following information):

  • OS: [e.g. iOS] macOs
  • Browser [e.g. chrome, safari] chrome
  • Version [e.g. 22] Version 120.0.6099.129 (Official Build) (arm64)

Smartphone (please complete the following information):

  • Device: [e.g. iPhone6]
  • OS: [e.g. iOS8.1]
  • Browser [e.g. stock browser, safari]
  • Version [e.g. 22]

Additional context
Add any other context about the problem here.

@kherP
Copy link
Contributor Author

kherP commented Feb 20, 2024

i'm currently using fixed position with some calculation to overcome this issue

@lukasbach
Copy link
Owner

It looks like the drag line just expands downward from the center between the items by the height of the line. If possible, you should be able to just move the line up with CSS by the fixed amount that the line has in height. For example, in the sample style, the line has a height of 4px, and is moved back up by css by 2px to recenter it.

@AustinMKerr
Copy link

I have the same issue essentially. my nodes don't have consistent height. and it seems to plot the spaces for them based on the hard coded height @--rct-item-height

this makes the drag and drop unstable very frustrating as I've put a lot of time setting this up for my use case and added the dynamically displayed elements as a last action I figured would be fast. but I was mistaken. my bad for not testing all functionality before moving forward. this is such a great library though!

image

@lukasbach
Copy link
Owner

Hi Austin, yes, RCT doesn't currently support elements of varying heights at the moment. Thank you very much for your contribution in the linked PR, I left some comments on your proposed changes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants