diff options
| author | syuilo <syuilotan@yahoo.co.jp> | 2018-04-27 19:12:15 +0900 |
|---|---|---|
| committer | syuilo <syuilotan@yahoo.co.jp> | 2018-04-27 19:12:15 +0900 |
| commit | 0f27b629244ebaba1036596ffd2044126de94d07 (patch) | |
| tree | 4001424f660328b413d978475d8bef8d692e6031 /src/client/app | |
| parent | Update README.md (diff) | |
| download | misskey-0f27b629244ebaba1036596ffd2044126de94d07.tar.gz misskey-0f27b629244ebaba1036596ffd2044126de94d07.tar.bz2 misskey-0f27b629244ebaba1036596ffd2044126de94d07.zip | |
Update dependencies :rocket:
Diffstat (limited to 'src/client/app')
| -rw-r--r-- | src/client/app/desktop/views/pages/welcome.vue | 9 | ||||
| -rw-r--r-- | src/client/app/mobile/views/pages/welcome.vue | 241 |
2 files changed, 122 insertions, 128 deletions
diff --git a/src/client/app/desktop/views/pages/welcome.vue b/src/client/app/desktop/views/pages/welcome.vue index 93d17b58fe..6bda29326f 100644 --- a/src/client/app/desktop/views/pages/welcome.vue +++ b/src/client/app/desktop/views/pages/welcome.vue @@ -125,7 +125,8 @@ export default Vue.extend({ flex 1 $width = 1000px - background-image url('/assets/welcome-bg.svg') + background linear-gradient(to bottom, #1e1d65, #bd6659) + //background-image url('/assets/welcome-bg.svg') background-size cover background-position top center @@ -309,9 +310,3 @@ export default Vue.extend({ a color #666 </style> - -<style lang="stylus"> -html -body - background linear-gradient(to bottom, #1e1d65, #bd6659) -</style> diff --git a/src/client/app/mobile/views/pages/welcome.vue b/src/client/app/mobile/views/pages/welcome.vue index 27baf8bee4..1bc7ffd862 100644 --- a/src/client/app/mobile/views/pages/welcome.vue +++ b/src/client/app/mobile/views/pages/welcome.vue @@ -1,33 +1,35 @@ <template> <div class="welcome"> - <h1><b>Misskey</b>へようこそ</h1> - <p>Twitter風ミニブログSNS、Misskeyへようこそ。共有したいことを投稿したり、タイムラインでみんなの投稿を読むこともできます。<br><a href="/signup">アカウントを作成する</a></p> - <div class="form"> - <p>%fa:lock% ログイン</p> - <div> - <form @submit.prevent="onSubmit"> - <input v-model="username" type="text" pattern="^[a-zA-Z0-9_]+$" placeholder="ユーザー名" autofocus required @change="onUsernameChange"/> - <input v-model="password" type="password" placeholder="パスワード" required/> - <input v-if="user && user.twoFactorEnabled" v-model="token" type="number" placeholder="トークン" required/> - <button type="submit" :disabled="signing">{{ signing ? 'ログインしています' : 'ログイン' }}</button> - </form> + <div> + <h1><b>Misskey</b>へようこそ</h1> + <p>Twitter風ミニブログSNS、Misskeyへようこそ。共有したいことを投稿したり、タイムラインでみんなの投稿を読むこともできます。<br><a href="/signup">アカウントを作成する</a></p> + <div class="form"> + <p>%fa:lock% ログイン</p> <div> - <a :href="`${apiUrl}/signin/twitter`">Twitterでログイン</a> + <form @submit.prevent="onSubmit"> + <input v-model="username" type="text" pattern="^[a-zA-Z0-9_]+$" placeholder="ユーザー名" autofocus required @change="onUsernameChange"/> + <input v-model="password" type="password" placeholder="パスワード" required/> + <input v-if="user && user.twoFactorEnabled" v-model="token" type="number" placeholder="トークン" required/> + <button type="submit" :disabled="signing">{{ signing ? 'ログインしています' : 'ログイン' }}</button> + </form> + <div> + <a :href="`${apiUrl}/signin/twitter`">Twitterでログイン</a> + </div> </div> </div> + <div class="tl"> + <p>%fa:comments R% タイムラインを見てみる</p> + <mk-welcome-timeline/> + </div> + <div class="users"> + <router-link v-for="user in users" :key="user.id" class="avatar-anchor" :to="`/@${user.username}`"> + <img class="avatar" :src="`${user.avatarUrl}?thumbnail&size=64`" alt="avatar"/> + </router-link> + </div> + <footer> + <small>{{ copyright }}</small> + </footer> </div> - <div class="tl"> - <p>%fa:comments R% タイムラインを見てみる</p> - <mk-welcome-timeline/> - </div> - <div class="users"> - <router-link v-for="user in users" :key="user.id" class="avatar-anchor" :to="`/@${user.username}`"> - <img class="avatar" :src="`${user.avatarUrl}?thumbnail&size=64`" alt="avatar"/> - </router-link> - </div> - <footer> - <small>{{ copyright }}</small> - </footer> </div> </template> @@ -84,123 +86,120 @@ export default Vue.extend({ <style lang="stylus" scoped> .welcome - padding 16px - margin 0 auto - max-width 500px - - h1 - margin 0 - padding 8px - font-size 1.5em - font-weight normal - color #cacac3 - - & + p - margin 0 0 16px 0 - padding 0 8px 0 8px - color #949fa9 + background linear-gradient(to bottom, #1e1d65, #bd6659) - .form - margin-bottom 16px - background #fff - border solid 1px rgba(0, 0, 0, 0.2) - border-radius 8px - overflow hidden + > div + padding 16px + margin 0 auto + max-width 500px - > p + h1 margin 0 - padding 12px 20px - color #555 - background #f5f5f5 - border-bottom solid 1px #ddd + padding 8px + font-size 1.5em + font-weight normal + color #cacac3 - > div + & + p + margin 0 0 16px 0 + padding 0 8px 0 8px + color #949fa9 - > form - padding 16px + .form + margin-bottom 16px + background #fff + border solid 1px rgba(0, 0, 0, 0.2) + border-radius 8px + overflow hidden + + > p + margin 0 + padding 12px 20px + color #555 + background #f5f5f5 border-bottom solid 1px #ddd - input - display block - padding 12px - margin 0 0 16px 0 - width 100% - font-size 1em - color rgba(0, 0, 0, 0.7) - background #fff - outline none - border solid 1px #ddd - border-radius 4px + > div - button - display block - width 100% - padding 10px - margin 0 - color #333 - font-size 1em - text-align center - text-decoration none - text-shadow 0 1px 0 rgba(255, 255, 255, 0.9) - background-image linear-gradient(#fafafa, #eaeaea) - border 1px solid #ddd - border-bottom-color #cecece - border-radius 4px + > form + padding 16px + border-bottom solid 1px #ddd - &:active - background-color #767676 - background-image none - border-color #444 - box-shadow 0 1px 3px rgba(0, 0, 0, 0.075), inset 0 0 5px rgba(0, 0, 0, 0.2) + input + display block + padding 12px + margin 0 0 16px 0 + width 100% + font-size 1em + color rgba(0, 0, 0, 0.7) + background #fff + outline none + border solid 1px #ddd + border-radius 4px - > div - padding 16px - text-align center + button + display block + width 100% + padding 10px + margin 0 + color #333 + font-size 1em + text-align center + text-decoration none + text-shadow 0 1px 0 rgba(255, 255, 255, 0.9) + background-image linear-gradient(#fafafa, #eaeaea) + border 1px solid #ddd + border-bottom-color #cecece + border-radius 4px - > .tl - background #fff - border solid 1px rgba(0, 0, 0, 0.2) - border-radius 8px - overflow hidden + &:active + background-color #767676 + background-image none + border-color #444 + box-shadow 0 1px 3px rgba(0, 0, 0, 0.075), inset 0 0 5px rgba(0, 0, 0, 0.2) - > p - margin 0 - padding 12px 20px - color #555 - background #f5f5f5 - border-bottom solid 1px #ddd + > div + padding 16px + text-align center - > .mk-welcome-timeline - max-height 300px - overflow auto + > .tl + background #fff + border solid 1px rgba(0, 0, 0, 0.2) + border-radius 8px + overflow hidden - > .users - margin 12px 0 0 0 + > p + margin 0 + padding 12px 20px + color #555 + background #f5f5f5 + border-bottom solid 1px #ddd + + > .mk-welcome-timeline + max-height 300px + overflow auto - > * - display inline-block - margin 4px + > .users + margin 12px 0 0 0 > * display inline-block - width 38px - height 38px - vertical-align top - border-radius 6px + margin 4px - > footer - text-align center - color #fff + > * + display inline-block + width 38px + height 38px + vertical-align top + border-radius 6px - > small - display block - margin 16px 0 0 0 - opacity 0.7 + > footer + text-align center + color #fff -</style> + > small + display block + margin 16px 0 0 0 + opacity 0.7 -<style lang="stylus"> -html -body - background linear-gradient(to bottom, #1e1d65, #bd6659) </style> |