peterpeterparker/stylo

Colors don't close

Closed this issue · 2 comments

I don't think this is the same issue as being discussed on the other thread, but if it is feel free to close. I notice nothing short of a right click closes the color box modal when its opened.

To reproduce visit https://stylojs.com/, highlight text, select the color tool, change the color of text. The modal does not close. Click elsewhere on the page, the modal does not close. Start typing again in the editor and still the modal does not close. right click and the modal now closes.

Again, this is above my ability but I have been trying to figure out where to place the code cause I think I know the solution.

In my mind the modal should be closed upon one of three events.

  1. User clicking button to select color
  2. onkeyup event of the input box if input.length == 7 (pound sign + 6 numbers)
  3. user pressing esc key to close box

So far I have the following:

Line :104 and 111 on src/components/color/color/color.tsx

I added document.querySelector('stylo-toolbar').shadowRoot.querySelector('.tools').classList.remove('tools-activated');

image

image

This closes the color toolbox, but it does not reset the other tools - which still only happens when right clicking. I have not figured out how to reset the toolbar.

Any suggestions would be great.

Thanks for the issue. Solved in #82.