mirror/hotomoe
1
0
Fork 0
mirror of https://github.com/hotomoe/hotomoe synced 2024-11-25 15:46:17 +09:00
Code

✌️

Browse Source
This commit is contained in:
syuilo 2018-06-16 07:31:35 +09:00
parent b600d462c1
commit 65f35dc9f4
2 changed files with 38 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
src/client/app/common/views/components/signin.vue
View File

@ -1,6 +1,7 @@
<template>
<form class="mk-signin" :class="{ signing }" @submit.prevent="onSubmit">
<ui-input v-model="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required @change="onUsernameChange">
<div class="avatar" :style="{ backgroundImage: user ? `url('${ user.avatarUrl }')` : null }"></div>
<ui-input v-model="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required @input="onUsernameChange">
<span>%i18n:@username%</span>
<span slot="prefix">@</span>
<span slot="suffix">@{{ host }}</span>
@ -37,6 +38,8 @@ export default Vue.extend({
username: this.username
}).then(user => {
this.user = user;
}, () => {
this.user = null;
});
},
onSubmit() {
@ -61,84 +64,19 @@ export default Vue.extend({
@import '~const.styl'
.mk-signin
color #555
&.signing
&, *
cursor wait !important
label
display block
margin 12px 0
[data-fa]
display block
pointer-events none
position absolute
bottom 0
top 0
left 0
z-index 1
margin auto
padding 0 16px
height 1em
color #898786
input[type=text]
input[type=password]
input[type=number]
user-select text
display inline-block
cursor auto
padding 0 0 0 38px
margin 0
width 100%
line-height 44px
font-size 1em
color rgba(#000, 0.7)
background #fff
outline none
border solid 1px #eee
border-radius 4px
&:hover
background rgba(255, 255, 255, 0.7)
border-color #ddd
& + i
color #797776
&:focus
background #fff
border-color #ccc
& + i
color #797776
[type=submit]
cursor pointer
padding 16px
margin -6px 0 0 0
width 100%
font-size 1.2em
color rgba(#000, 0.5)
outline none
border none
border-radius 0
background transparent
transition all .5s ease
&:hover
color $theme-color
transition all .2s ease
&:focus
color $theme-color
transition all .2s ease
&:active
color darken($theme-color, 30%)
transition all .2s ease
&:disabled
opacity 0.7
> .avatar
margin 16px auto 0 auto
width 64px
height 64px
background #ddd
background-position center
background-size cover
border-radius 100%
</style>

48
src/client/app/desktop/views/pages/welcome.vue
View File

@ -7,13 +7,6 @@
</button>
<div class="body" :style="{ backgroundImage: `url('${ welcomeBgUrl }')` }">
<div class="container">
<div class="info">
<span>%i18n:common.misskey% <b>{{ host }}</b></span>
<span class="stats" v-if="stats">
<span>%fa:user% {{ stats.originalUsersCount | number }}</span>
<span>%fa:pencil-alt% {{ stats.originalNotesCount | number }}</span>
</span>
</div>
<main>
<div class="about">
<h1 v-if="name">{{ name }}</h1>
@ -26,6 +19,13 @@
<mk-signin/>
</div>
</main>
<div class="info">
<span>%i18n:common.misskey% <b>{{ host }}</b></span>
<span class="stats" v-if="stats">
<span>%fa:user% {{ stats.originalUsersCount | number }}</span>
<span>%fa:pencil-alt% {{ stats.originalNotesCount | number }}</span>
</span>
</div>
<mk-nav class="nav"/>
</div>
<mk-forkit class="forkit"/>
@ -165,23 +165,6 @@ root(isDark)
$loginWidth = 340px
$width = $aboutWidth + $loginWidth
> .info
margin 0 auto 16px auto
padding 12px
width $width
font-size 14px
color #fff
background rgba(#000, 0.2)
border-radius 8px
> .stats
margin-left 16px
padding-left 16px
border-left solid 1px #fff
> *
margin-right 16px
> main
display flex
margin auto
@ -222,6 +205,23 @@ root(isDark)
padding 16px 32px 32px 32px
background #f5f5f5
> .info
margin 16px auto
padding 12px
width $width
font-size 14px
color #fff
background rgba(#000, 0.2)
border-radius 8px
> .stats
margin-left 16px
padding-left 16px
border-left solid 1px #fff
> *
margin-right 16px
> .nav
display block
margin 16px 0