nanka iroiro

This commit is contained in:
syuilo 2017-11-15 06:45:54 +09:00
parent dfbb4755d6
commit da51161eb9
11 changed files with 339 additions and 248 deletions

View file

@ -50,6 +50,15 @@ common:
my-token-regenerated: "Your token is just regenerated, so you will signout." my-token-regenerated: "Your token is just regenerated, so you will signout."
tags: tags:
mk-nav-links:
about: "About"
stats: "Stats"
status: "Status"
wiki: "Wiki"
donors: "Donors"
repository: "Repository"
develop: "Developers"
mk-messaging-form: mk-messaging-form:
attach-from-local: "Attach file from your pc" attach-from-local: "Attach file from your pc"
attach-from-drive: "Attach file from the drive" attach-from-drive: "Attach file from the drive"
@ -256,15 +265,6 @@ desktop:
cancel: "Cancel" cancel: "Cancel"
upload: "Upload a file(s) from you PC" upload: "Upload a file(s) from you PC"
mk-nav-home-widget:
about: "About"
stats: "Stats"
status: "Status"
wiki: "Wiki"
donors: "Donors"
repository: "Repository"
develop: "Developers"
mk-ui-header-nav: mk-ui-header-nav:
home: "Home" home: "Home"
messaging: "Messages" messaging: "Messages"
@ -408,6 +408,8 @@ desktop:
title: "Are you sure you want to repost this post?" title: "Are you sure you want to repost this post?"
mk-user: mk-user:
last-used-at: "Last used at"
photos: photos:
title: "Photos" title: "Photos"
loading: "Loading" loading: "Loading"

View file

@ -50,6 +50,15 @@ common:
my-token-regenerated: "あなたのトークンが更新されたのでサインアウトします。" my-token-regenerated: "あなたのトークンが更新されたのでサインアウトします。"
tags: tags:
mk-nav-links:
about: "Misskeyについて"
stats: "統計"
status: "ステータス"
wiki: "Wiki"
donors: "ドナー"
repository: "リポジトリ"
develop: "開発者"
mk-messaging-form: mk-messaging-form:
attach-from-local: "PCからファイルを添付する" attach-from-local: "PCからファイルを添付する"
attach-from-drive: "ドライブからファイルを添付する" attach-from-drive: "ドライブからファイルを添付する"
@ -256,15 +265,6 @@ desktop:
cancel: "キャンセル" cancel: "キャンセル"
upload: "PCからドライブにファイルをアップロード" upload: "PCからドライブにファイルをアップロード"
mk-nav-home-widget:
about: "Misskeyについて"
stats: "統計"
status: "ステータス"
wiki: "Wiki"
donors: "ドナー"
repository: "リポジトリ"
develop: "開発者"
mk-ui-header-nav: mk-ui-header-nav:
home: "ホーム" home: "ホーム"
messaging: "メッセージ" messaging: "メッセージ"
@ -408,6 +408,8 @@ desktop:
title: "この投稿をRepostしますか" title: "この投稿をRepostしますか"
mk-user: mk-user:
last-used-at: "最終アクセス"
photos: photos:
title: "フォト" title: "フォト"
loading: "読み込み中" loading: "読み込み中"

View file

@ -28,3 +28,4 @@ require('./reaction-picker.tag');
require('./reactions-viewer.tag'); require('./reactions-viewer.tag');
require('./reaction-icon.tag'); require('./reaction-icon.tag');
require('./post-menu.tag'); require('./post-menu.tag');
require('./nav-links.tag');

View file

@ -0,0 +1,7 @@
<mk-nav-links>
<a href={ CONFIG.aboutUrl }>%i18n:common.tags.mk-nav-links.about%</a><i></i><a href={ CONFIG.statsUrl }>%i18n:common.tags.mk-nav-links.stats%</a><i></i><a href={ CONFIG.statusUrl }>%i18n:common.tags.mk-nav-links.status%</a><i></i><a href="http://zawazawa.jp/misskey/">%i18n:common.tags.mk-nav-links.wiki%</a><i></i><a href="https://github.com/syuilo/misskey/blob/master/DONORS.md">%i18n:common.tags.mk-nav-links.donors%</a><i></i><a href="https://github.com/syuilo/misskey">%i18n:common.tags.mk-nav-links.repository%</a><i></i><a href={ CONFIG.devUrl }>%i18n:common.tags.mk-nav-links.develop%</a><i></i><a href="https://twitter.com/misskey_xyz" target="_blank">Follow us on <i class="fa fa-twitter"></i></a>
<style>
:scope
display inline
</style>
</mk-nav-links>

BIN
src/web/app/desktop/assets/index.jpg (Stored with Git LFS) Normal file

