From 0fcf422decc826d4c4d1227932db2dd432d63dd8 Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Sat, 12 Jan 2019 09:34:02 +0900
Subject: [PATCH] [Client] Improve UI

---
 .../views/components/ui/horizon-group.vue     | 27 ++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/client/app/common/views/components/ui/horizon-group.vue b/src/client/app/common/views/components/ui/horizon-group.vue
index 339ab790a..33d030010 100644
--- a/src/client/app/common/views/components/ui/horizon-group.vue
+++ b/src/client/app/common/views/components/ui/horizon-group.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="vnxwkwuf" :class="{ inputs, noGrow }">
+<div class="vnxwkwuf" :class="{ inputs, noGrow }" :data-children-count="children">
 	<slot></slot>
 </div>
 </template>
@@ -21,6 +21,16 @@ export default Vue.extend({
 			required: false,
 			default: false
 		}
+	},
+	data() {
+		return {
+			children: 0
+		};
+	},
+	mounted() {
+		this.$nextTick(() => {
+			this.children = this.$slots.default.length;
+		});
 	}
 });
 </script>
@@ -48,4 +58,19 @@ export default Vue.extend({
 	> *:not(:last-child)
 		margin-right 16px !important
 
+	&[data-children-count="3"]
+		@media (max-width 600px)
+			display block
+
+			> *
+				display block
+				width 100% !important
+				margin 16px 0 !important
+
+				&:first-child
+					margin-top 0 !important
+
+				&:last-child
+					margin-bottom 0 !important
+
 </style>