wip
This commit is contained in:
@@ -91,7 +91,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mk-dialog
|
||||
> .bg
|
||||
@@ -145,20 +145,20 @@ export default Vue.extend({
|
||||
margin 0 0.375em
|
||||
|
||||
&:hover
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
&:active
|
||||
color darken($theme-color, 10%)
|
||||
color var(--primaryDarken10)
|
||||
transition color 0s ease
|
||||
|
||||
</style>
|
||||
|
||||
<style lang="stylus" module>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.header
|
||||
margin 0 0 1em 0
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
// color #43A4EC
|
||||
font-weight bold
|
||||
|
||||
|
@@ -63,7 +63,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display block
|
||||
@@ -150,7 +150,7 @@ root(isDark)
|
||||
color #bf4633
|
||||
|
||||
&[data-is-selected]
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
&, *
|
||||
color #fff !important
|
||||
|
@@ -93,7 +93,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mk-follow-button
|
||||
display block
|
||||
@@ -105,29 +105,29 @@ export default Vue.extend({
|
||||
line-height 36px
|
||||
font-size 14px
|
||||
font-weight bold
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
background transparent
|
||||
outline none
|
||||
border solid 1px $theme-color
|
||||
border solid 1px var(--primary)
|
||||
border-radius 36px
|
||||
|
||||
&:hover
|
||||
background rgba($theme-color, 0.1)
|
||||
background var(--primaryAlpha01)
|
||||
|
||||
&:active
|
||||
background rgba($theme-color, 0.2)
|
||||
background var(--primaryAlpha02)
|
||||
|
||||
&.active
|
||||
color $theme-color-foreground
|
||||
background $theme-color
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
|
||||
&:hover
|
||||
background lighten($theme-color, 10%)
|
||||
border-color lighten($theme-color, 10%)
|
||||
background var(--primaryLighten10)
|
||||
border-color var(--primaryLighten10)
|
||||
|
||||
&:active
|
||||
background darken($theme-color, 10%)
|
||||
border-color darken($theme-color, 10%)
|
||||
background var(--primaryDarken10)
|
||||
border-color var(--primaryDarken10)
|
||||
|
||||
&.wait
|
||||
cursor wait !important
|
||||
|
@@ -41,11 +41,11 @@ export default Vue.extend({
|
||||
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mk-mute-button
|
||||
display block
|
||||
user-select none
|
||||
user-select none
|
||||
cursor pointer
|
||||
padding 0 16px
|
||||
margin 0
|
||||
@@ -53,27 +53,27 @@ export default Vue.extend({
|
||||
line-height 36px
|
||||
font-size 14px
|
||||
font-weight bold
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
background transparent
|
||||
outline none
|
||||
border solid 1px $theme-color
|
||||
border solid 1px var(--primary)
|
||||
border-radius 36px
|
||||
|
||||
&:hover
|
||||
background rgba($theme-color, 0.1)
|
||||
background var(--primaryAlpha01)
|
||||
|
||||
&:active
|
||||
background rgba($theme-color, 0.2)
|
||||
background var(--primaryAlpha02)
|
||||
|
||||
&.active
|
||||
color $theme-color-foreground
|
||||
background $theme-color
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
|
||||
&:hover
|
||||
background lighten($theme-color, 10%)
|
||||
border-color lighten($theme-color, 10%)
|
||||
background var(--primaryLighten10)
|
||||
border-color var(--primaryLighten10)
|
||||
&:active
|
||||
background darken($theme-color, 10%)
|
||||
border-color darken($theme-color, 10%)
|
||||
background var(--primaryDarken10)
|
||||
border-color var(--primaryDarken10)
|
||||
|
||||
</style>
|
||||
|
@@ -223,7 +223,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
overflow hidden
|
||||
@@ -422,7 +422,7 @@ root(isDark)
|
||||
color #999
|
||||
|
||||
&.reacted
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> .replies
|
||||
> *
|
||||
|
@@ -228,7 +228,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
font-size 12px
|
||||
@@ -395,8 +395,8 @@ root(isDark)
|
||||
padding 0 4px
|
||||
margin-left 4px
|
||||
font-size 80%
|
||||
color $theme-color-foreground
|
||||
background $theme-color
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
border-radius 4px
|
||||
|
||||
.mk-url-preview
|
||||
@@ -457,7 +457,7 @@ root(isDark)
|
||||
color #999
|
||||
|
||||
&.reacted
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
.note[data-darkmode]
|
||||
root(true)
|
||||
|
@@ -217,7 +217,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
overflow hidden
|
||||
|
@@ -324,7 +324,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
max-width 500px
|
||||
@@ -376,8 +376,8 @@ root(isDark)
|
||||
padding 0 16px
|
||||
line-height 34px
|
||||
vertical-align bottom
|
||||
color $theme-color-foreground
|
||||
background $theme-color
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
border-radius 4px
|
||||
|
||||
&:disabled
|
||||
|
@@ -118,7 +118,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
$height = 48px
|
||||
@@ -134,7 +134,7 @@ root(isDark)
|
||||
|
||||
> .indicator
|
||||
height 3px
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
> .warn
|
||||
display block
|
||||
@@ -216,7 +216,7 @@ root(isDark)
|
||||
left 8px
|
||||
pointer-events none
|
||||
font-size 10px
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> button:last-child
|
||||
display block
|
||||
|
@@ -121,7 +121,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
$color = isDark ? #c9d2e0 : #777
|
||||
@@ -198,11 +198,11 @@ root(isDark)
|
||||
text-decoration none
|
||||
|
||||
&[data-active]
|
||||
color $theme-color-foreground
|
||||
background $theme-color
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
|
||||
> [data-fa]:last-child
|
||||
color $theme-color-foreground
|
||||
color var(--primaryForeground)
|
||||
|
||||
> [data-fa]:first-child
|
||||
margin-right 0.5em
|
||||
@@ -212,7 +212,7 @@ root(isDark)
|
||||
> [data-fa].circle
|
||||
margin-left 6px
|
||||
font-size 10px
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> [data-fa]:last-child
|
||||
position absolute
|
||||
|
@@ -65,7 +65,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mk-users-list
|
||||
|
||||
@@ -87,8 +87,8 @@ export default Vue.extend({
|
||||
|
||||
&[data-active]
|
||||
font-weight bold
|
||||
color $theme-color
|
||||
border-color $theme-color
|
||||
color var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
> span
|
||||
display inline-block
|
||||
|
@@ -71,7 +71,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
main
|
||||
width 100%
|
||||
|
@@ -154,7 +154,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
> .nav
|
||||
@@ -215,8 +215,8 @@ root(isDark)
|
||||
color isDark ? #cdd0d8 : #666
|
||||
|
||||
&[data-active]
|
||||
color $theme-color-foreground
|
||||
background $theme-color
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
|
||||
&:not([data-active]):hover
|
||||
background isDark ? #353e4a : #eee
|
||||
@@ -224,7 +224,7 @@ root(isDark)
|
||||
> .badge
|
||||
margin-left 6px
|
||||
font-size 10px
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> .tl
|
||||
max-width 680px
|
||||
@@ -246,7 +246,7 @@ main:not([data-darkmode])
|
||||
</style>
|
||||
|
||||
<style lang="stylus" module>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.title
|
||||
i
|
||||
@@ -255,7 +255,7 @@ main:not([data-darkmode])
|
||||
.badge
|
||||
margin-left 6px
|
||||
font-size 10px
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
vertical-align middle
|
||||
|
||||
</style>
|
||||
|
@@ -34,7 +34,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
main
|
||||
width 100%
|
||||
|
@@ -52,7 +52,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
main
|
||||
width 100%
|
||||
|
@@ -53,7 +53,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
main
|
||||
width 100%
|
||||
|
@@ -51,7 +51,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
main
|
||||
width 100%
|
||||
|
@@ -115,7 +115,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
$bg = isDark ? #22252f : #f7f7f7
|
||||
@@ -275,8 +275,8 @@ root(isDark)
|
||||
|
||||
&[data-active]
|
||||
font-weight bold
|
||||
color $theme-color
|
||||
border-color $theme-color
|
||||
color var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
> .body
|
||||
max-width 680px
|
||||
|
Reference in New Issue
Block a user