Browse Source

Fix instant selection in channels on iOS Safari

master
Eduard Kuzmenko 4 years ago
parent
commit
84efdd6398
  1. 4
      src/components/chat/contextMenu.ts
  2. 9
      src/components/chat/selection.ts
  3. 6
      src/scss/partials/_chatBubble.scss

4
src/components/chat/contextMenu.ts

@ -117,9 +117,9 @@ export default class ChatContextMenu {
if(chat.selection.isSelecting) return; if(chat.selection.isSelecting) return;
// * these two lines will fix instant text selection on iOS Safari // * these two lines will fix instant text selection on iOS Safari
attachTo.classList.add('no-select'); document.body.classList.add('no-select'); // * need no-select on body because chat-input transforms in channels
attachTo.addEventListener('touchend', () => { attachTo.addEventListener('touchend', () => {
attachTo.classList.remove('no-select'); document.body.classList.remove('no-select');
}, {once: true}); }, {once: true});
cancelSelection(); cancelSelection();

9
src/components/chat/selection.ts

@ -252,7 +252,16 @@ export default class ChatSelection {
// ! CANCEL USER SELECTION ! // ! CANCEL USER SELECTION !
cancelSelection(); cancelSelection();
} }
}/* else {
if(!wasSelecting) {
bubblesContainer.classList.add('no-select');
setTimeout(() => {
cancelSelection();
bubblesContainer.classList.remove('no-select');
cancelSelection();
}, 100);
} }
} */
blurActiveElement(); // * for mobile keyboards blurActiveElement(); // * for mobile keyboards

6
src/scss/partials/_chatBubble.scss

@ -238,9 +238,13 @@ $bubble-margin: .25rem;
transition: .2s transform; transition: .2s transform;
user-select: none; user-select: none;
html.no-touch .bubbles:not(.is-selecting) &, /* html.no-touch .bubbles:not(.is-selecting) &,
html.is-touch .bubbles.is-selecting:not(.no-select) & { html.is-touch .bubbles.is-selecting:not(.no-select) & {
user-select: text; user-select: text;
} */
html.no-touch .bubbles:not(.is-selecting) &,
html.is-touch body:not(.no-select) .bubbles.is-selecting & { // * need no-select on body because chat-input transforms in channels
user-select: text;
} }
@include respond-to(not-handhelds) { @include respond-to(not-handhelds) {

Loading…
Cancel
Save