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

Selection mark disappear #64

Open
zRains opened this issue Apr 10, 2022 · 4 comments
Open

Selection mark disappear #64

zRains opened this issue Apr 10, 2022 · 4 comments

Comments

@zRains
Copy link
Contributor

zRains commented Apr 10, 2022

before i customs text color

image

when i click the input element, selection mark disappear, but the color can still change normally.

image

actually, click the toolbar will take same effect.

@peterpeterparker
Copy link
Owner

Not sure how to solve this. When user focus the input field, the selection is applied to the input. Therefore the text is not displayed as selected anymore unless the user enter a valid color in which case I redo the selection and modify the color. This does not happen in your example because the text entered is not a valid color.

So yeah, not sure exactly how to solve it. If you have an idea, go for the PR 🚀

@viraladmin
Copy link

This is how you solve it. Notice you can highlight text, click the input area causing focus to be lost, while keeping text highlighted.

https://jsfiddle.net/cp6L291g/135/

I am not good enough to implement such a solution myself, but in case you actually want to solve that the solution is at provided link. :)

@zRains
Copy link
Contributor Author

zRains commented May 5, 2022

This is how you solve it. Notice you can highlight text, click the input area causing focus to be lost, while keeping text highlighted.

https://jsfiddle.net/cp6L291g/135/

I am not good enough to implement such a solution myself, but in case you actually want to solve that the solution is at provided link. :)

Thanks a lot. Unfortunately jsfiddle was blocked in my country. I fixed it through Selection and Range, with a lot break changes.

@peterpeterparker
Copy link
Owner

https://jsfiddle.net/cp6L291g/135/

Unfortunately this isn't a valid solution for Stylo. This gist copy the selection and modify the DOM when the user is typing within the input field to give the feeling the text is still selected.

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