From cced83024bfb578ee802ab13fc8af72a1be9a1e1 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sun, 15 Aug 2021 20:26:44 +0900
Subject: feat: ノートの翻訳機能
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Resolve #5213
---
 src/client/components/global/loading.vue | 32 ++++++++++++++++----------------
 1 file changed, 16 insertions(+), 16 deletions(-)

(limited to 'src/client/components/global/loading.vue')

diff --git a/src/client/components/global/loading.vue b/src/client/components/global/loading.vue
index 9b810f0a16..7bde53c12e 100644
--- a/src/client/components/global/loading.vue
+++ b/src/client/components/global/loading.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="yxspomdl" :class="{ inline, colored }">
+<div class="yxspomdl" :class="{ inline, colored, mini }">
 	<div class="ring"></div>
 </div>
 </template>
@@ -18,7 +18,12 @@ export default defineComponent({
 			type: Boolean,
 			required: false,
 			default: true
-		}
+		},
+		mini: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
 	}
 });
 </script>
@@ -38,6 +43,8 @@ export default defineComponent({
 	text-align: center;
 	cursor: wait;
 
+	--size: 48px;
+
 	&.colored {
 		color: var(--accent);
 	}
@@ -45,19 +52,12 @@ export default defineComponent({
 	&.inline {
 		display: inline;
 		padding: 0;
+		--size: 32px;
+	}
 
-		> .ring:after {
-			width: 32px;
-			height: 32px;
-		}
-
-		> .ring {
-			&:before,
-			&:after {
-				width: 32px;
-				height: 32px;
-			}
-		}
+	&.mini {
+		padding: 16px;
+		--size: 32px;
 	}
 
 	> .ring {
@@ -70,8 +70,8 @@ export default defineComponent({
 			content: " ";
 			display: block;
 			box-sizing: border-box;
-			width: 48px;
-			height: 48px;
+			width: var(--size);
+			height: var(--size);
 			border-radius: 50%;
 			border: solid 4px;
 		}
-- 
cgit v1.2.3-freya

