From 2154354a4f4442c03c48936872eadba76335ab8d Mon Sep 17 00:00:00 2001
From: tamaina <tamaina@hotmail.co.jp>
Date: Tue, 2 Mar 2021 22:57:16 +0900
Subject: [PATCH] Revert "perf: use overflow: clip instead of hidden" (#7273)
This reverts commit 06e817af597e7ee621bdeb370c72d7555482d943.
---
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, 105 insertions(+), 217 deletions(-)
diff --git a/src/client/components/autocomplete.vue b/src/client/components/autocomplete.vue
index 1fe74adc66..ae742610f7 100644
--- a/src/client/components/autocomplete.vue
+++ b/src/client/components/autocomplete.vue
@@ -401,8 +401,7 @@ export default defineComponent({
z-index: 65535;
max-width: 100%;
margin-top: calc(1em + 8px);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
transition: top 0.1s ease, left 0.1s ease;
> ol {
@@ -419,8 +418,7 @@ export default defineComponent({
align-items: center;
padding: 4px 12px;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
font-size: 0.9em;
cursor: default;
@@ -429,8 +427,7 @@ export default defineComponent({
}
* {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
}
diff --git a/src/client/components/channel-preview.vue b/src/client/components/channel-preview.vue
index 3e24774f52..e222ad7ae7 100644
--- a/src/client/components/channel-preview.vue
+++ b/src/client/components/channel-preview.vue
@@ -66,8 +66,7 @@ export default defineComponent({
<style lang="scss" scoped>
.eftoefju {
display: block;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
width: 100%;
&:hover {
diff --git a/src/client/components/drive.file.vue b/src/client/components/drive.file.vue
index 80283f997b..d2b8b95f73 100644
--- a/src/client/components/drive.file.vue
+++ b/src/client/components/drive.file.vue
@@ -342,8 +342,7 @@ export default defineComponent({
text-align: center;
word-break: break-all;
color: var(--fg);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .ext {
opacity: 0.5;
diff --git a/src/client/components/form/input.vue b/src/client/components/form/input.vue
index f16d8be026..f0aa6b0534 100644
--- a/src/client/components/form/input.vue
+++ b/src/client/components/form/input.vue
@@ -261,8 +261,7 @@ export default defineComponent({
display: inline-block;
min-width: 16px;
max-width: 150px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
diff --git a/src/client/components/form/link.vue b/src/client/components/form/link.vue
index 6f0ae0e5f7..7093f50397 100644
--- a/src/client/components/form/link.vue
+++ b/src/client/components/form/link.vue
@@ -83,8 +83,7 @@ export default defineComponent({
> .text {
white-space: nowrap;
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
padding-right: 12px;
}
diff --git a/src/client/components/global/avatar.vue b/src/client/components/global/avatar.vue
index 8930bb4a0c..d2f25fa41e 100644
--- a/src/client/components/global/avatar.vue
+++ b/src/client/components/global/avatar.vue
@@ -101,8 +101,7 @@ export default defineComponent({
top: 0;
border-radius: 100%;
z-index: 1;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
object-fit: cover;
width: 100%;
height: 100%;
diff --git a/src/client/components/global/misskey-flavored-markdown.vue b/src/client/components/global/misskey-flavored-markdown.vue
index 0b34ccbfb4..a3f443d5d8 100644
--- a/src/client/components/global/misskey-flavored-markdown.vue
+++ b/src/client/components/global/misskey-flavored-markdown.vue
@@ -126,8 +126,7 @@ export default defineComponent({
&.nowrap {
white-space: pre;
word-wrap: normal; // https://codeday.me/jp/qa/20190424/690106.html
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
}
diff --git a/src/client/components/instance-stats.vue b/src/client/components/instance-stats.vue
index 80070996fc..e9b496180a 100644
--- a/src/client/components/instance-stats.vue
+++ b/src/client/components/instance-stats.vue
@@ -692,8 +692,7 @@ export default defineComponent({
> dd {
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
}
diff --git a/src/client/components/instance-ticker.vue b/src/client/components/instance-ticker.vue
index fa46f8edc4..1ce5a1c2c1 100644
--- a/src/client/components/instance-ticker.vue
+++ b/src/client/components/instance-ticker.vue
@@ -44,8 +44,7 @@ export default defineComponent({
height: $height;
border-radius: 4px 0 0 4px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
color: #fff;
> .icon {
diff --git a/src/client/components/media-banner.vue b/src/client/components/media-banner.vue
index 4fc6701d36..a2e1776d09 100644
--- a/src/client/components/media-banner.vue
+++ b/src/client/components/media-banner.vue
@@ -62,8 +62,7 @@ export default defineComponent({
width: 100%;
border-radius: 4px;
margin-top: 4px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .download,
> .sensitive {
@@ -78,8 +77,7 @@ export default defineComponent({
}
> b {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
}
diff --git a/src/client/components/media-image.vue b/src/client/components/media-image.vue
index 5f55d88388..9f3898ec56 100644
--- a/src/client/components/media-image.vue
+++ b/src/client/components/media-image.vue
@@ -143,8 +143,7 @@ export default defineComponent({
> a {
display: block;
cursor: zoom-in;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
width: 100%;
height: 100%;
background-position: center;
diff --git a/src/client/components/media-list.vue b/src/client/components/media-list.vue
index 61482266ab..36fbb4bd06 100644
--- a/src/client/components/media-list.vue
+++ b/src/client/components/media-list.vue
@@ -105,8 +105,7 @@ export default defineComponent({
grid-gap: 4px;
> * {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
border-radius: 6px;
}
diff --git a/src/client/components/media-video.vue b/src/client/components/media-video.vue
index dbde40f666..3788947206 100644
--- a/src/client/components/media-video.vue
+++ b/src/client/components/media-video.vue
@@ -78,8 +78,7 @@ export default defineComponent({
align-items: center;
font-size: 3.5em;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
background-position: center;
background-size: cover;
width: 100%;
diff --git a/src/client/components/note-detailed.vue b/src/client/components/note-detailed.vue
index 7df87c6b01..b5bc054e5e 100644
--- a/src/client/components/note-detailed.vue
+++ b/src/client/components/note-detailed.vue
@@ -886,8 +886,7 @@ export default defineComponent({
.note {
position: relative;
transition: box-shadow 0.1s ease;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
contain: content;
&:focus-visible {
@@ -947,8 +946,7 @@ export default defineComponent({
}
> span {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
flex-shrink: 1;
text-overflow: ellipsis;
white-space: nowrap;
diff --git a/src/client/components/note-header.vue b/src/client/components/note-header.vue
index aed4225067..1f7a07bac3 100644
--- a/src/client/components/note-header.vue
+++ b/src/client/components/note-header.vue
@@ -61,8 +61,7 @@ export default defineComponent({
display: block;
margin: 0 .5em 0 0;
padding: 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
font-size: 1em;
font-weight: bold;
text-decoration: none;
@@ -91,8 +90,7 @@ export default defineComponent({
> .username {
margin: 0 .5em 0 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
}
diff --git a/src/client/components/note-preview.vue b/src/client/components/note-preview.vue
index 4715c299b5..4ea97d17ee 100644
--- a/src/client/components/note-preview.vue
+++ b/src/client/components/note-preview.vue
@@ -50,8 +50,7 @@ export default defineComponent({
display: flex;
margin: 0;
padding: 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
font-size: 0.95em;
> .avatar {
diff --git a/src/client/components/note.vue b/src/client/components/note.vue
index dab7643762..bc2f87fe85 100644
--- a/src/client/components/note.vue
+++ b/src/client/components/note.vue
@@ -861,8 +861,7 @@ export default defineComponent({
.tkcbzcuz {
position: relative;
transition: box-shadow 0.1s ease;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
contain: content;
// これらの指定はパフォーマンス向上には有効だが、ノートの高さは一定でないため、
@@ -949,8 +948,7 @@ export default defineComponent({
}
> span {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
flex-shrink: 1;
text-overflow: ellipsis;
white-space: nowrap;
@@ -1022,8 +1020,7 @@ export default defineComponent({
&.collapsed {
position: relative;
max-height: 9em;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .fade {
display: block;
diff --git a/src/client/components/notification.vue b/src/client/components/notification.vue
index a0cfe4f213..2fe8500891 100644
--- a/src/client/components/notification.vue
+++ b/src/client/components/notification.vue
@@ -257,8 +257,7 @@ export default defineComponent({
text-overflow: ellipsis;
white-space: nowrap;
min-width: 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
> .time {
@@ -269,8 +268,7 @@ export default defineComponent({
> .text {
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
> [data-icon] {
diff --git a/src/client/components/poll.vue b/src/client/components/poll.vue
index 01bbefe36d..7f13e135aa 100644
--- a/src/client/components/poll.vue
+++ b/src/client/components/poll.vue
@@ -112,8 +112,7 @@ export default defineComponent({
padding: 4px 8px;
border: solid 1px var(--divider);
border-radius: 4px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
cursor: pointer;
&:hover {
diff --git a/src/client/components/post-form-attaches.vue b/src/client/components/post-form-attaches.vue
index 3b5cb75c19..230c944de1 100644
--- a/src/client/components/post-form-attaches.vue
+++ b/src/client/components/post-form-attaches.vue
@@ -127,8 +127,7 @@ export default defineComponent({
height: 64px;
margin-right: 4px;
border-radius: 4px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
cursor: move;
&:hover > .remove {
diff --git a/src/client/components/sidebar.vue b/src/client/components/sidebar.vue
index 6460043244..f7c50a2ba5 100644
--- a/src/client/components/sidebar.vue
+++ b/src/client/components/sidebar.vue
@@ -390,8 +390,7 @@ export default defineComponent({
font-size: $ui-font-size;
line-height: 3rem;
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
width: 100%;
text-align: left;
diff --git a/src/client/components/toast.vue b/src/client/components/toast.vue
index 49c14789b7..fb0de68092 100644
--- a/src/client/components/toast.vue
+++ b/src/client/components/toast.vue
@@ -67,8 +67,7 @@ export default defineComponent({
height: 100%;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
border-radius: 8px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
}
</style>
diff --git a/src/client/components/ui/button.vue b/src/client/components/ui/button.vue
index e98c5efcc0..3901e8ae44 100644
--- a/src/client/components/ui/button.vue
+++ b/src/client/components/ui/button.vue
@@ -124,8 +124,7 @@ export default defineComponent({
text-decoration: none;
background: var(--buttonBg);
border-radius: 999px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
&:not(:disabled):hover {
background: var(--buttonHoverBg);
@@ -213,8 +212,7 @@ export default defineComponent({
width: 100%;
height: 100%;
border-radius: 6px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
::v-deep(div) {
position: absolute;
diff --git a/src/client/components/ui/container.vue b/src/client/components/ui/container.vue
index b9360e92fa..c3353cca89 100644
--- a/src/client/components/ui/container.vue
+++ b/src/client/components/ui/container.vue
@@ -116,8 +116,7 @@ export default defineComponent({
.ukygtjoj {
position: relative;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
&.naked {
background: transparent !important;
diff --git a/src/client/components/ui/input.vue b/src/client/components/ui/input.vue
index cea1ec1b7f..1c5222f8f2 100644
--- a/src/client/components/ui/input.vue
+++ b/src/client/components/ui/input.vue
@@ -298,8 +298,7 @@ export default defineComponent({
transform: scale(.75);
white-space: nowrap;
width: 133%;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
> .warning {
@@ -355,8 +354,7 @@ export default defineComponent({
display: inline-block;
min-width: 16px;
max-width: 150px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
diff --git a/src/client/components/ui/menu.vue b/src/client/components/ui/menu.vue
index c9accf7c31..c2033402e3 100644
--- a/src/client/components/ui/menu.vue
+++ b/src/client/components/ui/menu.vue
@@ -155,8 +155,7 @@ export default defineComponent({
font-size: 0.9em;
line-height: 20px;
text-align: center;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
&.danger {
diff --git a/src/client/components/ui/modal-window.vue b/src/client/components/ui/modal-window.vue
index 3965b537e5..2cdf961379 100644
--- a/src/client/components/ui/modal-window.vue
+++ b/src/client/components/ui/modal-window.vue
@@ -89,8 +89,7 @@ export default defineComponent({
<style lang="scss" scoped>
.ebkgoccj {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
display: flex;
flex-direction: column;
contain: content;
@@ -124,8 +123,7 @@ export default defineComponent({
padding-left: 32px;
font-weight: bold;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
pointer-events: none;
diff --git a/src/client/components/ui/range.vue b/src/client/components/ui/range.vue
index cbdf07d6b6..4cfe66a8fc 100644
--- a/src/client/components/ui/range.vue
+++ b/src/client/components/ui/range.vue
@@ -89,8 +89,7 @@ export default defineComponent({
pointer-events: none;
font-size: 16px;
color: var(--inputLabel);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
> input {
diff --git a/src/client/components/ui/window.vue b/src/client/components/ui/window.vue
index 4d3b048c11..501a3bf8ee 100644
--- a/src/client/components/ui/window.vue
+++ b/src/client/components/ui/window.vue
@@ -402,8 +402,7 @@ export default defineComponent({
}
> .body {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
display: flex;
flex-direction: column;
contain: content;
@@ -438,8 +437,7 @@ export default defineComponent({
position: relative;
line-height: var(--height);
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
text-align: center;
cursor: move;
diff --git a/src/client/components/url-preview.vue b/src/client/components/url-preview.vue
index a7068d1619..7a59068710 100644
--- a/src/client/components/url-preview.vue
+++ b/src/client/components/url-preview.vue
@@ -244,8 +244,7 @@ export default defineComponent({
font-size: 14px;
box-shadow: 0 0 0 1px var(--divider);
border-radius: 8px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
&:hover {
text-decoration: none;
@@ -327,8 +326,7 @@ export default defineComponent({
&.compact {
> article {
> header h1, p, footer {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
diff --git a/src/client/components/user-info.vue b/src/client/components/user-info.vue
index b744f21929..711e367411 100644
--- a/src/client/components/user-info.vue
+++ b/src/client/components/user-info.vue
@@ -110,8 +110,7 @@ export default defineComponent({
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
}
diff --git a/src/client/components/user-preview.vue b/src/client/components/user-preview.vue
index 86e53228ce..c4588e478a 100644
--- a/src/client/components/user-preview.vue
+++ b/src/client/components/user-preview.vue
@@ -111,8 +111,7 @@ export default defineComponent({
position: absolute;
z-index: 11000;
width: 300px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
transform-origin: center top;
> .info {
diff --git a/src/client/components/users-dialog.vue b/src/client/components/users-dialog.vue
index af47391c5d..014748adc6 100644
--- a/src/client/components/users-dialog.vue
+++ b/src/client/components/users-dialog.vue
@@ -66,8 +66,7 @@ export default defineComponent({
height: 350px;
background: var(--panel);
border-radius: var(--radius);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
display: flex;
flex-direction: column;
@@ -128,8 +127,7 @@ export default defineComponent({
> .body {
padding: 0 8px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .name {
display: block;
diff --git a/src/client/components/visibility-picker.vue b/src/client/components/visibility-picker.vue
index 66dd9c2aed..e518f48d0d 100644
--- a/src/client/components/visibility-picker.vue
+++ b/src/client/components/visibility-picker.vue
@@ -141,8 +141,7 @@ export default defineComponent({
> *:nth-child(2) {
flex: 1 1 auto;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
> span:first-child {
diff --git a/src/client/pages/about-misskey.vue b/src/client/pages/about-misskey.vue
index fa47a80492..7022a924b0 100644
--- a/src/client/pages/about-misskey.vue
+++ b/src/client/pages/about-misskey.vue
@@ -1,5 +1,5 @@
<template>
-<div style="overflow: hidden; overflow: clip;">
+<div style="overflow: hidden;">
<FormBase class="znqjceqz">
<div id="debug"></div>
<section class="_formItem about">
diff --git a/src/client/pages/follow-requests.vue b/src/client/pages/follow-requests.vue
index 18f39642e4..04d739088f 100644
--- a/src/client/pages/follow-requests.vue
+++ b/src/client/pages/follow-requests.vue
@@ -104,8 +104,7 @@ export default defineComponent({
display: block;
white-space: nowrap;
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
margin: 0;
}
@@ -125,8 +124,7 @@ export default defineComponent({
width: 55%;
line-height: 42px;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
opacity: 0.7;
font-size: 14px;
diff --git a/src/client/pages/instance/emojis.vue b/src/client/pages/instance/emojis.vue
index 71b6c11b2d..6a51813bb2 100644
--- a/src/client/pages/instance/emojis.vue
+++ b/src/client/pages/instance/emojis.vue
@@ -178,20 +178,17 @@ export default defineComponent({
> .body {
padding: 0 0 0 8px;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .name {
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
> .info {
opacity: 0.5;
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
}
}
@@ -222,20 +219,17 @@ export default defineComponent({
> .body {
padding: 0 0 0 8px;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .name {
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
> .info {
opacity: 0.5;
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
}
}
diff --git a/src/client/pages/messaging/index.vue b/src/client/pages/messaging/index.vue
index 8e7fe5134a..aefc31f3bc 100644
--- a/src/client/pages/messaging/index.vue
+++ b/src/client/pages/messaging/index.vue
@@ -226,14 +226,12 @@ export default defineComponent({
align-items: center;
margin-bottom: 2px;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .name {
margin: 0;
padding: 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
font-size: 1em;
font-weight: bold;
@@ -264,8 +262,7 @@ export default defineComponent({
display: block;
margin: 0 0 0 0;
padding: 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
overflow-wrap: break-word;
font-size: 1.1em;
color: var(--faceText);
diff --git a/src/client/pages/messaging/messaging-room.message.vue b/src/client/pages/messaging/messaging-room.message.vue
index 3d994c2666..d379c0c3c0 100644
--- a/src/client/pages/messaging/messaging-room.message.vue
+++ b/src/client/pages/messaging/messaging-room.message.vue
@@ -154,8 +154,7 @@ export default defineComponent({
display: block;
margin: 0;
padding: 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
overflow-wrap: break-word;
font-size: 1em;
color: rgba(#000, 0.5);
@@ -165,8 +164,7 @@ export default defineComponent({
display: block;
margin: 0;
padding: 12px 18px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
overflow-wrap: break-word;
word-break: break-word;
font-size: 1em;
@@ -184,8 +182,7 @@ export default defineComponent({
display: block;
max-width: 100%;
border-radius: 16px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-decoration: none;
&:hover {
diff --git a/src/client/pages/page-editor/page-editor.container.vue b/src/client/pages/page-editor/page-editor.container.vue
index 5e89b8c2bf..46e2dca157 100644
--- a/src/client/pages/page-editor/page-editor.container.vue
+++ b/src/client/pages/page-editor/page-editor.container.vue
@@ -74,8 +74,7 @@ export default defineComponent({
<style lang="scss" scoped>
.cpjygsrt {
position: relative;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
background: var(--panel);
border: solid 2px var(--X12);
border-radius: 6px;
diff --git a/src/client/pages/reversi/game.board.vue b/src/client/pages/reversi/game.board.vue
index a3c7900d20..8ce232af07 100644
--- a/src/client/pages/reversi/game.board.vue
+++ b/src/client/pages/reversi/game.board.vue
@@ -434,8 +434,7 @@ export default defineComponent({
> div {
background: transparent;
border-radius: 6px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
* {
pointer-events: none;
diff --git a/src/client/pages/reversi/game.setting.vue b/src/client/pages/reversi/game.setting.vue
index 3ed4d2c67b..404e560a06 100644
--- a/src/client/pages/reversi/game.setting.vue
+++ b/src/client/pages/reversi/game.setting.vue
@@ -333,8 +333,7 @@ export default defineComponent({
background: transparent;
border: solid 2px var(--divider);
border-radius: 6px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
cursor: pointer;
* {
diff --git a/src/client/pages/settings/drive.vue b/src/client/pages/settings/drive.vue
index 869af77f37..8ca8bc9eec 100644
--- a/src/client/pages/settings/drive.vue
+++ b/src/client/pages/settings/drive.vue
@@ -230,8 +230,7 @@ export default defineComponent({
$size: 12px;
background: rgba(0, 0, 0, 0.1);
border-radius: ($size / 2);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> div {
height: $size;
diff --git a/src/client/pages/settings/security.vue b/src/client/pages/settings/security.vue
index 913e0e64bf..cdb5705c0b 100644
--- a/src/client/pages/settings/security.vue
+++ b/src/client/pages/settings/security.vue
@@ -144,8 +144,7 @@ export default defineComponent({
flex: 1;
min-width: 0;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
margin-right: 12px;
}
diff --git a/src/client/pages/settings/theme.vue b/src/client/pages/settings/theme.vue
index e230a2276b..ac57c51df4 100644
--- a/src/client/pages/settings/theme.vue
+++ b/src/client/pages/settings/theme.vue
@@ -184,8 +184,7 @@ export default defineComponent({
position: absolute;
top: 50%;
left: 50%;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
padding: 0 100px;
transform: translate3d(-50%, -50%, 0);
diff --git a/src/client/pages/user/index.vue b/src/client/pages/user/index.vue
index 959170f526..5229db9ee3 100644
--- a/src/client/pages/user/index.vue
+++ b/src/client/pages/user/index.vue
@@ -369,8 +369,7 @@ export default defineComponent({
position: relative;
height: 450px;
border-radius: 16px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
background-size: cover;
background-position: center;
@@ -473,8 +472,7 @@ export default defineComponent({
> .name {
width: 30%;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-weight: bold;
@@ -482,8 +480,7 @@ export default defineComponent({
> .value {
width: 70%;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin: 0;
@@ -545,8 +542,7 @@ export default defineComponent({
.ftskorzw.narrow {
max-width: 100vw;
box-sizing: border-box;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .punished {
font-size: 0.8em;
@@ -557,14 +553,12 @@ export default defineComponent({
> .main {
position: relative;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .banner-container {
position: relative;
height: 250px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
background-size: cover;
background-position: center;
@@ -709,8 +703,7 @@ export default defineComponent({
> .name {
width: 30%;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-weight: bold;
@@ -719,8 +712,7 @@ export default defineComponent({
> .value {
width: 70%;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin: 0;
diff --git a/src/client/pages/welcome.entrance.a.vue b/src/client/pages/welcome.entrance.a.vue
index 46a52f4189..4d356774eb 100644
--- a/src/client/pages/welcome.entrance.a.vue
+++ b/src/client/pages/welcome.entrance.a.vue
@@ -167,8 +167,7 @@ export default defineComponent({
margin: auto;
width: 500px;
height: calc(100% - 128px);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
-webkit-mask-image: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 128px, rgba(0,0,0,1) calc(100% - 128px), rgba(0,0,0,0) 100%);
mask-image: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 128px, rgba(0,0,0,1) calc(100% - 128px), rgba(0,0,0,0) 100%);
diff --git a/src/client/pages/welcome.entrance.b.vue b/src/client/pages/welcome.entrance.b.vue
index 0dc91359d0..8a6f60e726 100644
--- a/src/client/pages/welcome.entrance.b.vue
+++ b/src/client/pages/welcome.entrance.b.vue
@@ -151,8 +151,7 @@ export default defineComponent({
margin: auto;
width: 500px;
height: calc(100% - 128px);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
-webkit-mask-image: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 128px, rgba(0,0,0,1) calc(100% - 128px), rgba(0,0,0,0) 100%);
mask-image: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 128px, rgba(0,0,0,1) calc(100% - 128px), rgba(0,0,0,0) 100%);
}
diff --git a/src/client/pages/welcome.setup.vue b/src/client/pages/welcome.setup.vue
index 9c1315cc40..bc994099ac 100644
--- a/src/client/pages/welcome.setup.vue
+++ b/src/client/pages/welcome.setup.vue
@@ -71,8 +71,7 @@ export default defineComponent({
.mk-setup {
border-radius: var(--radius);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> h1 {
margin: 0;
diff --git a/src/client/style.scss b/src/client/style.scss
index aa2face04e..b6a83d967e 100644
--- a/src/client/style.scss
+++ b/src/client/style.scss
@@ -241,8 +241,7 @@ hr {
border-radius: var(--radius);
//border: var(--panelBorder);
box-shadow: var(--panelShadow);
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
}
._card {
@@ -458,14 +457,6 @@ hr {
opacity: 0.7;
}
-// TODO: refactor: 全てのvueファイル中の text-overflow: ellipsis; している箇所をこのクラスを使って置き換える
-._oneline {
- white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
- text-overflow: ellipsis;
-}
-
._monospace {
font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
}
diff --git a/src/client/ui/_common_/header.vue b/src/client/ui/_common_/header.vue
index 3f4796d7a1..f150653a84 100644
--- a/src/client/ui/_common_/header.vue
+++ b/src/client/ui/_common_/header.vue
@@ -132,8 +132,7 @@ export default defineComponent({
display: inline-block;
vertical-align: bottom;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
padding: 0 16px;
position: relative;
diff --git a/src/client/ui/_common_/upload.vue b/src/client/ui/_common_/upload.vue
index 6262d0b725..c1986737d7 100644
--- a/src/client/ui/_common_/upload.vue
+++ b/src/client/ui/_common_/upload.vue
@@ -89,8 +89,7 @@ export default defineComponent({
font-size: 0.8em;
white-space: nowrap;
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
flex-shrink: 1;
}
.mk-uploader > ol > li > .top > .name > [data-icon] {
@@ -120,8 +119,7 @@ export default defineComponent({
background: transparent;
border: none;
border-radius: 4px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
grid-column: 2/3;
grid-row: 2/3;
z-index: 2;
diff --git a/src/client/ui/chat/index.vue b/src/client/ui/chat/index.vue
index c106e9a444..26c81a1aa9 100644
--- a/src/client/ui/chat/index.vue
+++ b/src/client/ui/chat/index.vue
@@ -427,8 +427,7 @@ export default defineComponent({
> .text {
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
font-size: 0.9em;
}
@@ -483,8 +482,7 @@ export default defineComponent({
padding: 6px 8px;
border-radius: 4px;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
&:hover {
@@ -547,8 +545,7 @@ export default defineComponent({
}
> .title {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
min-width: 0;
@@ -559,8 +556,7 @@ export default defineComponent({
font-size: 0.8em;
font-weight: normal;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
}
}
diff --git a/src/client/ui/chat/note-header.vue b/src/client/ui/chat/note-header.vue
index a33e5bafed..cda8ae00e2 100644
--- a/src/client/ui/chat/note-header.vue
+++ b/src/client/ui/chat/note-header.vue
@@ -62,8 +62,7 @@ export default defineComponent({
display: block;
margin: 0 .5em 0 0;
padding: 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
font-size: 1em;
font-weight: bold;
text-decoration: none;
@@ -92,8 +91,7 @@ export default defineComponent({
> .username {
margin: 0 .5em 0 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
}
diff --git a/src/client/ui/chat/note-preview.vue b/src/client/ui/chat/note-preview.vue
index 6ec66c921b..4861473701 100644
--- a/src/client/ui/chat/note-preview.vue
+++ b/src/client/ui/chat/note-preview.vue
@@ -50,8 +50,7 @@ export default defineComponent({
display: flex;
margin: 0;
padding: 0;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
font-size: 0.95em;
> .avatar {
diff --git a/src/client/ui/chat/note.vue b/src/client/ui/chat/note.vue
index 75b92a32f2..bd7bbc5a4f 100644
--- a/src/client/ui/chat/note.vue
+++ b/src/client/ui/chat/note.vue
@@ -955,8 +955,7 @@ export default defineComponent({
}
> span {
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
flex-shrink: 1;
text-overflow: ellipsis;
white-space: nowrap;
@@ -1029,8 +1028,7 @@ export default defineComponent({
&.collapsed {
position: relative;
max-height: 9em;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .fade {
display: block;
diff --git a/src/client/ui/deck/column.vue b/src/client/ui/deck/column.vue
index 11e9e536da..d0a39965b1 100644
--- a/src/client/ui/deck/column.vue
+++ b/src/client/ui/deck/column.vue
@@ -268,8 +268,7 @@ export default defineComponent({
--section-padding: 10px;
height: 100%;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
contain: content;
&.draghover {
@@ -359,8 +358,7 @@ export default defineComponent({
> .header {
display: inline-block;
align-items: center;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
diff --git a/src/client/ui/visitor/header.vue b/src/client/ui/visitor/header.vue
index 7a57a70360..9a7bf96fc0 100644
--- a/src/client/ui/visitor/header.vue
+++ b/src/client/ui/visitor/header.vue
@@ -125,8 +125,7 @@ export default defineComponent({
display: inline-block;
vertical-align: bottom;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
position: relative;
@@ -207,8 +206,7 @@ export default defineComponent({
> .title {
flex: 1;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
position: relative;
text-align: center;
diff --git a/src/client/widgets/calendar.vue b/src/client/widgets/calendar.vue
index 5bc24cb690..545072e87b 100644
--- a/src/client/widgets/calendar.vue
+++ b/src/client/widgets/calendar.vue
@@ -171,8 +171,7 @@ export default defineComponent({
> .meter {
width: 100%;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
background: var(--X11);
border-radius: 8px;
diff --git a/src/client/widgets/federation.vue b/src/client/widgets/federation.vue
index f05ad65c2f..6e76bc40e9 100644
--- a/src/client/widgets/federation.vue
+++ b/src/client/widgets/federation.vue
@@ -89,8 +89,7 @@ export default defineComponent({
$bodyInfoHieght: 16px;
height: (62px + 1px) + (62px + 1px) + (62px + 1px) + (62px + 1px) + 62px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .instances {
.chart-move {
@@ -114,8 +113,7 @@ export default defineComponent({
> .body {
flex: 1;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
font-size: 0.9em;
color: var(--fg);
@@ -123,8 +121,7 @@ export default defineComponent({
display: block;
width: 100%;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
line-height: $bodyTitleHieght;
}
diff --git a/src/client/widgets/rss.vue b/src/client/widgets/rss.vue
index 3ad801efae..1140a4252f 100644
--- a/src/client/widgets/rss.vue
+++ b/src/client/widgets/rss.vue
@@ -80,8 +80,7 @@ export default defineComponent({
color: var(--fg);
white-space: nowrap;
text-overflow: ellipsis;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
&:nth-child(even) {
background: rgba(#000, 0.05);
diff --git a/src/client/widgets/trends.vue b/src/client/widgets/trends.vue
index b5fc6fb6f0..3734573e3c 100644
--- a/src/client/widgets/trends.vue
+++ b/src/client/widgets/trends.vue
@@ -68,8 +68,7 @@ export default defineComponent({
<style lang="scss" scoped>
.wbrkwala {
height: (62px + 1px) + (62px + 1px) + (62px + 1px) + (62px + 1px) + 62px;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
> .tags {
.chart-move {
@@ -84,8 +83,7 @@ export default defineComponent({
> .tag {
flex: 1;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
font-size: 0.9em;
color: var(--fg);
@@ -93,8 +91,7 @@ export default defineComponent({
display: block;
width: 100%;
white-space: nowrap;
- overflow: hidden; // overflow: clip; をSafariが対応したら消す
- overflow: clip;
+ overflow: hidden;
text-overflow: ellipsis;
line-height: 18px;
}