wip
This commit is contained in:
@@ -128,7 +128,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
color isDark ? #c5ced6 : #777
|
||||
@@ -241,14 +241,14 @@ root(isDark)
|
||||
|
||||
&[data-today]
|
||||
> div
|
||||
color $theme-color-foreground
|
||||
background $theme-color
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
|
||||
&:hover > div
|
||||
background lighten($theme-color, 10%)
|
||||
background var(--primaryLighten10)
|
||||
|
||||
&:active > div
|
||||
background darken($theme-color, 10%)
|
||||
background var(--primaryDarken10)
|
||||
|
||||
.mk-calendar[data-darkmode]
|
||||
root(true)
|
||||
|
||||
@@ -649,7 +649,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.gkgckalzgidaygcxnugepioremxvxvpt
|
||||
padding 32px
|
||||
@@ -675,7 +675,7 @@ export default Vue.extend({
|
||||
|
||||
*
|
||||
&:not(.active)
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
cursor pointer
|
||||
|
||||
> div
|
||||
|
||||
@@ -59,7 +59,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" module>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.title
|
||||
> [data-fa]
|
||||
@@ -74,7 +74,7 @@ export default Vue.extend({
|
||||
|
||||
.footer
|
||||
height 72px
|
||||
background lighten($theme-color, 95%)
|
||||
background var(--primaryLighten95)
|
||||
|
||||
.upload
|
||||
display inline-block
|
||||
@@ -87,7 +87,7 @@ export default Vue.extend({
|
||||
width 40px
|
||||
height 40px
|
||||
font-size 1em
|
||||
color rgba($theme-color, 0.5)
|
||||
color var(--primaryAlpha05)
|
||||
background transparent
|
||||
outline none
|
||||
border solid 1px transparent
|
||||
@@ -95,13 +95,13 @@ export default Vue.extend({
|
||||
|
||||
&:hover
|
||||
background transparent
|
||||
border-color rgba($theme-color, 0.3)
|
||||
border-color var(--primaryAlpha03)
|
||||
|
||||
&:active
|
||||
color rgba($theme-color, 0.6)
|
||||
color var(--primaryAlpha06)
|
||||
background transparent
|
||||
border-color rgba($theme-color, 0.5)
|
||||
box-shadow 0 2px 4px rgba(darken($theme-color, 50%), 0.15) inset
|
||||
border-color var(--primaryAlpha05)
|
||||
//box-shadow 0 2px 4px rgba(var(--primaryDarken50), 0.15) inset
|
||||
|
||||
&:focus
|
||||
&:after
|
||||
@@ -112,7 +112,7 @@ export default Vue.extend({
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
.ok
|
||||
@@ -138,7 +138,7 @@ export default Vue.extend({
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
&:disabled
|
||||
@@ -147,20 +147,20 @@ export default Vue.extend({
|
||||
|
||||
.ok
|
||||
right 16px
|
||||
color $theme-color-foreground
|
||||
background linear-gradient(to bottom, lighten($theme-color, 25%) 0%, lighten($theme-color, 10%) 100%)
|
||||
border solid 1px lighten($theme-color, 15%)
|
||||
color var(--primaryForeground)
|
||||
background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
|
||||
border solid 1px var(--primaryLighten15)
|
||||
|
||||
&:not(:disabled)
|
||||
font-weight bold
|
||||
|
||||
&:hover:not(:disabled)
|
||||
background linear-gradient(to bottom, lighten($theme-color, 8%) 0%, darken($theme-color, 8%) 100%)
|
||||
border-color $theme-color
|
||||
background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
|
||||
border-color var(--primary)
|
||||
|
||||
&:active:not(:disabled)
|
||||
background $theme-color
|
||||
border-color $theme-color
|
||||
background var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
.cancel
|
||||
right 148px
|
||||
|
||||
@@ -37,7 +37,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" module>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.title
|
||||
> [data-fa]
|
||||
@@ -48,7 +48,7 @@ export default Vue.extend({
|
||||
|
||||
.footer
|
||||
height 72px
|
||||
background lighten($theme-color, 95%)
|
||||
background var(--primaryLighten95)
|
||||
|
||||
.ok
|
||||
.cancel
|
||||
@@ -73,7 +73,7 @@ export default Vue.extend({
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
&:disabled
|
||||
@@ -82,20 +82,20 @@ export default Vue.extend({
|
||||
|
||||
.ok
|
||||
right 16px
|
||||
color $theme-color-foreground
|
||||
background linear-gradient(to bottom, lighten($theme-color, 25%) 0%, lighten($theme-color, 10%) 100%)
|
||||
border solid 1px lighten($theme-color, 15%)
|
||||
color var(--primaryForeground)
|
||||
background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
|
||||
border solid 1px var(--primaryLighten15)
|
||||
|
||||
&:not(:disabled)
|
||||
font-weight bold
|
||||
|
||||
&:hover:not(:disabled)
|
||||
background linear-gradient(to bottom, lighten($theme-color, 8%) 0%, darken($theme-color, 8%) 100%)
|
||||
border-color $theme-color
|
||||
background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
|
||||
border-color var(--primary)
|
||||
|
||||
&:active:not(:disabled)
|
||||
background $theme-color
|
||||
border-color $theme-color
|
||||
background var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
.cancel
|
||||
right 148px
|
||||
|
||||
@@ -31,7 +31,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
$width = 240px
|
||||
@@ -69,7 +69,7 @@ root(isDark)
|
||||
|
||||
&:active
|
||||
> p, a
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
> p, a
|
||||
display block
|
||||
@@ -90,14 +90,14 @@ root(isDark)
|
||||
&:hover
|
||||
> p, a
|
||||
text-decoration none
|
||||
background $theme-color
|
||||
color $theme-color-foreground
|
||||
background var(--primary)
|
||||
color var(--primaryForeground)
|
||||
|
||||
&:active
|
||||
> p, a
|
||||
text-decoration none
|
||||
background darken($theme-color, 10%)
|
||||
color $theme-color-foreground
|
||||
background var(--primaryDarken10)
|
||||
color var(--primaryForeground)
|
||||
|
||||
li > ul
|
||||
visibility hidden
|
||||
|
||||
@@ -61,7 +61,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" module>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.header
|
||||
> [data-fa]
|
||||
@@ -73,7 +73,7 @@ export default Vue.extend({
|
||||
|
||||
.actions
|
||||
height 72px
|
||||
background lighten($theme-color, 95%)
|
||||
background var(--primaryLighten95)
|
||||
|
||||
.ok
|
||||
.cancel
|
||||
@@ -98,7 +98,7 @@ export default Vue.extend({
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
&:disabled
|
||||
@@ -111,20 +111,20 @@ export default Vue.extend({
|
||||
|
||||
.ok
|
||||
right 16px
|
||||
color $theme-color-foreground
|
||||
background linear-gradient(to bottom, lighten($theme-color, 25%) 0%, lighten($theme-color, 10%) 100%)
|
||||
border solid 1px lighten($theme-color, 15%)
|
||||
color var(--primaryForeground)
|
||||
background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
|
||||
border solid 1px var(--primaryLighten15)
|
||||
|
||||
&:not(:disabled)
|
||||
font-weight bold
|
||||
|
||||
&:hover:not(:disabled)
|
||||
background linear-gradient(to bottom, lighten($theme-color, 8%) 0%, darken($theme-color, 8%) 100%)
|
||||
border-color $theme-color
|
||||
background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
|
||||
border-color var(--primary)
|
||||
|
||||
&:active:not(:disabled)
|
||||
background $theme-color
|
||||
border-color $theme-color
|
||||
background var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
.cancel
|
||||
.skip
|
||||
@@ -155,11 +155,11 @@ export default Vue.extend({
|
||||
}
|
||||
|
||||
.cropper-view-box {
|
||||
outline-color: $theme-color;
|
||||
outline-color: var(--primary);
|
||||
}
|
||||
|
||||
.cropper-line, .cropper-point {
|
||||
background-color: $theme-color;
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
.cropper-bg {
|
||||
|
||||
@@ -91,7 +91,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mk-dialog
|
||||
> .bg
|
||||
@@ -144,20 +144,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 1em 0
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
// color #43A4EC
|
||||
font-weight bold
|
||||
|
||||
|
||||
@@ -200,7 +200,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
padding 8px 0 0 0
|
||||
@@ -237,13 +237,13 @@ root(isDark)
|
||||
background #ce2212
|
||||
|
||||
&[data-is-selected]
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
&:hover
|
||||
background lighten($theme-color, 10%)
|
||||
background var(--primaryLighten10)
|
||||
|
||||
&:active
|
||||
background darken($theme-color, 10%)
|
||||
background var(--primaryDarken10)
|
||||
|
||||
> .label
|
||||
&:before
|
||||
@@ -251,7 +251,7 @@ root(isDark)
|
||||
display none
|
||||
|
||||
> .name
|
||||
color $theme-color-foreground
|
||||
color var(--primaryForeground)
|
||||
|
||||
&[data-is-contextmenu-showing]
|
||||
&:after
|
||||
@@ -262,7 +262,7 @@ root(isDark)
|
||||
right -4px
|
||||
bottom -4px
|
||||
left -4px
|
||||
border 2px dashed rgba($theme-color, 0.3)
|
||||
border 2px dashed var(--primaryAlpha03)
|
||||
border-radius 4px
|
||||
|
||||
> .label
|
||||
|
||||
@@ -214,12 +214,12 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
padding 8px
|
||||
height 64px
|
||||
background isDark ? rgba($theme-color, 0.2) : lighten($theme-color, 95%)
|
||||
background isDark ? var(--primaryAlpha02) : var(--primaryLighten95)
|
||||
border-radius 4px
|
||||
|
||||
&, *
|
||||
@@ -229,10 +229,10 @@ root(isDark)
|
||||
pointer-events none
|
||||
|
||||
&:hover
|
||||
background isDark ? rgba(lighten($theme-color, 10%), 0.2) : lighten($theme-color, 90%)
|
||||
//background isDark ? rgba(var(--primaryLighten10), 0.2) : var(--primaryLighten90)
|
||||
|
||||
&:active
|
||||
background isDark ? rgba(darken($theme-color, 10%), 0.2) : lighten($theme-color, 85%)
|
||||
//background isDark ? rgba(var(--primaryDarken10), 0.2) : var(--primaryLighten85)
|
||||
|
||||
&[data-is-contextmenu-showing]
|
||||
&[data-draghover]
|
||||
@@ -244,16 +244,16 @@ root(isDark)
|
||||
right -4px
|
||||
bottom -4px
|
||||
left -4px
|
||||
border 2px dashed rgba($theme-color, 0.3)
|
||||
border 2px dashed var(--primaryAlpha03)
|
||||
border-radius 4px
|
||||
|
||||
&[data-draghover]
|
||||
background isDark ? rgba(darken($theme-color, 10%), 0.2) : lighten($theme-color, 90%)
|
||||
//background isDark ? rgba(var(--primaryDarken10), 0.2) : var(--primaryLighten90)
|
||||
|
||||
> .name
|
||||
margin 0
|
||||
font-size 0.9em
|
||||
color isDark ? #fff : darken($theme-color, 30%)
|
||||
color isDark ? #fff : var(--primaryDarken30)
|
||||
|
||||
> [data-fa]
|
||||
margin-right 4px
|
||||
|
||||
@@ -585,7 +585,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
|
||||
@@ -697,8 +697,8 @@ root(isDark)
|
||||
z-index 128
|
||||
top 0
|
||||
left 0
|
||||
border solid 1px $theme-color
|
||||
background rgba($theme-color, 0.5)
|
||||
border solid 1px var(--primary)
|
||||
background var(--primaryAlpha05)
|
||||
pointer-events none
|
||||
|
||||
> .contents
|
||||
@@ -769,7 +769,7 @@ root(isDark)
|
||||
top 38px
|
||||
width 100%
|
||||
height calc(100% - 38px)
|
||||
border dashed 2px rgba($theme-color, 0.5)
|
||||
border dashed 2px var(--primaryAlpha05)
|
||||
pointer-events none
|
||||
|
||||
> .mk-uploader
|
||||
|
||||
@@ -101,7 +101,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display block
|
||||
@@ -126,7 +126,7 @@ root(isDark)
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
&:not(.active)
|
||||
@@ -143,20 +143,20 @@ root(isDark)
|
||||
border-color isDark ? #151a1d : #dcdcdc
|
||||
|
||||
&.active
|
||||
color $theme-color-foreground
|
||||
background linear-gradient(to bottom, lighten($theme-color, 25%) 0%, lighten($theme-color, 10%) 100%)
|
||||
border solid 1px lighten($theme-color, 15%)
|
||||
color var(--primaryForeground)
|
||||
background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
|
||||
border solid 1px var(--primaryLighten15)
|
||||
|
||||
&:not(:disabled)
|
||||
font-weight bold
|
||||
|
||||
&:hover:not(:disabled)
|
||||
background linear-gradient(to bottom, lighten($theme-color, 8%) 0%, darken($theme-color, 8%) 100%)
|
||||
border-color $theme-color
|
||||
background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
|
||||
border-color var(--primary)
|
||||
|
||||
&:active:not(:disabled)
|
||||
background $theme-color
|
||||
border-color $theme-color
|
||||
background var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
&.wait
|
||||
cursor wait !important
|
||||
|
||||
@@ -247,7 +247,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display block
|
||||
@@ -292,15 +292,15 @@ root(isDark)
|
||||
padding 0 16px
|
||||
line-height 48px
|
||||
text-decoration none
|
||||
color $theme-color-foreground
|
||||
background $theme-color
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
transition background 0.1s ease
|
||||
|
||||
&:hover
|
||||
background lighten($theme-color, 10%)
|
||||
background var(--primaryLighten10)
|
||||
|
||||
&:active
|
||||
background darken($theme-color, 10%)
|
||||
background var(--primaryDarken10)
|
||||
transition background 0s ease
|
||||
|
||||
> [data-fa]
|
||||
|
||||
@@ -76,7 +76,7 @@ export default Vue.extend({
|
||||
|
||||
|
||||
<style lang="stylus" module>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.header
|
||||
> [data-fa]
|
||||
@@ -96,25 +96,25 @@ export default Vue.extend({
|
||||
color #333
|
||||
background #fff
|
||||
outline none
|
||||
border solid 1px rgba($theme-color, 0.1)
|
||||
border solid 1px var(--primaryAlpha01)
|
||||
border-radius 4px
|
||||
transition border-color .3s ease
|
||||
|
||||
&:hover
|
||||
border-color rgba($theme-color, 0.2)
|
||||
border-color var(--primaryAlpha02)
|
||||
transition border-color .1s ease
|
||||
|
||||
&:focus
|
||||
color $theme-color
|
||||
border-color rgba($theme-color, 0.5)
|
||||
color var(--primary)
|
||||
border-color var(--primaryAlpha05)
|
||||
transition border-color 0s ease
|
||||
|
||||
&::-webkit-input-placeholder
|
||||
color rgba($theme-color, 0.3)
|
||||
color var(--primaryAlpha03)
|
||||
|
||||
.actions
|
||||
height 72px
|
||||
background lighten($theme-color, 95%)
|
||||
background var(--primaryLighten95)
|
||||
|
||||
.ok
|
||||
.cancel
|
||||
@@ -139,7 +139,7 @@ export default Vue.extend({
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
&:disabled
|
||||
@@ -148,20 +148,20 @@ export default Vue.extend({
|
||||
|
||||
.ok
|
||||
right 16px
|
||||
color $theme-color-foreground
|
||||
background linear-gradient(to bottom, lighten($theme-color, 25%) 0%, lighten($theme-color, 10%) 100%)
|
||||
border solid 1px lighten($theme-color, 15%)
|
||||
color var(--primaryForeground)
|
||||
background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
|
||||
border solid 1px var(--primaryLighten15)
|
||||
|
||||
&:not(:disabled)
|
||||
font-weight bold
|
||||
|
||||
&:hover:not(:disabled)
|
||||
background linear-gradient(to bottom, lighten($theme-color, 8%) 0%, darken($theme-color, 8%) 100%)
|
||||
border-color $theme-color
|
||||
background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
|
||||
border-color var(--primary)
|
||||
|
||||
&:active:not(:disabled)
|
||||
background $theme-color
|
||||
border-color $theme-color
|
||||
background var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
.cancel
|
||||
right 148px
|
||||
|
||||
@@ -225,7 +225,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
overflow hidden
|
||||
|
||||
@@ -317,7 +317,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
margin 0
|
||||
@@ -348,7 +348,7 @@ root(isDark)
|
||||
right 2px
|
||||
bottom 2px
|
||||
left 2px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 4px
|
||||
|
||||
> .renote
|
||||
@@ -557,7 +557,7 @@ 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
|
||||
</style>
|
||||
|
||||
@@ -216,7 +216,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
.transition
|
||||
@@ -250,7 +250,7 @@ root(isDark)
|
||||
position sticky
|
||||
z-index 100
|
||||
height 3px
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
> footer
|
||||
> button
|
||||
|
||||
@@ -434,12 +434,12 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display block
|
||||
padding 16px
|
||||
background isDark ? #282C37 : lighten($theme-color, 95%)
|
||||
background isDark ? #282C37 : var(--primaryLighten95)
|
||||
|
||||
&:after
|
||||
content ""
|
||||
@@ -456,23 +456,23 @@ root(isDark)
|
||||
color isDark ? #fff : #333
|
||||
background isDark ? #191d23 : #fff
|
||||
outline none
|
||||
border solid 1px rgba($theme-color, 0.1)
|
||||
border solid 1px var(--primaryAlpha01)
|
||||
border-radius 4px
|
||||
transition border-color .2s ease
|
||||
|
||||
&:hover
|
||||
border-color rgba($theme-color, 0.2)
|
||||
border-color var(--primaryAlpha02)
|
||||
transition border-color .1s ease
|
||||
|
||||
&:focus
|
||||
border-color rgba($theme-color, 0.5)
|
||||
border-color var(--primaryAlpha05)
|
||||
transition border-color 0s ease
|
||||
|
||||
&:disabled
|
||||
opacity 0.5
|
||||
|
||||
&::-webkit-input-placeholder
|
||||
color rgba($theme-color, 0.3)
|
||||
color var(--primaryAlpha03)
|
||||
|
||||
> input
|
||||
margin-bottom 8px
|
||||
@@ -486,17 +486,17 @@ root(isDark)
|
||||
&:hover
|
||||
& + *
|
||||
& + * + *
|
||||
border-color rgba($theme-color, 0.2)
|
||||
border-color var(--primaryAlpha02)
|
||||
transition border-color .1s ease
|
||||
|
||||
&:focus
|
||||
& + *
|
||||
& + * + *
|
||||
border-color rgba($theme-color, 0.5)
|
||||
border-color var(--primaryAlpha05)
|
||||
transition border-color 0s ease
|
||||
|
||||
&.with
|
||||
border-bottom solid 1px rgba($theme-color, 0.1) !important
|
||||
border-bottom solid 1px var(--primaryAlpha01) !important
|
||||
border-radius 4px 4px 0 0
|
||||
|
||||
> .visibleUsers
|
||||
@@ -514,7 +514,7 @@ root(isDark)
|
||||
font-size 14px
|
||||
|
||||
> b
|
||||
color isDark ? #9baec8 : darken($theme-color, 20%)
|
||||
color isDark ? #9baec8 : var(--primaryDarken20)
|
||||
|
||||
> *
|
||||
margin-right 8px
|
||||
@@ -523,14 +523,14 @@ root(isDark)
|
||||
> .files
|
||||
margin 0
|
||||
padding 0
|
||||
background isDark ? #181b23 : lighten($theme-color, 98%)
|
||||
border solid 1px rgba($theme-color, 0.1)
|
||||
background isDark ? #181b23 : var(--primaryLighten98)
|
||||
border solid 1px var(--primaryAlpha01)
|
||||
border-top none
|
||||
border-radius 0 0 4px 4px
|
||||
transition border-color .3s ease
|
||||
|
||||
&.with
|
||||
border-bottom solid 1px rgba($theme-color, 0.1) !important
|
||||
border-bottom solid 1px var(--primaryAlpha01) !important
|
||||
border-radius 0
|
||||
|
||||
> .remain
|
||||
@@ -540,7 +540,7 @@ root(isDark)
|
||||
right 8px
|
||||
margin 0
|
||||
padding 0
|
||||
color rgba($theme-color, 0.4)
|
||||
color var(--primaryAlpha04)
|
||||
|
||||
> div
|
||||
padding 4px
|
||||
@@ -574,8 +574,8 @@ root(isDark)
|
||||
cursor pointer
|
||||
|
||||
> .mk-poll-editor
|
||||
background isDark ? #181b23 : lighten($theme-color, 98%)
|
||||
border solid 1px rgba($theme-color, 0.1)
|
||||
background isDark ? #181b23 : var(--primaryLighten98)
|
||||
border solid 1px var(--primaryAlpha01)
|
||||
border-top none
|
||||
border-radius 0 0 4px 4px
|
||||
transition border-color .3s ease
|
||||
@@ -583,7 +583,7 @@ root(isDark)
|
||||
> .mk-uploader
|
||||
margin 8px 0 0 0
|
||||
padding 8px
|
||||
border solid 1px rgba($theme-color, 0.2)
|
||||
border solid 1px var(--primaryAlpha02)
|
||||
border-radius 4px
|
||||
|
||||
input[type='file']
|
||||
@@ -600,22 +600,22 @@ root(isDark)
|
||||
width 110px
|
||||
height 40px
|
||||
font-size 1em
|
||||
color $theme-color-foreground
|
||||
background linear-gradient(to bottom, lighten($theme-color, 25%) 0%, lighten($theme-color, 10%) 100%)
|
||||
color var(--primaryForeground)
|
||||
background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
|
||||
outline none
|
||||
border solid 1px lighten($theme-color, 15%)
|
||||
border solid 1px var(--primaryLighten15)
|
||||
border-radius 4px
|
||||
|
||||
&:not(:disabled)
|
||||
font-weight bold
|
||||
|
||||
&:hover:not(:disabled)
|
||||
background linear-gradient(to bottom, lighten($theme-color, 8%) 0%, darken($theme-color, 8%) 100%)
|
||||
border-color $theme-color
|
||||
background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
|
||||
border-color var(--primary)
|
||||
|
||||
&:active:not(:disabled)
|
||||
background $theme-color
|
||||
border-color $theme-color
|
||||
background var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
&:focus
|
||||
&:after
|
||||
@@ -626,7 +626,7 @@ root(isDark)
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
&:disabled
|
||||
@@ -636,13 +636,13 @@ root(isDark)
|
||||
&.wait
|
||||
background linear-gradient(
|
||||
45deg,
|
||||
darken($theme-color, 10%) 25%,
|
||||
$theme-color 25%,
|
||||
$theme-color 50%,
|
||||
darken($theme-color, 10%) 50%,
|
||||
darken($theme-color, 10%) 75%,
|
||||
$theme-color 75%,
|
||||
$theme-color
|
||||
var(--primaryDarken10) 25%,
|
||||
var(--primary) 25%,
|
||||
var(--primary) 50%,
|
||||
var(--primaryDarken10) 50%,
|
||||
var(--primaryDarken10) 75%,
|
||||
var(--primary) 75%,
|
||||
var(--primary)
|
||||
)
|
||||
background-size 32px 32px
|
||||
animation stripe-bg 1.5s linear infinite
|
||||
@@ -661,7 +661,7 @@ root(isDark)
|
||||
right 138px
|
||||
margin 0
|
||||
line-height 40px
|
||||
color rgba($theme-color, 0.5)
|
||||
color var(--primaryAlpha05)
|
||||
|
||||
&.over
|
||||
color #ec3828
|
||||
@@ -679,7 +679,7 @@ root(isDark)
|
||||
width 40px
|
||||
height 40px
|
||||
font-size 1em
|
||||
color isDark ? $theme-color : rgba($theme-color, 0.5)
|
||||
color isDark ? var(--primary) : var(--primaryAlpha05)
|
||||
background transparent
|
||||
outline none
|
||||
border solid 1px transparent
|
||||
@@ -687,12 +687,12 @@ root(isDark)
|
||||
|
||||
&:hover
|
||||
background transparent
|
||||
border-color isDark ? rgba($theme-color, 0.5) : rgba($theme-color, 0.3)
|
||||
border-color isDark ? var(--primaryAlpha05) : var(--primaryAlpha03)
|
||||
|
||||
&:active
|
||||
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)
|
||||
color var(--primaryAlpha06)
|
||||
background isDark ? transparent : linear-gradient(to bottom, var(--primaryLighten80) 0%, var(--primaryLighten90) 100%)
|
||||
border-color var(--primaryAlpha05)
|
||||
box-shadow 0 2px 4px rgba(#000, 0.15) inset
|
||||
|
||||
&:focus
|
||||
@@ -704,7 +704,7 @@ root(isDark)
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
> .dropzone
|
||||
@@ -713,7 +713,7 @@ root(isDark)
|
||||
top 0
|
||||
width 100%
|
||||
height 100%
|
||||
border dashed 2px rgba($theme-color, 0.5)
|
||||
border dashed 2px var(--primaryAlpha05)
|
||||
pointer-events none
|
||||
|
||||
.mk-post-form[data-darkmode]
|
||||
|
||||
@@ -37,7 +37,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" module>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.body
|
||||
padding 18px 24px 24px 24px
|
||||
@@ -53,7 +53,7 @@ export default Vue.extend({
|
||||
margin 0 0 4px 0
|
||||
text-align center
|
||||
line-height 16px
|
||||
color rgba($theme-color, 0.7)
|
||||
color var(--primaryAlpha07)
|
||||
|
||||
&:after
|
||||
content '%'
|
||||
@@ -69,21 +69,21 @@ export default Vue.extend({
|
||||
overflow hidden
|
||||
|
||||
&::-webkit-progress-value
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
&::-webkit-progress-bar
|
||||
background rgba($theme-color, 0.1)
|
||||
background var(--primaryAlpha01)
|
||||
|
||||
.waiting
|
||||
background linear-gradient(
|
||||
45deg,
|
||||
lighten($theme-color, 30%) 25%,
|
||||
$theme-color 25%,
|
||||
$theme-color 50%,
|
||||
lighten($theme-color, 30%) 50%,
|
||||
lighten($theme-color, 30%) 75%,
|
||||
$theme-color 75%,
|
||||
$theme-color
|
||||
var(--primaryLighten30) 25%,
|
||||
var(--primary) 25%,
|
||||
var(--primary) 50%,
|
||||
var(--primaryLighten30) 50%,
|
||||
var(--primaryLighten30) 75%,
|
||||
var(--primary) 75%,
|
||||
var(--primary)
|
||||
)
|
||||
background-size 32px 32px
|
||||
animation progress-dialog-tag-progress-waiting 1.5s linear infinite
|
||||
|
||||
@@ -57,7 +57,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
|
||||
@@ -66,7 +66,7 @@ root(isDark)
|
||||
|
||||
> footer
|
||||
height 72px
|
||||
background isDark ? #313543 : lighten($theme-color, 95%)
|
||||
background isDark ? #313543 : var(--primaryLighten95)
|
||||
|
||||
> .quote
|
||||
position absolute
|
||||
|
||||
@@ -492,7 +492,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display flex
|
||||
@@ -524,7 +524,7 @@ root(isDark)
|
||||
|
||||
&.active
|
||||
margin-left 8px
|
||||
color $theme-color !important
|
||||
color var(--primary) !important
|
||||
|
||||
> .pages
|
||||
width 100%
|
||||
|
||||
@@ -215,7 +215,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mk-timeline-core
|
||||
> .mk-friends-maker
|
||||
|
||||
@@ -175,7 +175,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
background isDark ? #282C37 : #fff
|
||||
@@ -207,7 +207,7 @@ root(isDark)
|
||||
top -4px
|
||||
right 4px
|
||||
font-size 10px
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
&:hover
|
||||
color isDark ? #b2c1d5 : #aaa
|
||||
@@ -216,7 +216,7 @@ root(isDark)
|
||||
color isDark ? #b2c1d5 : #999
|
||||
|
||||
&[data-active]
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
cursor default
|
||||
|
||||
&:before
|
||||
@@ -227,7 +227,7 @@ root(isDark)
|
||||
left 0
|
||||
width 100%
|
||||
height 2px
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
> span
|
||||
display inline-block
|
||||
@@ -237,7 +237,7 @@ root(isDark)
|
||||
user-select none
|
||||
|
||||
&[data-active]
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
cursor default
|
||||
font-weight bold
|
||||
|
||||
@@ -249,7 +249,7 @@ root(isDark)
|
||||
left -8px
|
||||
width calc(100% + 16px)
|
||||
height 2px
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
&:not([data-active])
|
||||
color isDark ? #9aa2a7 : #6f7477
|
||||
|
||||
@@ -127,7 +127,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
> .header
|
||||
@@ -249,8 +249,8 @@ root(isDark)
|
||||
padding 2px 8px
|
||||
font-size 90%
|
||||
font-style normal
|
||||
background $theme-color
|
||||
color $theme-color-foreground
|
||||
background var(--primary)
|
||||
color var(--primaryForeground)
|
||||
border-radius 8px
|
||||
|
||||
> [data-fa]:first-child
|
||||
@@ -269,11 +269,11 @@ root(isDark)
|
||||
|
||||
&:hover, &:active
|
||||
text-decoration none
|
||||
background $theme-color
|
||||
color $theme-color-foreground
|
||||
background var(--primary)
|
||||
color var(--primaryForeground)
|
||||
|
||||
&:active
|
||||
background darken($theme-color, 10%)
|
||||
background var(--primaryDarken10)
|
||||
|
||||
&.signout
|
||||
$color = #e64137
|
||||
|
||||
@@ -95,7 +95,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display inline-block
|
||||
@@ -120,7 +120,7 @@ root(isDark)
|
||||
|
||||
&.active
|
||||
> a
|
||||
border-bottom solid 3px $theme-color
|
||||
border-bottom solid 3px var(--primary)
|
||||
|
||||
> a
|
||||
display inline-block
|
||||
@@ -147,7 +147,7 @@ root(isDark)
|
||||
> [data-fa]:last-child
|
||||
margin-left 5px
|
||||
font-size 10px
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
@media (max-width 1100px)
|
||||
margin-left -5px
|
||||
|
||||
@@ -61,7 +61,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
|
||||
@@ -93,7 +93,7 @@ root(isDark)
|
||||
margin-left -5px
|
||||
vertical-align super
|
||||
font-size 10px
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> .pop
|
||||
$bgcolor = isDark ? #282c37 : #fff
|
||||
|
||||
@@ -17,7 +17,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.note
|
||||
display inline-block
|
||||
@@ -33,8 +33,8 @@ export default Vue.extend({
|
||||
font-size 1.2em
|
||||
font-weight normal
|
||||
text-decoration none
|
||||
color $theme-color-foreground
|
||||
background $theme-color !important
|
||||
color var(--primaryForeground)
|
||||
background var(--primary) !important
|
||||
outline none
|
||||
border none
|
||||
border-radius 4px
|
||||
@@ -45,10 +45,10 @@ export default Vue.extend({
|
||||
pointer-events none
|
||||
|
||||
&:hover
|
||||
background lighten($theme-color, 10%) !important
|
||||
background var(--primaryLighten10) !important
|
||||
|
||||
&:active
|
||||
background darken($theme-color, 10%) !important
|
||||
background var(--primaryDarken10) !important
|
||||
transition background 0s ease
|
||||
|
||||
</style>
|
||||
|
||||
@@ -28,7 +28,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
root(isDark)
|
||||
> [data-fa]
|
||||
display block
|
||||
@@ -67,7 +67,7 @@ root(isDark)
|
||||
background isDark ? rgba(#fff, 0.04) : rgba(#000, 0.08)
|
||||
|
||||
&:focus
|
||||
box-shadow 0 0 0 2px rgba($theme-color, 0.5) !important
|
||||
box-shadow 0 0 0 2px var(--primaryAlpha05) !important
|
||||
|
||||
.search[data-darkmode]
|
||||
root(true)
|
||||
|
||||
@@ -83,7 +83,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
position absolute
|
||||
@@ -151,7 +151,7 @@ root(isDark)
|
||||
|
||||
> span
|
||||
font-size 1em
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> .mk-follow-button
|
||||
position absolute
|
||||
|
||||
@@ -69,7 +69,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mk-users-list
|
||||
height 100%
|
||||
@@ -104,8 +104,8 @@ export default Vue.extend({
|
||||
|
||||
&[data-active]
|
||||
font-weight bold
|
||||
color $theme-color
|
||||
border-color $theme-color
|
||||
color var(--primary)
|
||||
border-color var(--primary)
|
||||
cursor default
|
||||
|
||||
> span
|
||||
|
||||
@@ -463,7 +463,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display block
|
||||
@@ -494,9 +494,9 @@ root(isDark)
|
||||
&:not([data-is-modal])
|
||||
> .body
|
||||
if isDark
|
||||
box-shadow 0 0 0px 1px rgba($theme-color, 0.5), 0 2px 12px 0 rgba(#000, 0.5)
|
||||
box-shadow 0 0 0px 1px var(--primaryAlpha05), 0 2px 12px 0 rgba(#000, 0.5)
|
||||
else
|
||||
box-shadow 0 0 0px 1px rgba($theme-color, 0.5), 0 2px 6px 0 rgba(#000, 0.2)
|
||||
box-shadow 0 0 0px 1px var(--primaryAlpha05), 0 2px 6px 0 rgba(#000, 0.2)
|
||||
|
||||
> .handle
|
||||
$size = 8px
|
||||
|
||||
@@ -31,7 +31,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.qldxjjsrseehkusjuoooapmsprvfrxyl
|
||||
textarea
|
||||
|
||||
@@ -95,7 +95,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.obdskegsannmntldydackcpzezagxqfy
|
||||
> .stats
|
||||
@@ -112,7 +112,7 @@ export default Vue.extend({
|
||||
|
||||
> *:first-child
|
||||
display block
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> *:last-child
|
||||
font-size 70%
|
||||
|
||||
@@ -31,7 +31,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.jdnqwkzlnxcfftthoybjxrebyolvoucw
|
||||
textarea
|
||||
|
||||
@@ -39,7 +39,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
header
|
||||
margin 10px 0
|
||||
|
||||
@@ -39,7 +39,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
header
|
||||
margin 10px 0
|
||||
|
||||
@@ -39,7 +39,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
header
|
||||
margin 10px 0
|
||||
|
||||
@@ -39,7 +39,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
header
|
||||
margin 10px 0
|
||||
|
||||
@@ -70,7 +70,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mk-admin
|
||||
display flex
|
||||
@@ -106,7 +106,7 @@ export default Vue.extend({
|
||||
|
||||
&.active
|
||||
margin-left 8px
|
||||
color $theme-color !important
|
||||
color var(--primary) !important
|
||||
|
||||
> main
|
||||
width 100%
|
||||
|
||||
@@ -269,7 +269,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
$header-height = 42px
|
||||
@@ -283,10 +283,10 @@ root(isDark)
|
||||
overflow hidden
|
||||
|
||||
&.draghover
|
||||
box-shadow 0 0 0 2px rgba($theme-color, 0.8)
|
||||
box-shadow 0 0 0 2px var(--primaryAlpha08)
|
||||
|
||||
&.dragging
|
||||
box-shadow 0 0 0 2px rgba($theme-color, 0.4)
|
||||
box-shadow 0 0 0 2px var(--primaryAlpha04)
|
||||
|
||||
&.dropready
|
||||
*
|
||||
@@ -329,7 +329,7 @@ root(isDark)
|
||||
pointer-events none
|
||||
|
||||
&.indicate
|
||||
box-shadow 0 3px 0 0 $theme-color
|
||||
box-shadow 0 3px 0 0 var(--primary)
|
||||
|
||||
> span
|
||||
[data-fa]
|
||||
|
||||
@@ -214,7 +214,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
mediaRoot(isDark)
|
||||
font-size 13px
|
||||
@@ -368,8 +368,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
|
||||
@@ -430,7 +430,7 @@ root(isDark)
|
||||
color #999
|
||||
|
||||
&.reacted
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
.zyjjkidcqjnlegkqebitfviomuqmseqk[data-darkmode]
|
||||
root(true)
|
||||
|
||||
@@ -195,7 +195,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
.transition
|
||||
|
||||
@@ -221,7 +221,7 @@ export default Vue.extend({
|
||||
</style>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display flex
|
||||
|
||||
@@ -135,7 +135,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
.gqpwvtwtprsbmnssnbicggtwqhmylhnq
|
||||
|
||||
@@ -54,7 +54,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mkp-selectdrive
|
||||
display block
|
||||
@@ -72,7 +72,7 @@ export default Vue.extend({
|
||||
left 0
|
||||
width 100%
|
||||
height 72px
|
||||
background lighten($theme-color, 95%)
|
||||
background var(--primaryLighten95)
|
||||
|
||||
.upload
|
||||
display inline-block
|
||||
@@ -85,7 +85,7 @@ export default Vue.extend({
|
||||
width 40px
|
||||
height 40px
|
||||
font-size 1em
|
||||
color rgba($theme-color, 0.5)
|
||||
color var(--primaryAlpha05)
|
||||
background transparent
|
||||
outline none
|
||||
border solid 1px transparent
|
||||
@@ -93,13 +93,13 @@ export default Vue.extend({
|
||||
|
||||
&:hover
|
||||
background transparent
|
||||
border-color rgba($theme-color, 0.3)
|
||||
border-color var(--primaryAlpha03)
|
||||
|
||||
&:active
|
||||
color rgba($theme-color, 0.6)
|
||||
color var(--primaryAlpha06)
|
||||
background transparent
|
||||
border-color rgba($theme-color, 0.5)
|
||||
box-shadow 0 2px 4px rgba(darken($theme-color, 50%), 0.15) inset
|
||||
border-color var(--primaryAlpha05)
|
||||
//box-shadow 0 2px 4px rgba(var(--primaryDarken50), 0.15) inset
|
||||
|
||||
&:focus
|
||||
&:after
|
||||
@@ -110,7 +110,7 @@ export default Vue.extend({
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
.ok
|
||||
@@ -136,7 +136,7 @@ export default Vue.extend({
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid rgba($theme-color, 0.3)
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
&:disabled
|
||||
@@ -145,20 +145,20 @@ export default Vue.extend({
|
||||
|
||||
.ok
|
||||
right 16px
|
||||
color $theme-color-foreground
|
||||
background linear-gradient(to bottom, lighten($theme-color, 25%) 0%, lighten($theme-color, 10%) 100%)
|
||||
border solid 1px lighten($theme-color, 15%)
|
||||
color var(--primaryForeground)
|
||||
background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
|
||||
border solid 1px var(--primaryLighten15)
|
||||
|
||||
&:not(:disabled)
|
||||
font-weight bold
|
||||
|
||||
&:hover:not(:disabled)
|
||||
background linear-gradient(to bottom, lighten($theme-color, 8%) 0%, darken($theme-color, 8%) 100%)
|
||||
border-color $theme-color
|
||||
background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
|
||||
border-color var(--primary)
|
||||
|
||||
&:active:not(:disabled)
|
||||
background $theme-color
|
||||
border-color $theme-color
|
||||
background var(--primary)
|
||||
border-color var(--primary)
|
||||
|
||||
.cancel
|
||||
right 148px
|
||||
|
||||
@@ -34,7 +34,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.tcrwdhwpuxrwmcttxjcsehgpagpstqey
|
||||
width 100%
|
||||
@@ -54,7 +54,7 @@ export default Vue.extend({
|
||||
|
||||
> *:first-child
|
||||
display block
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> *:last-child
|
||||
font-size 70%
|
||||
|
||||
@@ -100,7 +100,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
background isDark ? #282C37 : #fff
|
||||
@@ -208,7 +208,7 @@ root(isDark)
|
||||
margin-right 4px
|
||||
font-size 1rem
|
||||
font-weight bold
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
.header[data-darkmode]
|
||||
root(true)
|
||||
|
||||
@@ -112,7 +112,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
background isDark ? #282C37 : #fff
|
||||
@@ -133,7 +133,7 @@ root(isDark)
|
||||
user-select none
|
||||
|
||||
&[data-active]
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
cursor default
|
||||
font-weight bold
|
||||
|
||||
@@ -145,7 +145,7 @@ root(isDark)
|
||||
left -8px
|
||||
width calc(100% + 16px)
|
||||
height 2px
|
||||
background $theme-color
|
||||
background var(--primary)
|
||||
|
||||
&:not([data-active])
|
||||
color isDark ? #9aa2a7 : #6f7477
|
||||
|
||||
@@ -303,7 +303,7 @@ export default Vue.extend({
|
||||
</style>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
root(isDark)
|
||||
display flex
|
||||
@@ -385,7 +385,7 @@ root(isDark)
|
||||
> .main
|
||||
grid-row 1
|
||||
grid-column 1 / 3
|
||||
border-top solid 5px $theme-color
|
||||
border-top solid 5px var(--primary)
|
||||
|
||||
> div
|
||||
padding 32px
|
||||
@@ -426,7 +426,7 @@ root(isDark)
|
||||
cursor pointer
|
||||
|
||||
&:hover
|
||||
color $theme-color
|
||||
color var(--primary)
|
||||
|
||||
> .char
|
||||
display block
|
||||
|
||||
@@ -68,7 +68,7 @@ export default define({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~const.styl'
|
||||
|
||||
|
||||
.mkw-post-form
|
||||
background #fff
|
||||
@@ -107,8 +107,8 @@ export default define({
|
||||
margin 0
|
||||
padding 0 10px
|
||||
height 28px
|
||||
color $theme-color-foreground
|
||||
background $theme-color !important
|
||||
color var(--primaryForeground)
|
||||
background var(--primary) !important
|
||||
outline none
|
||||
border none
|
||||
border-radius 4px
|
||||
@@ -116,10 +116,10 @@ export default define({
|
||||
cursor pointer
|
||||
|
||||
&:hover
|
||||
background lighten($theme-color, 10%) !important
|
||||
background var(--primaryLighten10) !important
|
||||
|
||||
&:active
|
||||
background darken($theme-color, 10%) !important
|
||||
background var(--primaryDarken10) !important
|
||||
transition background 0s ease
|
||||
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user