From 06e817af597e7ee621bdeb370c72d7555482d943 Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Sat, 27 Feb 2021 11:18:53 +0900
Subject: perf: use overflow: clip instead of hidden

---
 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 ++++--
 7 files changed, 22 insertions(+), 11 deletions(-)

(limited to 'src/client/components/ui')

diff --git a/src/client/components/ui/button.vue b/src/client/components/ui/button.vue
index 3901e8ae44..e98c5efcc0 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 c3353cca89..b9360e92fa 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 1c5222f8f2..cea1ec1b7f 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 c2033402e3..c9accf7c31 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 2cdf961379..3965b537e5 100644
--- a/src/client/components/ui/modal-window.vue
+++ b/src/client/components/ui/modal-window.vue
@@ -89,7 +89,8 @@ export default defineComponent({
 
 <style lang="scss" scoped>
 .ebkgoccj {
-	overflow: hidden;
+	overflow: hidden; // overflow: clip; をSafariが対応したら消す
+	overflow: clip;
 	display: flex;
 	flex-direction: column;
 	contain: content;
@@ -123,7 +124,8 @@ export default defineComponent({
 			padding-left: 32px;
 			font-weight: bold;
 			white-space: nowrap;
-			overflow: hidden;
+			overflow: hidden; // overflow: clip; をSafariが対応したら消す
+			overflow: clip;
 			text-overflow: ellipsis;
 			pointer-events: none;
 
diff --git a/src/client/components/ui/range.vue b/src/client/components/ui/range.vue
index 4cfe66a8fc..cbdf07d6b6 100644
--- a/src/client/components/ui/range.vue
+++ b/src/client/components/ui/range.vue
@@ -89,7 +89,8 @@ export default defineComponent({
 		pointer-events: none;
 		font-size: 16px;
 		color: var(--inputLabel);
-		overflow: hidden;
+		overflow: hidden; // overflow: clip; をSafariが対応したら消す
+		overflow: clip;
 	}
 
 	> input {
diff --git a/src/client/components/ui/window.vue b/src/client/components/ui/window.vue
index 37bb645cfd..d8852b9ffd 100644
--- a/src/client/components/ui/window.vue
+++ b/src/client/components/ui/window.vue
@@ -388,7 +388,8 @@ export default defineComponent({
 	z-index: 5000;
 
 	> .body {
-		overflow: hidden;
+		overflow: hidden; // overflow: clip; をSafariが対応したら消す
+		overflow: clip;
 		display: flex;
 		flex-direction: column;
 		contain: content;
@@ -418,7 +419,8 @@ export default defineComponent({
 				position: relative;
 				line-height: $height;
 				white-space: nowrap;
-				overflow: hidden;
+				overflow: hidden; // overflow: clip; をSafariが対応したら消す
+				overflow: clip;
 				text-overflow: ellipsis;
 				text-align: center;
 				cursor: move;
-- 
cgit v1.2.3-freya