rudeshark.net/src/web/app/desktop/views/pages/welcome.vue

122 lines
2.1 KiB
Vue
Raw Normal View History

2018-02-10 06:56:33 +01:00
<template>
<div class="root">
<main>
<div>
2018-02-10 07:06:11 +01:00
<h1>Share<br>Everything!</h1>
2018-02-10 06:56:33 +01:00
<p>ようこそ <b>Misskey</b>はTwitter風ミニブログSNSです思ったこと共有したいことをシンプルに書き残せますタイムラインを見れば皆の反応や皆がどう思っているのかもすぐにわかります<a>詳しく...</a></p>
<p><button class="signup" @click="signup">はじめる</button><button class="signin" @click="signin">ログイン</button></p>
</div>
<div>
</div>
</main>
<mk-forkit/>
<footer>
<div>
<mk-nav-links/>
<p class="c">{ _COPYRIGHT_ }</p>
</div>
</footer>
</div>
</template>
<style>
#wait {
right: auto;
left: 15px;
}
</style>
<style lang="stylus" scoped>
.root
display flex
flex-direction column
flex 1
background #eee
$width = 1000px
> main
display flex
flex 1
max-width $width
margin 0 auto
padding 80px 0 0 0
> div:first-child
margin 0 auto 0 0
width calc(100% - 500px)
color #777
> h1
margin 0
font-weight normal
2018-02-10 07:06:11 +01:00
font-variant small-caps
letter-spacing 12px
2018-02-10 06:56:33 +01:00
> p
margin 0.5em 0
line-height 2em
button
padding 8px 16px
font-size inherit
.signup
color $theme-color
border solid 2px $theme-color
border-radius 4px
&:focus
box-shadow 0 0 0 3px rgba($theme-color, 0.2)
&:hover
color $theme-color-foreground
background $theme-color
&:active
color $theme-color-foreground
background darken($theme-color, 10%)
border-color darken($theme-color, 10%)
.signin
&:focus
color #444
&:hover
color #444
&:active
color #333
> div:last-child
margin 0 0 0 auto
> footer
background #fff
*
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
border-top solid 1px #fff
> .c
margin 0
line-height 64px
font-size 10px
</style>
<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
})
</script>