mirror/hotomoe
1
0
Fork 0
mirror of https://github.com/hotomoe/hotomoe synced 2024-11-29 23:38:13 +09:00
Code

[wip] darkmode

Browse Source
This commit is contained in:
syuilo 2018-04-20 05:06:32 +09:00
parent 5ace37e3db
commit 9b3ee877a6
1 changed files with 12 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/client/app/desktop/views/components/post-form.vue
View File

@ -281,10 +281,10 @@ export default Vue.extend({
<style lang="stylus" scoped>
@import '~const.styl'
.mk-post-form
root(isDark)
display block
padding 16px
background lighten($theme-color, 95%)
background isDark ? #282C37 : lighten($theme-color, 95%)
&:after
content ""
@ -303,7 +303,7 @@ export default Vue.extend({
min-height calc(16px + 12px + 12px)
font-size 16px
color #333
background #fff
background isDark ? #191d23 : #fff
outline none
border solid 1px rgba($theme-color, 0.1)
border-radius 4px
@ -496,7 +496,7 @@ export default Vue.extend({
width 40px
height 40px
font-size 1em
color rgba($theme-color, 0.5)
color isDark ? $theme-color : rgba($theme-color, 0.5)
background transparent
outline none
border solid 1px transparent
@ -504,11 +504,11 @@ export default Vue.extend({
&:hover
background transparent
border-color rgba($theme-color, 0.3)
border-color isDark ? rgba($theme-color, 0.5) : rgba($theme-color, 0.3)
&:active
color rgba($theme-color, 0.6)
background linear-gradient(to bottom, lighten($theme-color, 80%) 0%, lighten($theme-color, 90%) 100%)
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
@ -533,4 +533,10 @@ export default Vue.extend({
border dashed 2px rgba($theme-color, 0.5)
pointer-events none
.mk-post-form[data-darkmode]
root(true)
.mk-post-form:not([data-darkmode])
root(false)
</style>