diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/emoji_picker/emoji_picker.js | 7 | ||||
| -rw-r--r-- | src/components/emoji_picker/emoji_picker.scss | 19 | ||||
| -rw-r--r-- | src/components/emoji_picker/emoji_picker.vue | 20 | ||||
| -rw-r--r-- | src/components/status/status.vue | 19 | ||||
| -rw-r--r-- | src/services/entity_normalizer/entity_normalizer.service.js | 2 |
5 files changed, 3 insertions, 64 deletions
diff --git a/src/components/emoji_picker/emoji_picker.js b/src/components/emoji_picker/emoji_picker.js index d9d41bf6..bce5026e 100644 --- a/src/components/emoji_picker/emoji_picker.js +++ b/src/components/emoji_picker/emoji_picker.js @@ -17,7 +17,6 @@ const EmojiPicker = { keyword: '', activeGroup: 'custom', showingStickers: false, - zoomEmoji: false, spamMode: false } }, @@ -61,12 +60,6 @@ const EmojiPicker = { }, onStickerUploadFailed (e) { this.$emit('sticker-upload-failed', e) - }, - setZoomEmoji (e, emoji) { - this.zoomEmoji = emoji - const { x, y } = e.target.getBoundingClientRect() - this.$refs['zoom-portal'].style.left = (x - 32) + 'px' - this.$refs['zoom-portal'].style.top = (y - 32) + 'px' } }, watch: { diff --git a/src/components/emoji_picker/emoji_picker.scss b/src/components/emoji_picker/emoji_picker.scss index 7e76aa52..472db35b 100644 --- a/src/components/emoji_picker/emoji_picker.scss +++ b/src/components/emoji_picker/emoji_picker.scss @@ -10,21 +10,6 @@ margin: 0 !important; z-index: 1; - .zoom-portal { - position: fixed; - pointer-events: none; - width: 96px; - height: 96px; - font-size: 96px; - line-height: 96px; - z-index: 10; - img { - object-fit: contain; - width: 100%; - height: 100%; - } - } - .spam-mode { padding: 7px; line-height: normal; @@ -150,10 +135,6 @@ cursor: pointer; - &:hover { - opacity: 0 - } - img { object-fit: contain; max-width: 100%; diff --git a/src/components/emoji_picker/emoji_picker.vue b/src/components/emoji_picker/emoji_picker.vue index 1c91c8b7..901520aa 100644 --- a/src/components/emoji_picker/emoji_picker.vue +++ b/src/components/emoji_picker/emoji_picker.vue @@ -65,16 +65,12 @@ :title="emoji.displayText" class="emoji-item" @click.stop.prevent="onEmoji(emoji)" - @mouseenter="setZoomEmoji($event, emoji)" - @mouseleave="setZoomEmoji($event, false)" > - <span v-if="!emoji.imageUrl"> - {{ emoji.replacement }} - </span> + <span v-if="!emoji.imageUrl">{{ emoji.replacement }}</span> <img v-else :src="emoji.imageUrl" - > + > </span> </div> </div> @@ -99,18 +95,6 @@ /> </div> </div> - <div ref="zoom-portal" class="zoom-portal"> - <span v-if="zoomEmoji"> - <span v-if="!zoomEmoji.imageUrl"> - {{ zoomEmoji.replacement }} - </span> - <img - v-else - :key="zoomEmoji.imageUrl" - :src="zoomEmoji.imageUrl" - > - </span> - </div> </div> </template> diff --git a/src/components/status/status.vue b/src/components/status/status.vue index a0756ae4..771615f3 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -696,22 +696,6 @@ $status-margin: 0.75em; line-height: 1.4em; white-space: pre-wrap; - .emoji-container { - display: inline-block; - width: 32px; - height: 32px; - z-index: 1; - - &:hover { - z-index: 2; - - .emoji { - transform: scale(3); - z-index: 2; - } - } - } - img, video { max-width: 100%; max-height: 400px; @@ -721,9 +705,6 @@ $status-margin: 0.75em; &.emoji { width: 32px; height: 32px; - transition: transform 200ms; - transform: scale(1); - pointer-events: none; } } diff --git a/src/services/entity_normalizer/entity_normalizer.service.js b/src/services/entity_normalizer/entity_normalizer.service.js index 17b4a6e0..6cc1851d 100644 --- a/src/services/entity_normalizer/entity_normalizer.service.js +++ b/src/services/entity_normalizer/entity_normalizer.service.js @@ -194,7 +194,7 @@ export const addEmojis = (string, emojis) => { return emojis.reduce((acc, emoji) => { return acc.replace( new RegExp(`:${emoji.shortcode}:`, 'g'), - `<span class='emoji-container'><img src='${emoji.url}' alt='${emoji.shortcode}' title='${emoji.shortcode}' class='emoji' /></span>` + `<img src='${emoji.url}' alt='${emoji.shortcode}' title='${emoji.shortcode}' class='emoji' />` ) }, string) } |
