robinparisi / tingle

⚡ 2kB vanilla modal plugin, no dependencies and easy-to-use
https://tingle.robinparisi.com
MIT License
1.55k stars 185 forks source link

Cannot select the texts in the modal #148

Closed ayaka14732 closed 3 years ago

ayaka14732 commented 3 years ago

I would like to create a modal with the texts in it selectable and copyable for users.

emmanuelballery commented 3 years ago

Hi @ayaka14732!

There is a CSS rule :

.tingle-modal {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

Change its value for :

.tingle-modal {
  -ms-user-select: text;
  -webkit-user-select: text;
  user-select: text;
}
ayaka14732 commented 3 years ago

Thank you, it works!

robinparisi commented 3 years ago

This was introduce with this commit: https://github.com/robinparisi/tingle/commit/05d9b93eee879013a0f55601281c3d71c9dd884d

By removing this, you will face problems like https://github.com/robinparisi/tingle/issues/96 and https://github.com/robinparisi/tingle/issues/98.

I'm starting to think that the JS solution would be better, as described here: https://github.com/robinparisi/tingle/issues/98#issuecomment-431599368

emmanuelballery commented 3 years ago

Lucky me! I've never encounter neither #96 nor #98 nor I have heard of it from my clients (on multiple platforms/os/browsers).

I'll add the beforeOpen snippet from https://github.com/robinparisi/tingle/issues/98#issuecomment-431599368 to be sure in the future.