This commit is contained in:
syuilo
2018-04-29 08:51:17 +09:00
parent e9940c9221
commit f2874d778a
75 changed files with 265 additions and 190 deletions

View File

@@ -61,6 +61,6 @@ svg
&.day
&:hover
fill rgba(0, 0, 0, 0.05)
fill rgba(#000, 0.05)
</style>

View File

@@ -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

View File

@@ -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]

View File

@@ -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]

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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">

View File

@@ -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

View File

@@ -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)

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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