From 06e817af597e7ee621bdeb370c72d7555482d943 Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 27 Feb 2021 11:18:53 +0900 Subject: [PATCH] perf: use overflow: clip instead of hidden --- src/client/components/autocomplete.vue | 9 ++++--- src/client/components/channel-preview.vue | 3 ++- src/client/components/drive.file.vue | 3 ++- src/client/components/form/input.vue | 3 ++- src/client/components/form/link.vue | 3 ++- src/client/components/global/avatar.vue | 3 ++- .../global/misskey-flavored-markdown.vue | 3 ++- src/client/components/instance-stats.vue | 3 ++- src/client/components/instance-ticker.vue | 3 ++- src/client/components/media-banner.vue | 6 +++-- src/client/components/media-image.vue | 3 ++- src/client/components/media-list.vue | 3 ++- src/client/components/media-video.vue | 3 ++- src/client/components/note-detailed.vue | 6 +++-- src/client/components/note-header.vue | 6 +++-- src/client/components/note-preview.vue | 3 ++- src/client/components/note.vue | 9 ++++--- src/client/components/notification.vue | 6 +++-- src/client/components/poll.vue | 3 ++- src/client/components/post-form-attaches.vue | 3 ++- src/client/components/sidebar.vue | 3 ++- src/client/components/toast.vue | 3 ++- src/client/components/ui/button.vue | 6 +++-- src/client/components/ui/container.vue | 3 ++- src/client/components/ui/input.vue | 6 +++-- src/client/components/ui/menu.vue | 3 ++- src/client/components/ui/modal-window.vue | 6 +++-- src/client/components/ui/range.vue | 3 ++- src/client/components/ui/window.vue | 6 +++-- src/client/components/url-preview.vue | 6 +++-- src/client/components/user-info.vue | 3 ++- src/client/components/user-preview.vue | 3 ++- src/client/components/users-dialog.vue | 6 +++-- src/client/components/visibility-picker.vue | 3 ++- src/client/pages/about-misskey.vue | 2 +- src/client/pages/follow-requests.vue | 6 +++-- src/client/pages/instance/emojis.vue | 18 +++++++++----- src/client/pages/messaging/index.vue | 9 ++++--- .../messaging/messaging-room.message.vue | 9 ++++--- .../page-editor/page-editor.container.vue | 3 ++- src/client/pages/reversi/game.board.vue | 3 ++- src/client/pages/reversi/game.setting.vue | 3 ++- src/client/pages/settings/drive.vue | 3 ++- src/client/pages/settings/security.vue | 3 ++- src/client/pages/settings/theme.vue | 3 ++- src/client/pages/user/index.vue | 24 ++++++++++++------- src/client/pages/welcome.entrance.a.vue | 3 ++- src/client/pages/welcome.entrance.b.vue | 3 ++- src/client/pages/welcome.setup.vue | 3 ++- src/client/style.scss | 11 ++++++++- src/client/ui/_common_/header.vue | 3 ++- src/client/ui/_common_/upload.vue | 6 +++-- src/client/ui/chat/index.vue | 12 ++++++---- src/client/ui/chat/note-header.vue | 6 +++-- src/client/ui/chat/note-preview.vue | 3 ++- src/client/ui/chat/note.vue | 6 +++-- src/client/ui/deck/column.vue | 6 +++-- src/client/ui/visitor/header.vue | 6 +++-- src/client/widgets/calendar.vue | 3 ++- src/client/widgets/federation.vue | 9 ++++--- src/client/widgets/rss.vue | 3 ++- src/client/widgets/trends.vue | 9 ++++--- 62 files changed, 217 insertions(+), 105 deletions(-) diff --git a/src/client/components/autocomplete.vue b/src/client/components/autocomplete.vue index ae742610f..1fe74adc6 100644 --- a/src/client/components/autocomplete.vue +++ b/src/client/components/autocomplete.vue @@ -401,7 +401,8 @@ export default defineComponent({ z-index: 65535; max-width: 100%; margin-top: calc(1em + 8px); - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; transition: top 0.1s ease, left 0.1s ease; > ol { @@ -418,7 +419,8 @@ export default defineComponent({ align-items: center; padding: 4px 12px; white-space: nowrap; - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; font-size: 0.9em; cursor: default; @@ -427,7 +429,8 @@ export default defineComponent({ } * { - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; text-overflow: ellipsis; } diff --git a/src/client/components/channel-preview.vue b/src/client/components/channel-preview.vue index e222ad7ae..3e24774f5 100644 --- a/src/client/components/channel-preview.vue +++ b/src/client/components/channel-preview.vue @@ -66,7 +66,8 @@ export default defineComponent({ diff --git a/src/client/components/ui/button.vue b/src/client/components/ui/button.vue index 3901e8ae4..e98c5efcc 100644 --- a/src/client/components/ui/button.vue +++ b/src/client/components/ui/button.vue @@ -124,7 +124,8 @@ export default defineComponent({ text-decoration: none; background: var(--buttonBg); border-radius: 999px; - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; &:not(:disabled):hover { background: var(--buttonHoverBg); @@ -212,7 +213,8 @@ export default defineComponent({ width: 100%; height: 100%; border-radius: 6px; - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; ::v-deep(div) { position: absolute; diff --git a/src/client/components/ui/container.vue b/src/client/components/ui/container.vue index c3353cca8..b9360e92f 100644 --- a/src/client/components/ui/container.vue +++ b/src/client/components/ui/container.vue @@ -116,7 +116,8 @@ export default defineComponent({ .ukygtjoj { position: relative; - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; &.naked { background: transparent !important; diff --git a/src/client/components/ui/input.vue b/src/client/components/ui/input.vue index 1c5222f8f..cea1ec1b7 100644 --- a/src/client/components/ui/input.vue +++ b/src/client/components/ui/input.vue @@ -298,7 +298,8 @@ export default defineComponent({ transform: scale(.75); white-space: nowrap; width: 133%; - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; text-overflow: ellipsis; > .warning { @@ -354,7 +355,8 @@ export default defineComponent({ display: inline-block; min-width: 16px; max-width: 150px; - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; white-space: nowrap; text-overflow: ellipsis; } diff --git a/src/client/components/ui/menu.vue b/src/client/components/ui/menu.vue index c2033402e..c9accf7c3 100644 --- a/src/client/components/ui/menu.vue +++ b/src/client/components/ui/menu.vue @@ -155,7 +155,8 @@ export default defineComponent({ font-size: 0.9em; line-height: 20px; text-align: center; - overflow: hidden; + overflow: hidden; // overflow: clip; をSafariが対応したら消す + overflow: clip; text-overflow: ellipsis; &.danger { diff --git a/src/client/components/ui/modal-window.vue b/src/client/components/ui/modal-window.vue index 2cdf96137..3965b537e 100644 --- a/src/client/components/ui/modal-window.vue +++ b/src/client/components/ui/modal-window.vue @@ -89,7 +89,8 @@ export default defineComponent({