From 7664354187a3847484f2a635e2eecd8a5be0b9f1 Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Sat, 10 Feb 2018 19:57:37 +0900
Subject: [PATCH] wip

---
 .../app/common/views/components/signup.vue    | 10 ++++-----
 src/web/app/desktop/views/pages/welcome.vue   | 21 +++++++++++++++----
 2 files changed, 22 insertions(+), 9 deletions(-)

diff --git a/src/web/app/common/views/components/signup.vue b/src/web/app/common/views/components/signup.vue
index 723555cdc..5bb464785 100644
--- a/src/web/app/common/views/components/signup.vue
+++ b/src/web/app/common/views/components/signup.vue
@@ -1,5 +1,5 @@
 <template>
-<form class="form" @submit.prevent="onSubmit" autocomplete="off">
+<form class="mk-signup" @submit.prevent="onSubmit" autocomplete="off">
 	<label class="username">
 		<p class="caption">%fa:at%%i18n:common.tags.mk-signup.username%</p>
 		<input v-model="username" type="text" pattern="^[a-zA-Z0-9-]{3,20}$" placeholder="a~z、A~Z、0~9、-" autocomplete="off" required @keyup="onChangeUsername"/>
@@ -24,7 +24,7 @@
 	</label>
 	<label class="retype-password">
 		<p class="caption">%fa:lock%%i18n:common.tags.mk-signup.password%(%i18n:common.tags.mk-signup.retype%)</p>
-		<input v-model="passwordRetype" type="password" placeholder="%i18n:common.tags.mk-signup.retype-placeholder%" autocomplete="off" required @keyup="onChangePasswordRetype"/>
+		<input v-model="retypedPassword" type="password" placeholder="%i18n:common.tags.mk-signup.retype-placeholder%" autocomplete="off" required @keyup="onChangePasswordRetype"/>
 		<p class="info" v-if="passwordRetypeState == 'match'" style="color:#3CB7B5">%fa:check .fw%%i18n:common.tags.mk-signup.password-matched%</p>
 		<p class="info" v-if="passwordRetypeState == 'not-match'" style="color:#FF1161">%fa:exclamation-triangle .fw%%i18n:common.tags.mk-signup.password-not-matched%</p>
 	</label>
@@ -145,12 +145,12 @@ export default Vue.extend({
 </script>
 
 <style lang="stylus" scoped>
-.form
+.mk-signup
 	min-width 302px
 
 	label
 		display block
-		margin 16px 0
+		margin 0 0 16px 0
 
 		> .caption
 			margin 0 0 4px 0
@@ -260,7 +260,7 @@ export default Vue.extend({
 			color #555
 
 	button
-		margin 0 0 32px 0
+		margin 0
 		padding 16px
 		width 100%
 		font-size 1em
diff --git a/src/web/app/desktop/views/pages/welcome.vue b/src/web/app/desktop/views/pages/welcome.vue
index b47e82fae..234239f6e 100644
--- a/src/web/app/desktop/views/pages/welcome.vue
+++ b/src/web/app/desktop/views/pages/welcome.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="root">
+<div class="mk-welcome">
 	<main>
 		<div>
 			<h1>Share<br>Everything!</h1>
@@ -17,8 +17,9 @@
 			<p class="c">{ _COPYRIGHT_ }</p>
 		</div>
 	</footer>
-	<modal name="signup">
-		<mk-signup></mk-signup>
+	<modal name="signup" width="500px" height="auto" scrollable>
+		<header :class="$style.signupFormHeader">新規登録</header>
+		<mk-signup :class="$style.signupForm"></mk-signup>
 	</modal>
 </div>
 </template>
@@ -43,7 +44,7 @@ export default Vue.extend({
 </style>
 
 <style lang="stylus" scoped>
-.root
+.mk-welcome
 	display flex
 	flex-direction column
 	flex 1
@@ -127,3 +128,15 @@ export default Vue.extend({
 				font-size 10px
 
 </style>
+
+<style lang="stylus" module>
+.signupForm
+	padding 24px 48px 48px 48px
+
+.signupFormHeader
+	padding 48px 0 12px 0
+	margin: 0 48px
+	font-size 1.5em
+	color #777
+	border-bottom solid 1px #eee
+</style>