Binary file not shown.

View file

@ -1,4 +1,5 @@
<mk-nav-home-widget><a href={ CONFIG.aboutUrl }>%i18n:desktop.tags.mk-nav-home-widget.about%</a><i></i><a href={ CONFIG.statsUrl }>%i18n:desktop.tags.mk-nav-home-widget.stats%</a><i></i><a href={ CONFIG.statusUrl }>%i18n:desktop.tags.mk-nav-home-widget.status%</a><i></i><a href="http://zawazawa.jp/misskey/">%i18n:desktop.tags.mk-nav-home-widget.wiki%</a><i></i><a href="https://github.com/syuilo/misskey/blob/master/DONORS.md">%i18n:desktop.tags.mk-nav-home-widget.donors%</a><i></i><a href="https://github.com/syuilo/misskey">%i18n:desktop.tags.mk-nav-home-widget.repository%</a><i></i><a href={ CONFIG.devUrl }>%i18n:desktop.tags.mk-nav-home-widget.develop%</a><i></i><a href="https://twitter.com/misskey_xyz" target="_blank">Follow us on <i class="fa fa-twitter"></i></a> <mk-nav-home-widget>
<mk-nav-links/>
<style> <style>
:scope :scope
display block display block

View file

@ -56,8 +56,6 @@ require('./user-timeline.tag');
require('./user.tag'); require('./user.tag');
require('./big-follow-button.tag'); require('./big-follow-button.tag');
require('./pages/entrance.tag'); require('./pages/entrance.tag');
require('./pages/entrance/signin.tag');
require('./pages/entrance/signup.tag');
require('./pages/home.tag'); require('./pages/home.tag');
require('./pages/home-customize.tag'); require('./pages/home-customize.tag');
require('./pages/user.tag'); require('./pages/user.tag');

View file

