sim1222/test1
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

✌️

Browse Source
This commit is contained in:
syuilo
2018-03-17 23:01:17 +09:00
parent c10c534d02
commit ab8eefda25
4 changed files with 96 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/web/app/common/views/components/welcome-timeline.vue
View File

@ -1,12 +1,12 @@
<template>
<div class="mk-welcome-timeline">
<div v-for="post in posts">
<router-link class="avatar-anchor" :to="`/${post.user.username}`">
<router-link class="avatar-anchor" :to="`/${post.user.username}`" v-user-preview="post.user.id">
<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=96`" alt="avatar"/>
</router-link>
<div class="body">
<header>
<router-link class="name" :to="`/${post.user.username}`">{{ post.user.name }}</router-link>
<router-link class="name" :to="`/${post.user.username}`" v-user-preview="post.user.id">{{ post.user.name }}</router-link>
<span class="username">@{{ post.user.username }}</span>
<div class="info">
<router-link class="created-at" :to="`/${post.user.username}/${post.id}`">
@ -100,6 +100,7 @@ export default Vue.extend({
overflow hidden
font-weight bold
text-overflow ellipsis
color #627079
> .username
margin 0 .5em 0 0

41
src/web/app/desktop/views/pages/welcome.vue
View File

@ -5,8 +5,13 @@
<div>
<div>
<h1>Share<br>Everything!</h1>
<p>ようこそ！ <b>Misskey</b>はTwitter風ミニブログSNSです。思ったことや皆と共有したいことを投稿しましょう。タイムラインを見れば、皆の関心事をすぐにチェックすることもできます。<a>詳しく...</a></p>
<p>ようこそ！ <b>Misskey</b>はTwitter風ミニブログSNSです。思ったことや皆と共有したいことを投稿しましょう。タイムラインを見れば、皆の関心事をすぐにチェックすることもできます。<a :href="aboutUrl">詳しく...</a></p>
<p><button class="signup" @click="signup">はじめる</button><button class="signin" @click="signin">ログイン</button></p>
<div class="users">
<router-link v-for="user in users" :key="user.id" class="avatar-anchor" :to="`/${user.username}`" v-user-preview="user.id">
<img class="avatar" :src="`${user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
</router-link>
</div>
</div>
<div>
<div>
@ -37,14 +42,24 @@
<script lang="ts">
import Vue from 'vue';
import { copyright } from '../../../config';
import { docsUrl, copyright, lang } from '../../../config';
export default Vue.extend({
data() {
return {
copyright
aboutUrl: `${docsUrl}/${lang}/about`,
copyright,
users: []
};
},
mounted() {
(this as any).api('users', {
sort: '+follower',
limit: 20
}).then(users => {
this.users = users;
});
},
methods: {
signup() {
this.$modal.show('signup');
@ -139,14 +154,22 @@ export default Vue.extend({
border-color darken($theme-color, 10%)
.signin
&:focus
color #444
&:hover
color #444
color #fff
&:active
color #333
> .users
margin 16px 0 0 0
> *
display inline-block
margin 4px
> *
display inline-block
width 38px
height 38px
vertical-align top
border-radius 6px
> div:last-child

44
src/web/app/mobile/views/pages/welcome.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="welcome">
<h1><b>Misskey</b>へようこそ</h1>
<p>Twitter風ミニブログSNS、Misskeyへようこそ。思ったことを投稿したり、タイムラインでみんなの投稿を読むこともできます。<a href="/signup">アカウントを作成する</a></p>
<p>Twitter風ミニブログSNS、Misskeyへようこそ。思ったことを投稿したり、タイムラインでみんなの投稿を読むこともできます。<br><a href="/signup">アカウントを作成する</a></p>
<div class="form">
<p>%fa:lock% ログイン</p>
<div>
@ -20,6 +20,11 @@
<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.avatar_url}?thumbnail&size=64`" alt="avatar"/>
</router-link>
</div>
<footer>
<small>{{ copyright }}</small>
</footer>
@ -39,11 +44,17 @@ export default Vue.extend({
password: '',
token: '',
apiUrl,
copyright
copyright,
users: []
};
},
mounted() {
document.documentElement.style.background = '#293946';
(this as any).api('users', {
sort: '+follower',
limit: 20
}).then(users => {
this.users = users;
});
},
methods: {
onUsernameChange() {
@ -82,7 +93,7 @@ export default Vue.extend({
padding 8px
font-size 1.5em
font-weight normal
color #c3c6ca
color #cacac3
& + p
margin 0 0 16px 0
@ -146,7 +157,7 @@ export default Vue.extend({
padding 16px
text-align center
.tl
> .tl
background #fff
border solid 1px rgba(0, 0, 0, 0.2)
border-radius 8px
@ -163,12 +174,33 @@ export default Vue.extend({
max-height 300px
overflow auto
> .users
margin 12px 0 0 0
> *
display inline-block
margin 4px
> *
display inline-block
width 38px
height 38px
vertical-align top
border-radius 6px
> footer
text-align center
color #949fa9
color #fff
> small
display block
margin 16px 0 0 0
opacity 0.7
</style>
<style lang="stylus">
html
body
background linear-gradient(to bottom, #1e1d65, #bd6659)
</style>