diff options
| author | かっこかり <67428053+kakkokari-gtyih@users.noreply.github.com> | 2024-09-17 15:41:52 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-09-17 15:41:52 +0900 |
| commit | 6bd6af440f8d0c98543091d241430295ca4ced71 (patch) | |
| tree | c657697b829dc4aad58a30ea826e6e64b9e9b880 /packages/frontend/src | |
| parent | fix(deps): broken lockfile (#14556) (diff) | |
| download | misskey-6bd6af440f8d0c98543091d241430295ca4ced71.tar.gz misskey-6bd6af440f8d0c98543091d241430295ca4ced71.tar.bz2 misskey-6bd6af440f8d0c98543091d241430295ca4ced71.zip | |
fix(frontend): 絵文字関連のスタイルが崩れているのを修正 (#14559)
* fix(frontend): 絵文字関連のスタイルが崩れていたのを修正 (MisskeyIO#725)
(cherry picked from commit 00fd684a7b382aaeb3355a1c80dc24078a5caa61)
* Update Changelog
* :v:
---------
Co-authored-by: Yuuki <yukikum57@gmail.com>
Diffstat (limited to 'packages/frontend/src')
5 files changed, 8 insertions, 3 deletions
diff --git a/packages/frontend/src/components/MkEmojiPicker.vue b/packages/frontend/src/components/MkEmojiPicker.vue index 5ba175fc35..3bad8da06f 100644 --- a/packages/frontend/src/components/MkEmojiPicker.vue +++ b/packages/frontend/src/components/MkEmojiPicker.vue @@ -611,6 +611,7 @@ defineExpose({ width: auto; height: auto; min-width: 0; + padding: 0; &:disabled { cursor: not-allowed; @@ -717,7 +718,7 @@ defineExpose({ > .item { position: relative; - padding: 0; + padding: 0 3px; width: var(--eachSize); height: var(--eachSize); contain: strict; diff --git a/packages/frontend/src/components/MkNotification.vue b/packages/frontend/src/components/MkNotification.vue index ee65743574..738cba2134 100644 --- a/packages/frontend/src/components/MkNotification.vue +++ b/packages/frontend/src/components/MkNotification.vue @@ -46,7 +46,7 @@ SPDX-License-Identifier: AGPL-3.0-only :withTooltip="true" :reaction="notification.reaction.replace(/^:(\w+):$/, ':$1@.:')" :noStyle="true" - style="width: 100%; height: 100%;" + style="width: 100%; height: 100% !important; object-fit: contain;" /> </div> </div> @@ -122,7 +122,7 @@ SPDX-License-Identifier: AGPL-3.0-only :withTooltip="true" :reaction="reaction.reaction.replace(/^:(\w+):$/, ':$1@.:')" :noStyle="true" - style="width: 100%; height: 100%;" + style="width: 100%; height: 100% !important; object-fit: contain;" /> </div> </div> diff --git a/packages/frontend/src/components/MkReactionTooltip.vue b/packages/frontend/src/components/MkReactionTooltip.vue index 15409a216a..77ca841ad0 100644 --- a/packages/frontend/src/components/MkReactionTooltip.vue +++ b/packages/frontend/src/components/MkReactionTooltip.vue @@ -36,6 +36,7 @@ const emit = defineEmits<{ .icon { display: block; width: 60px; + max-height: 60px; font-size: 60px; // unicodeな絵文字についてはwidthが効かないため margin: 0 auto; object-fit: contain; diff --git a/packages/frontend/src/components/MkReactionsViewer.details.vue b/packages/frontend/src/components/MkReactionsViewer.details.vue index 3dd02b261c..8038ec7429 100644 --- a/packages/frontend/src/components/MkReactionsViewer.details.vue +++ b/packages/frontend/src/components/MkReactionsViewer.details.vue @@ -63,6 +63,7 @@ function getReactionName(reaction: string): string { .reactionIcon { display: block; width: 60px; + max-height: 60px; font-size: 60px; // unicodeな絵文字についてはwidthが効かないため object-fit: contain; margin: 0 auto; diff --git a/packages/frontend/src/pages/custom-emojis-manager.vue b/packages/frontend/src/pages/custom-emojis-manager.vue index eea3f68130..4747aa5205 100644 --- a/packages/frontend/src/pages/custom-emojis-manager.vue +++ b/packages/frontend/src/pages/custom-emojis-manager.vue @@ -344,6 +344,7 @@ definePageMetadata(() => ({ > .img { width: 42px; height: 42px; + object-fit: contain; } > .body { @@ -390,6 +391,7 @@ definePageMetadata(() => ({ > .img { width: 32px; height: 32px; + object-fit: contain; } > .body { |