@ -1,16 +1,25 @@
<mk-entrance> <mk-entrance>
<main> <main>
<img src="/assets/title.svg" alt="Misskey"/> <div>
<mk-entrance-signin if={ mode == 'signin' }/> <h1>どこにいても、ここにあります</h1>
<mk-entrance-signup if={ mode == 'signup' }/> <p>ようこそ! MisskeyはTwitter風ミニブログSNSです――思ったこと、共有したいことをシンプルに書き残せます。タイムラインを見れば、皆の反応や皆がどう思っているのかもすぐにわかります。</p>
<div class="introduction" if={ mode == 'introduction' }> <p if={ stats }>これまでに{ stats.posts_count }投稿されました</p>
<mk-introduction/> </div>
<button onclick={ signin }>わかった</button> <div>
<mk-entrance-signin if={ mode == 'signin' }/>
<mk-entrance-signup if={ mode == 'signup' }/>
<div class="introduction" if={ mode == 'introduction' }>
<mk-introduction/>
<button onclick={ signin }>わかった</button>
</div>
</div> </div>
</main> </main>
<mk-forkit/> <mk-forkit/>
<footer> <footer>
<mk-copyright/> <div>
<mk-nav-links/>
<mk-copyright/>
</div>
</footer> </footer>
<!-- ↓ https://github.com/riot/riot/issues/2134 (将来的)--> <!-- ↓ https://github.com/riot/riot/issues/2134 (将来的)-->
<style data-disable-scope="data-disable-scope"> <style data-disable-scope="data-disable-scope">
@ -21,66 +30,100 @@
</style> </style>
<style> <style>
:scope :scope
$width = 1000px
display block display block
height 100%
&:before
content ""
display block
position fixed
width 100%
height 100%
background rgba(0, 0, 0, 0.3)
> main > main
display block display block
max-width $width
margin 0 auto
padding 64px 0 0 0
padding-bottom 16px padding-bottom 16px
> img &:after
content ""
display block display block
width 160px clear both
height 170px
margin 0 auto
pointer-events none
user-select none
> .introduction > div:first-child
max-width 360px position absolute
margin 0 auto top 64px
color #777 left 0
width calc(100% - 500px)
color #fff
text-shadow 0 0 32px rgba(0, 0, 0, 0.5)
font-weight bold
> mk-introduction > p:last-child
padding 32px padding 1em 0 0 0
background #fff border-top solid 1px #fff
box-shadow 0 4px 16px rgba(0, 0, 0, 0.2)
> button > div:last-child
display block float right
margin 16px auto 0 auto
color #666
&:hover > .introduction
text-decoration underline max-width 360px
margin 0 auto
color #777
> .tl > mk-introduction
padding 32px 0 padding 32px
background #fff background #fff
box-shadow 0 4px 16px rgba(0, 0, 0, 0.2)
> h2 > button
display block display block
margin 0 margin 16px auto 0 auto
padding 0 color #666
text-align center
font-size 20px &:hover
color #5b6b73 text-decoration underline
> mk-public-timeline
max-width 500px
margin 0 auto
> footer > footer
> mk-copyright *
margin 0 color #fff !important
text-shadow 0 0 8px #000
font-weight bold
> div
max-width $width
margin 0 auto
padding 16px 0
text-align center text-align center
line-height 64px border-top solid 1px #fff
font-size 10px
color rgba(#000, 0.5) > mk-copyright
margin 0
line-height 64px
font-size 10px
</style> </style>
<script> <script>
this.mixin('api');
this.mode = 'signin'; this.mode = 'signin';
this.on('mount', () => {
document.documentElement.style.backgroundImage = 'url("/assets/desktop/index.jpg")';
document.documentElement.style.backgroundSize = 'cover';
document.documentElement.style.backgroundPosition = 'center';
this.api('stats').then(stats => {
this.update({
stats
});
});
});
this.signup = () => { this.signup = () => {
this.update({ this.update({
mode: 'signup' mode: 'signup'
@ -100,3 +143,194 @@
}; };
</script> </script>
</mk-entrance> </mk-entrance>
<mk-entrance-signin>
<a class="help" href={ CONFIG.aboutUrl + '/help' } title="お困りですか?"><i class="fa fa-question"></i></a>
<div class="form">
<h1><img if={ user } src={ user.avatar_url + '?thumbnail&size=32' }/>
<p>{ user ? user.name : 'アカウント' }</p>
</h1>
<mk-signin ref="signin"/>
</div>
<div class="divider"><span>or</span></div>
<button class="signup" onclick={ parent.signup }>新規登録</button><a class="introduction" onclick={ introduction }>Misskeyについて</a>
<style>
:scope
display block
width 290px
margin 0 auto
text-align center
&:hover
> .help
opacity 1
> .help
cursor pointer
display block
position absolute
top 0
right 0
z-index 1
margin 0
padding 0
font-size 1.2em
color #999
border none
outline none
background transparent
opacity 0
transition opacity 0.1s ease
&:hover
color #444
&:active
color #222
> i
padding 14px
> .form
padding 10px 28px 16px 28px
background #fff
box-shadow 0px 4px 16px rgba(0, 0, 0, 0.2)
> h1
display block
margin 0
padding 0
height 54px
line-height 54px
text-align center
text-transform uppercase
font-size 1em
font-weight bold
color rgba(0, 0, 0, 0.5)
border-bottom solid 1px rgba(0, 0, 0, 0.1)
> p
display inline
margin 0
padding 0
> img
display inline-block
top 10px
width 32px
height 32px
margin-right 8px
border-radius 100%
&[src='']
display none
> .divider
padding 16px 0
text-align center
&:before
&:after
content ""
display block
position absolute
top 50%
width 45%
height 1px
border-top solid 1px rgba(0, 0, 0, 0.1)
&:before
left 0
&:after
right 0
> *
z-index 1
padding 0 8px
color #fff
text-shadow 0 0 8px rgba(0, 0, 0, 0.5)
> .signup
width 100%
line-height 56px
font-size 1em
color #fff
background $theme-color
border-radius 64px
&:hover
background lighten($theme-color, 5%)
&:active
background darken($theme-color, 5%)
> .introduction
display inline-block
margin-top 16px
font-size 12px
color #666
</style>
<script>
this.on('mount', () => {
this.refs.signin.on('user', user => {
this.update({
user: user
});
});
});
this.introduction = () => {
this.parent.introduction();
};
</script>
</mk-entrance-signin>
<mk-entrance-signup>
<mk-signup/>
<button class="cancel" type="button" onclick={ parent.signin } title="キャンセル"><i class="fa fa-times"></i></button>
<style>
:scope
display block
width 368px
margin 0 auto
&:hover
> .cancel
opacity 1
> mk-signup
padding 18px 32px 0 32px
background #fff
box-shadow 0px 4px 16px rgba(0, 0, 0, 0.2)
> .cancel
cursor pointer
display block
position absolute
top 0
right 0
z-index 1
margin 0
padding 0
font-size 1.2em
color #999
border none
outline none
box-shadow none
background transparent
opacity 0
transition opacity 0.1s ease
&:hover
color #555
&:active
color #222
> i
padding 14px
</style>
</mk-entrance-signup>

View file

@ -1,134 +0,0 @@
<mk-entrance-signin><a class="help" href={ CONFIG.aboutUrl + '/help' } title="お困りですか?"><i class="fa fa-question"></i></a>
<div class="form">
<h1><img if={ user } src={ user.avatar_url + '?thumbnail&size=32' }/>
<p>{ user ? user.name : 'アカウント' }</p>
</h1>
<mk-signin ref="signin"/>
</div>
<div class="divider"><span>or</span></div>
<button class="signup" onclick={ parent.signup }>新規登録</button><a class="introduction" onclick={ introduction }>Misskeyについて</a>
<style>
:scope
display block
width 290px
margin 0 auto
text-align center
&:hover
> .help
opacity 1
> .help
cursor pointer
display block
position absolute
top 0
right 0
z-index 1
margin 0
padding 0
font-size 1.2em
color #999
border none
outline none
background transparent
opacity 0
transition opacity 0.1s ease
&:hover
color #444
&:active
color #222
> i
padding 14px
> .form
padding 10px 28px 16px 28px
background #fff
box-shadow 0px 4px 16px rgba(0, 0, 0, 0.2)
> h1
display block
margin 0
padding 0
height 54px
line-height 54px
text-align center
text-transform uppercase
font-size 1em
font-weight bold
color rgba(0, 0, 0, 0.5)
border-bottom solid 1px rgba(0, 0, 0, 0.1)
> p
display inline
margin 0
padding 0
> img
display inline-block
top 10px
width 32px
height 32px
margin-right 8px
border-radius 100%
&[src='']
display none
> .divider
padding 16px 0
text-align center
&:after
content ""
display block
position absolute
top 50%
width 100%
height 1px
border-top solid 1px rgba(0, 0, 0, 0.1)
> *
z-index 1
padding 0 8px
color rgba(0, 0, 0, 0.5)
background #f7f7f7
> .signup
width 100%
line-height 56px
font-size 1em
color #fff
background $theme-color
border-radius 64px
&:hover
background lighten($theme-color, 5%)
&:active
background darken($theme-color, 5%)
> .introduction
display inline-block
margin-top 16px
font-size 12px
color #666
</style>
<script>
this.on('mount', () => {
this.refs.signin.on('user', user => {
this.update({
user: user
});
});
});
this.introduction = () => {
this.parent.introduction();
};
</script>
</mk-entrance-signin>

View file

@ -1,47 +0,0 @@
<mk-entrance-signup>
<mk-signup/>
<button class="cancel" type="button" onclick={ parent.signin } title="キャンセル"><i class="fa fa-times"></i></button>
<style>
:scope
display block
width 368px
margin 0 auto
&:hover
> .cancel
opacity 1
> mk-signup
padding 18px 32px 0 32px
background #fff
box-shadow 0px 4px 16px rgba(0, 0, 0, 0.2)
> .cancel
cursor pointer
display block
position absolute
top 0
right 0
z-index 1
margin 0
padding 0
font-size 1.2em
color #999
border none
outline none
box-shadow none
background transparent
opacity 0
transition opacity 0.1s ease
&:hover
color #555
&:active
color #222
> i
padding 14px
</style>
</mk-entrance-signup>

View file

@ -610,6 +610,7 @@
<mk-user-profile user={ user }/> <mk-user-profile user={ user }/>
<mk-user-photos user={ user }/> <mk-user-photos user={ user }/>
<mk-user-followers-you-know if={ SIGNIN && I.id !== user.id } user={ user }/> <mk-user-followers-you-know if={ SIGNIN && I.id !== user.id } user={ user }/>
<p>%i18n:desktop.tags.mk-user.last-used-at%: <b><mk-time time={ user.last_used_at }/></b></p>
</div> </div>
<main> <main>
<mk-post-detail if={ user.pinned_post } post={ user.pinned_post } compact={ true }/> <mk-post-detail if={ user.pinned_post } post={ user.pinned_post } compact={ true }/>
@ -619,6 +620,7 @@
<mk-calendar-widget warp={ warp } start={ new Date(user.created_at) }/> <mk-calendar-widget warp={ warp } start={ new Date(user.created_at) }/>
<mk-activity-widget user={ user }/> <mk-activity-widget user={ user }/>
<mk-user-frequently-replied-users user={ user }/> <mk-user-frequently-replied-users user={ user }/>
<div class="nav"><mk-nav-links/></div>
</div> </div>
<style> <style>
:scope :scope
@ -646,9 +648,31 @@
&:first-child &:first-child
padding 16px 0 16px 16px padding 16px 0 16px 16px
> p
display block
margin 0
padding 0 12px
text-align center
font-size 0.8em
color #aaa
&:last-child &:last-child
padding 16px 16px 16px 0 padding 16px 16px 16px 0
> .nav
padding 16px
font-size 12px
color #aaa
background #fff
border solid 1px rgba(0, 0, 0, 0.075)
border-radius 6px
a
color #999
i
color #ccc
</style> </style>
<script> <script>
this.mixin('i'); this.mixin('i');