search

ezl / todo

0 stars 0 forks source link

color selection modal placement? is there a solution? #77

Closed ezl closed 2 years ago

ezl commented 2 years ago

https://www.loom.com/share/e170b82b3ff44b8cafada5641c5901d9

yassinya commented 2 years ago

Off the top of my head, automatically scrolling down to show the rest of the modal could be a solution. What do think @ezl

ezl commented 2 years ago

I didn't look at the code, but I'm guessing that what's happening is that:

  1. there's a component for color selection
  2. which is inside a component for the tag settings
  3. which is inside a component for the settings

so when the color selection component becomes visible, it's inside the containing element of the parent.

Is that what's happening?

If so, what about popping it out of the DOM with position? (Could be a bad idea too, so please push back if this is difficult or a bad idea)

thoughts @yassinya

yassinya commented 2 years ago

@ezl you’re right, we should be able to do this by extracting the modal and making it a direct child of TagColorCustomizationMenu component then display it when a particular tag is selected.

This way, it’ll always appear in the center of the component regardless of current scroll position.

Currently, in order to display color options menu next to each tag, every tag has its own dropdown menu nested within its container.

ezl commented 2 years ago

@yassinya - i see that the problem of the color selectionbeing rendered off the visible area is solved, but i don't feel like this is the best solution. for now, I'm still marking this as complete, but I think in the future I'd like to think more about how to do this.

I created the new ticket: #85 -- Please read and comment. I think I'll also just want to think about the UX a bit more before we make a decision, so now this is no longer "assigned" for immediate execution though.