wip
This commit is contained in:
syuilo
parent
e9940c9221
commit
f2874d778a
75 changed files with 265 additions and 190 deletions
|
|
@ -61,6 +61,6 @@ svg
|
|||
|
||||
&.day
|
||||
&:hover
|
||||
fill rgba(0, 0, 0, 0.05)
|
||||
fill rgba(#000, 0.05)
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -136,7 +136,7 @@ export default Vue.extend({
|
|||
root(isDark)
|
||||
color isDark ? #c5ced6 : #777
|
||||
background isDark ? #282C37 : #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
&[data-melt]
|
||||
|
|
@ -152,7 +152,7 @@ root(isDark)
|
|||
font-size 0.9em
|
||||
font-weight bold
|
||||
color #888
|
||||
box-shadow 0 1px rgba(0, 0, 0, 0.07)
|
||||
box-shadow 0 1px rgba(#000, 0.07)
|
||||
|
||||
> [data-fa]
|
||||
margin-right 4px
|
||||
|
|
@ -214,10 +214,10 @@ root(isDark)
|
|||
border-radius 6px
|
||||
|
||||
&:hover > div
|
||||
background rgba(0, 0, 0, 0.025)
|
||||
background rgba(#000, 0.025)
|
||||
|
||||
&:active > div
|
||||
background rgba(0, 0, 0, 0.05)
|
||||
background rgba(#000, 0.05)
|
||||
|
||||
&[data-is-donichi]
|
||||
color #ef95a0
|
||||
|
|
@ -233,10 +233,10 @@ root(isDark)
|
|||
font-weight bold
|
||||
|
||||
> div
|
||||
background rgba(0, 0, 0, 0.025)
|
||||
background rgba(#000, 0.025)
|
||||
|
||||
&:active > div
|
||||
background rgba(0, 0, 0, 0.05)
|
||||
background rgba(#000, 0.05)
|
||||
|
||||
&[data-today]
|
||||
> div
|
||||
|
|
|
|||
|
|
@ -106,7 +106,7 @@ root(isDark)
|
|||
width $width
|
||||
background isDark ? #282c37 :#fff
|
||||
border-radius 0 4px 4px 4px
|
||||
box-shadow 2px 2px 8px rgba(0, 0, 0, 0.2)
|
||||
box-shadow 2px 2px 8px rgba(#000, 0.2)
|
||||
transition visibility 0s linear 0.2s
|
||||
|
||||
.menu[data-darkmode]
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@ root(isDark)
|
|||
font-size 0.8em
|
||||
background isDark ? #282c37 : #fff
|
||||
border-radius 0 4px 4px 4px
|
||||
box-shadow 2px 2px 8px rgba(0, 0, 0, 0.2)
|
||||
box-shadow 2px 2px 8px rgba(#000, 0.2)
|
||||
opacity 0
|
||||
|
||||
.context-menu[data-darkmode]
|
||||
|
|
|
|||
|
|
@ -102,7 +102,7 @@ export default Vue.extend({
|
|||
left 0
|
||||
width 100%
|
||||
height 100%
|
||||
background rgba(0, 0, 0, 0.7)
|
||||
background rgba(#000, 0.7)
|
||||
opacity 0
|
||||
pointer-events none
|
||||
|
||||
|
|
|
|||
|
|
@ -195,7 +195,7 @@ root(isDark)
|
|||
cursor pointer
|
||||
|
||||
&:hover
|
||||
background rgba(0, 0, 0, 0.05)
|
||||
background rgba(#000, 0.05)
|
||||
|
||||
> .label
|
||||
&:before
|
||||
|
|
@ -203,7 +203,7 @@ root(isDark)
|
|||
background #0b65a5
|
||||
|
||||
&:active
|
||||
background rgba(0, 0, 0, 0.1)
|
||||
background rgba(#000, 0.1)
|
||||
|
||||
> .label
|
||||
&:before
|
||||
|
|
|
|||
|
|
@ -587,7 +587,7 @@ root(isDark)
|
|||
font-size 0.9em
|
||||
color isDark ? #d2d9dc : #555
|
||||
background isDark ? #282c37 : #fff
|
||||
box-shadow 0 1px 0 rgba(0, 0, 0, 0.05)
|
||||
box-shadow 0 1px 0 rgba(#000, 0.05)
|
||||
|
||||
&, *
|
||||
user-select none
|
||||
|
|
@ -733,7 +733,7 @@ root(isDark)
|
|||
display inline-block
|
||||
position absolute
|
||||
top 0
|
||||
background-color rgba(0, 0, 0, 0.3)
|
||||
background-color rgba(#000, 0.3)
|
||||
border-radius 100%
|
||||
|
||||
animation sk-bounce 2.0s infinite ease-in-out
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
display inline-block
|
||||
width 18px
|
||||
height 18px
|
||||
background-color rgba(0, 0, 0, 0.3)
|
||||
background-color rgba(#000, 0.3)
|
||||
border-radius 100%
|
||||
animation bounce 1.4s infinite ease-in-out both
|
||||
|
||||
|
|
|
|||
|
|
@ -251,7 +251,7 @@ root(isDark)
|
|||
height 48px
|
||||
color isDark ? #fff : #000
|
||||
background isDark ? #313543 : #f7f7f7
|
||||
box-shadow 0 1px 1px rgba(0, 0, 0, 0.075)
|
||||
box-shadow 0 1px 1px rgba(#000, 0.075)
|
||||
|
||||
> a
|
||||
display block
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@ export default Vue.extend({
|
|||
left 0
|
||||
width 100%
|
||||
height 100%
|
||||
background rgba(0, 0, 0, 0.7)
|
||||
background rgba(#000, 0.7)
|
||||
|
||||
> img
|
||||
position fixed
|
||||
|
|
|
|||
|
|
@ -54,7 +54,7 @@ export default Vue.extend({
|
|||
left 0
|
||||
width 100%
|
||||
height 100%
|
||||
background rgba(0, 0, 0, 0.7)
|
||||
background rgba(#000, 0.7)
|
||||
|
||||
> video
|
||||
position fixed
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@ export default Vue.extend({
|
|||
|
||||
.mk-mentions
|
||||
background #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
> header
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@
|
|||
</header>
|
||||
<div class="body">
|
||||
<div class="text">
|
||||
<span v-if="note.isHidden" style="opacity: 0.5">(この投稿は非公開です)</span>
|
||||
<mk-note-html v-if="note.text" :text="note.text" :i="os.i"/>
|
||||
</div>
|
||||
<div class="media" v-if="note.mediaIds.length > 0">
|
||||
|
|
|
|||
|
|
@ -39,6 +39,7 @@
|
|||
</header>
|
||||
<div class="body">
|
||||
<div class="text">
|
||||
<span v-if="p.isHidden" style="opacity: 0.5">(この投稿は非公開です)</span>
|
||||
<mk-note-html v-if="p.text" :text="p.text" :i="os.i"/>
|
||||
</div>
|
||||
<div class="media" v-if="p.media.length > 0">
|
||||
|
|
@ -222,7 +223,7 @@ root(isDark)
|
|||
overflow hidden
|
||||
text-align left
|
||||
background isDark ? #282C37 : #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.1)
|
||||
border solid 1px rgba(#000, 0.1)
|
||||
border-radius 8px
|
||||
|
||||
> .read-more
|
||||
|
|
|
|||
|
|
@ -607,7 +607,7 @@ root(isDark)
|
|||
|
||||
> .detail
|
||||
padding-top 4px
|
||||
background rgba(0, 0, 0, 0.0125)
|
||||
background rgba(#000, 0.0125)
|
||||
|
||||
.note[data-darkmode]
|
||||
root(true)
|
||||
|
|
|
|||
|
|
@ -204,7 +204,7 @@ root(isDark)
|
|||
padding 16px
|
||||
overflow-wrap break-word
|
||||
font-size 0.9em
|
||||
border-bottom solid 1px isDark ? #1c2023 : rgba(0, 0, 0, 0.05)
|
||||
border-bottom solid 1px isDark ? #1c2023 : rgba(#000, 0.05)
|
||||
|
||||
&:last-child
|
||||
border-bottom none
|
||||
|
|
@ -215,7 +215,7 @@ root(isDark)
|
|||
top 16px
|
||||
right 12px
|
||||
vertical-align top
|
||||
color isDark ? #606984 : rgba(0, 0, 0, 0.6)
|
||||
color isDark ? #606984 : rgba(#000, 0.6)
|
||||
font-size small
|
||||
|
||||
&:after
|
||||
|
|
@ -250,10 +250,10 @@ root(isDark)
|
|||
margin-right 4px
|
||||
|
||||
.note-preview
|
||||
color isDark ? #c2cad4 : rgba(0, 0, 0, 0.7)
|
||||
color isDark ? #c2cad4 : rgba(#000, 0.7)
|
||||
|
||||
.note-ref
|
||||
color isDark ? #c2cad4 : rgba(0, 0, 0, 0.7)
|
||||
color isDark ? #c2cad4 : rgba(#000, 0.7)
|
||||
|
||||
[data-fa]
|
||||
font-size 1em
|
||||
|
|
@ -282,7 +282,7 @@ root(isDark)
|
|||
font-size 0.8em
|
||||
color isDark ? #666b79 : #aaa
|
||||
background isDark ? #242731 : #fdfdfd
|
||||
border-bottom solid 1px isDark ? #1c2023 : rgba(0, 0, 0, 0.05)
|
||||
border-bottom solid 1px isDark ? #1c2023 : rgba(#000, 0.05)
|
||||
|
||||
span
|
||||
margin 0 16px
|
||||
|
|
@ -295,13 +295,13 @@ root(isDark)
|
|||
width 100%
|
||||
padding 16px
|
||||
color #555
|
||||
border-top solid 1px rgba(0, 0, 0, 0.05)
|
||||
border-top solid 1px rgba(#000, 0.05)
|
||||
|
||||
&:hover
|
||||
background rgba(0, 0, 0, 0.025)
|
||||
background rgba(#000, 0.025)
|
||||
|
||||
&:active
|
||||
background rgba(0, 0, 0, 0.05)
|
||||
background rgba(#000, 0.05)
|
||||
|
||||
&.fetching
|
||||
cursor wait
|
||||
|
|
|
|||
|
|
@ -364,7 +364,6 @@ root(isDark)
|
|||
clear both
|
||||
|
||||
> .content
|
||||
|
||||
> input
|
||||
> textarea
|
||||
display block
|
||||
|
|
@ -585,7 +584,7 @@ root(isDark)
|
|||
color rgba($theme-color, 0.6)
|
||||
background isDark ? transparent : linear-gradient(to bottom, lighten($theme-color, 80%) 0%, lighten($theme-color, 90%) 100%)
|
||||
border-color rgba($theme-color, 0.5)
|
||||
box-shadow 0 2px 4px rgba(0, 0, 0, 0.15) inset
|
||||
box-shadow 0 2px 4px rgba(#000, 0.15) inset
|
||||
|
||||
&:focus
|
||||
&:after
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ export default Vue.extend({
|
|||
|
||||
root(isDark)
|
||||
background isDark ? #282C37 : #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
> header
|
||||
|
|
|
|||
|
|
@ -165,7 +165,7 @@ root(isDark)
|
|||
font-size 0.8em
|
||||
background $bgcolor
|
||||
border-radius 4px
|
||||
box-shadow 0 1px 4px rgba(0, 0, 0, 0.25)
|
||||
box-shadow 0 1px 4px rgba(#000, 0.25)
|
||||
|
||||
&:before
|
||||
content ""
|
||||
|
|
@ -176,7 +176,7 @@ root(isDark)
|
|||
right 12px
|
||||
border-top solid 14px transparent
|
||||
border-right solid 14px transparent
|
||||
border-bottom solid 14px rgba(0, 0, 0, 0.1)
|
||||
border-bottom solid 14px rgba(#000, 0.1)
|
||||
border-left solid 14px transparent
|
||||
|
||||
&:after
|
||||
|
|
|
|||
|
|
@ -125,7 +125,7 @@ root(isDark)
|
|||
width 300px
|
||||
background $bgcolor
|
||||
border-radius 4px
|
||||
box-shadow 0 1px 4px rgba(0, 0, 0, 0.25)
|
||||
box-shadow 0 1px 4px rgba(#000, 0.25)
|
||||
|
||||
&:before
|
||||
content ""
|
||||
|
|
@ -136,7 +136,7 @@ root(isDark)
|
|||
right 74px
|
||||
border-top solid 14px transparent
|
||||
border-right solid 14px transparent
|
||||
border-bottom solid 14px rgba(0, 0, 0, 0.1)
|
||||
border-bottom solid 14px rgba(#000, 0.1)
|
||||
border-left solid 14px transparent
|
||||
|
||||
&:after
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@ export default Vue.extend({
|
|||
width 14em
|
||||
height 32px
|
||||
font-size 1em
|
||||
background rgba(0, 0, 0, 0.05)
|
||||
background rgba(#000, 0.05)
|
||||
outline none
|
||||
//border solid 1px #ddd
|
||||
border none
|
||||
|
|
@ -62,7 +62,7 @@ export default Vue.extend({
|
|||
color #9eaba8
|
||||
|
||||
&:hover
|
||||
background rgba(0, 0, 0, 0.08)
|
||||
background rgba(#000, 0.08)
|
||||
|
||||
&:focus
|
||||
box-shadow 0 0 0 2px rgba($theme-color, 0.5) !important
|
||||
|
|
|
|||
|
|
@ -103,7 +103,7 @@ root(isDark)
|
|||
top 0
|
||||
z-index 1000
|
||||
width 100%
|
||||
box-shadow 0 1px 1px rgba(0, 0, 0, 0.075)
|
||||
box-shadow 0 1px 1px rgba(#000, 0.075)
|
||||
|
||||
> .main
|
||||
height 48px
|
||||
|
|
|
|||
|
|
@ -94,7 +94,7 @@ root(isDark)
|
|||
width 250px
|
||||
background isDark ? #282c37 : #fff
|
||||
background-clip content-box
|
||||
border solid 1px rgba(0, 0, 0, 0.1)
|
||||
border solid 1px rgba(#000, 0.1)
|
||||
border-radius 4px
|
||||
overflow hidden
|
||||
opacity 0
|
||||
|
|
|
|||
|
|
@ -119,7 +119,7 @@ export default Vue.extend({
|
|||
overflow auto
|
||||
|
||||
> *
|
||||
border-bottom solid 1px rgba(0, 0, 0, 0.05)
|
||||
border-bottom solid 1px rgba(#000, 0.05)
|
||||
|
||||
> *
|
||||
max-width 600px
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ export default Vue.extend({
|
|||
<style lang="stylus" scoped>
|
||||
root(isDark)
|
||||
background isDark ? #282C37 : #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
overflow hidden
|
||||
|
||||
|
|
@ -55,7 +55,7 @@ root(isDark)
|
|||
font-size 0.9em
|
||||
font-weight bold
|
||||
color isDark ? #e3e5e8 : #888
|
||||
box-shadow 0 1px rgba(0, 0, 0, 0.07)
|
||||
box-shadow 0 1px rgba(#000, 0.07)
|
||||
|
||||
> [data-fa]
|
||||
margin-right 6px
|
||||
|
|
|
|||
|
|
@ -17,14 +17,16 @@
|
|||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
<div class="handle top" v-if="canResize" @mousedown.prevent="onTopHandleMousedown"></div>
|
||||
<div class="handle right" v-if="canResize" @mousedown.prevent="onRightHandleMousedown"></div>
|
||||
<div class="handle bottom" v-if="canResize" @mousedown.prevent="onBottomHandleMousedown"></div>
|
||||
<div class="handle left" v-if="canResize" @mousedown.prevent="onLeftHandleMousedown"></div>
|
||||
<div class="handle top-left" v-if="canResize" @mousedown.prevent="onTopLeftHandleMousedown"></div>
|
||||
<div class="handle top-right" v-if="canResize" @mousedown.prevent="onTopRightHandleMousedown"></div>
|
||||
<div class="handle bottom-right" v-if="canResize" @mousedown.prevent="onBottomRightHandleMousedown"></div>
|
||||
<div class="handle bottom-left" v-if="canResize" @mousedown.prevent="onBottomLeftHandleMousedown"></div>
|
||||
<template v-if="canResize">
|
||||
<div class="handle top" @mousedown.prevent="onTopHandleMousedown"></div>
|
||||
<div class="handle right" @mousedown.prevent="onRightHandleMousedown"></div>
|
||||
<div class="handle bottom" @mousedown.prevent="onBottomHandleMousedown"></div>
|
||||
<div class="handle left" @mousedown.prevent="onLeftHandleMousedown"></div>
|
||||
<div class="handle top-left" @mousedown.prevent="onTopLeftHandleMousedown"></div>
|
||||
<div class="handle top-right" @mousedown.prevent="onTopRightHandleMousedown"></div>
|
||||
<div class="handle bottom-right" @mousedown.prevent="onBottomRightHandleMousedown"></div>
|
||||
<div class="handle bottom-left" @mousedown.prevent="onBottomLeftHandleMousedown"></div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -85,7 +87,7 @@ export default Vue.extend({
|
|||
|
||||
computed: {
|
||||
isFlexible(): boolean {
|
||||
return this.height == null;
|
||||
return this.height == 'auto';
|
||||
},
|
||||
canResize(): boolean {
|
||||
return !this.isFlexible;
|
||||
|
|
@ -476,7 +478,7 @@ root(isDark)
|
|||
left 0
|
||||
width 100%
|
||||
height 100%
|
||||
background rgba(0, 0, 0, 0.7)
|
||||
background rgba(#000, 0.7)
|
||||
opacity 0
|
||||
pointer-events none
|
||||
|
||||
|
|
@ -493,7 +495,7 @@ root(isDark)
|
|||
&:focus
|
||||
&:not([data-is-modal])
|
||||
> .body
|
||||
box-shadow 0 0 0px 1px rgba($theme-color, 0.5), 0 2px 6px 0 rgba(0, 0, 0, 0.2)
|
||||
box-shadow 0 0 0px 1px rgba($theme-color, 0.5), 0 2px 6px 0 rgba(#000, 0.2)
|
||||
|
||||
> .handle
|
||||
$size = 8px
|
||||
|
|
@ -561,7 +563,7 @@ root(isDark)
|
|||
overflow hidden
|
||||
background isDark ? #282C37 : #fff
|
||||
border-radius 6px
|
||||
box-shadow 0 2px 6px 0 rgba(0, 0, 0, 0.2)
|
||||
box-shadow 0 2px 6px 0 rgba(#000, 0.2)
|
||||
|
||||
> header
|
||||
$header-height = 40px
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@ export default Vue.extend({
|
|||
.notes
|
||||
max-width 600px
|
||||
margin 0 auto
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
overflow hidden
|
||||
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ export default Vue.extend({
|
|||
<style lang="stylus" scoped>
|
||||
.followers-you-know
|
||||
background #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
> .title
|
||||
|
|
@ -49,7 +49,7 @@ export default Vue.extend({
|
|||
font-size 0.9em
|
||||
font-weight bold
|
||||
color #888
|
||||
box-shadow 0 1px rgba(0, 0, 0, 0.07)
|
||||
box-shadow 0 1px rgba(#000, 0.07)
|
||||
|
||||
> i
|
||||
margin-right 4px
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ export default Vue.extend({
|
|||
<style lang="stylus" scoped>
|
||||
.friends
|
||||
background #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
> .title
|
||||
|
|
@ -55,7 +55,7 @@ export default Vue.extend({
|
|||
font-size 0.9em
|
||||
font-weight bold
|
||||
color #888
|
||||
box-shadow 0 1px rgba(0, 0, 0, 0.07)
|
||||
box-shadow 0 1px rgba(#000, 0.07)
|
||||
|
||||
> i
|
||||
margin-right 4px
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@ export default Vue.extend({
|
|||
|
||||
overflow hidden
|
||||
background #f7f7f7
|
||||
box-shadow 0 1px 1px rgba(0, 0, 0, 0.075)
|
||||
box-shadow 0 1px 1px rgba(#000, 0.075)
|
||||
|
||||
> .is-suspended
|
||||
> .is-remote
|
||||
|
|
@ -99,7 +99,7 @@ export default Vue.extend({
|
|||
background-color #383838
|
||||
|
||||
> .fade
|
||||
background linear-gradient(transparent, rgba(0, 0, 0, 0.7))
|
||||
background linear-gradient(transparent, rgba(#000, 0.7))
|
||||
|
||||
> .container
|
||||
> .title
|
||||
|
|
@ -142,7 +142,7 @@ export default Vue.extend({
|
|||
margin 0
|
||||
border solid 3px #fff
|
||||
border-radius 8px
|
||||
box-shadow 1px 1px 3px rgba(0, 0, 0, 0.2)
|
||||
box-shadow 1px 1px 3px rgba(#000, 0.2)
|
||||
|
||||
> .title
|
||||
position absolute
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ export default Vue.extend({
|
|||
width calc(100% - 275px * 2)
|
||||
|
||||
> .timeline
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
> div
|
||||
|
|
@ -91,7 +91,7 @@ export default Vue.extend({
|
|||
font-size 12px
|
||||
color #aaa
|
||||
background #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
a
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ export default Vue.extend({
|
|||
<style lang="stylus" scoped>
|
||||
.photos
|
||||
background #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
> .title
|
||||
|
|
@ -52,7 +52,7 @@ export default Vue.extend({
|
|||
font-size 0.9em
|
||||
font-weight bold
|
||||
color #888
|
||||
box-shadow 0 1px rgba(0, 0, 0, 0.07)
|
||||
box-shadow 0 1px rgba(#000, 0.07)
|
||||
|
||||
> i
|
||||
margin-right 4px
|
||||
|
|
|
|||
|
|
@ -118,7 +118,7 @@ export default Vue.extend({
|
|||
<style lang="stylus" scoped>
|
||||
.profile
|
||||
background #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
> *:first-child
|
||||
|
|
|
|||
|
|
@ -231,14 +231,14 @@ export default Vue.extend({
|
|||
width 410px
|
||||
background #fff
|
||||
border-radius 8px
|
||||
box-shadow 0 0 0 12px rgba(0, 0, 0, 0.1)
|
||||
box-shadow 0 0 0 12px rgba(#000, 0.1)
|
||||
overflow hidden
|
||||
|
||||
> header
|
||||
z-index 1
|
||||
padding 12px 16px
|
||||
color #888d94
|
||||
box-shadow 0 1px 0px rgba(0, 0, 0, 0.1)
|
||||
box-shadow 0 1px 0px rgba(#000, 0.1)
|
||||
|
||||
> div
|
||||
position absolute
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@ export default define({
|
|||
<style lang="stylus" scoped>
|
||||
.mkw-channel
|
||||
background #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
overflow hidden
|
||||
|
||||
|
|
@ -73,7 +73,7 @@ export default define({
|
|||
font-size 0.9em
|
||||
font-weight bold
|
||||
color #888
|
||||
box-shadow 0 1px rgba(0, 0, 0, 0.07)
|
||||
box-shadow 0 1px rgba(#000, 0.07)
|
||||
|
||||
> [data-fa]
|
||||
margin-right 4px
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ export default define({
|
|||
.mkw-post-form
|
||||
background #fff
|
||||
overflow hidden
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
> .title
|
||||
|
|
@ -70,7 +70,7 @@ export default define({
|
|||
font-size 0.9em
|
||||
font-weight bold
|
||||
color #888
|
||||
box-shadow 0 1px rgba(0, 0, 0, 0.07)
|
||||
box-shadow 0 1px rgba(#000, 0.07)
|
||||
|
||||
> [data-fa]
|
||||
margin-right 4px
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ export default define({
|
|||
root(isDark)
|
||||
overflow hidden
|
||||
background isDark ? #282c37 : #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.075)
|
||||
border solid 1px rgba(#000, 0.075)
|
||||
border-radius 6px
|
||||
|
||||
&[data-compact]
|
||||
|
|
@ -54,14 +54,14 @@ root(isDark)
|
|||
display block
|
||||
width 100%
|
||||
height 100%
|
||||
background rgba(0, 0, 0, 0.5)
|
||||
background rgba(#000, 0.5)
|
||||
|
||||
> .avatar
|
||||
top ((100px - 58px) / 2)
|
||||
left ((100px - 58px) / 2)
|
||||
border none
|
||||
border-radius 100%
|
||||
box-shadow 0 0 16px rgba(0, 0, 0, 0.5)
|
||||
box-shadow 0 0 16px rgba(#000, 0.5)
|
||||
|
||||
> .name
|
||||
position absolute
|
||||
|
|
@ -70,7 +70,7 @@ root(isDark)
|
|||
margin 0
|
||||
line-height 100px
|
||||
color #fff
|
||||
text-shadow 0 0 8px rgba(0, 0, 0, 0.5)
|
||||
text-shadow 0 0 8px rgba(#000, 0.5)
|
||||
|
||||
> .username
|
||||
display none
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue