Sticker: Prevent dragging (#2363)

src/components/common/CustomEmoji.module.scss

@@ -33,15 +33,12 @@
   border-radius: var(--custom-emoji-border-radius) !important;
 }
 
-.highlightCatch {
+.highlight-catch {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   user-select: auto !important;
-}
-
-.altEmoji {
-  opacity: 0;
+  z-index: 1;
 }

src/components/common/StickerView.module.scss

@@ -10,14 +10,14 @@
   &:global(.closing) {
     transition-delay: 150ms;
   }
-
-  &_opaque {
-    background: var(--thumbs-background);
-    transition-delay: 0s;
-  }
 }
 
-.noTransition {
+.thumb-opaque {
+  background: var(--thumbs-background);
+  transition-delay: 0s;
+}
+
+.no-transition {
   transition: none !important;
 }
 

src/components/common/StickerView.tsx

@@ -132,11 +132,12 @@ const StickerView: FC<OwnProps> = ({
         className={buildClassName(
           styles.thumb,
           noTransition && styles.noTransition,
-          isThumbOpaque && styles.thumb_opaque,
+          isThumbOpaque && styles.thumbOpaque,
           thumbClassName,
           thumbClassNames,
         )}
         alt=""
+        draggable={false}
       />
       {isLottie ? (
         <AnimatedSticker
@@ -178,6 +179,7 @@ const StickerView: FC<OwnProps> = ({
           className={buildClassName(styles.media, fullMediaClassName, fullMediaClassNames)}
           src={fullMediaData}
           alt={emoji}
+          draggable={false}
         />
       )}
     </>