sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip

Browse Source
This commit is contained in:
syuilo
2018-09-26 20:19:35 +09:00
parent d2d3f7810e
commit 904114740b
110 changed files with 529 additions and 536 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/client/app/desktop/views/components/calendar.vue
View File

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

4
src/client/app/desktop/views/components/charts.vue
View File

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

32
src/client/app/desktop/views/components/choose-file-from-drive-window.vue
View File

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

20
src/client/app/desktop/views/components/choose-folder-from-drive-window.vue
View File

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

12
src/client/app/desktop/views/components/context-menu.menu.vue
View File

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

24
src/client/app/desktop/views/components/crop-window.vue
View File

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

10
src/client/app/desktop/views/components/dialog.vue
View File

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

12
src/client/app/desktop/views/components/drive.file.vue
View File

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

14
src/client/app/desktop/views/components/drive.folder.vue
View File

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

8
src/client/app/desktop/views/components/drive.vue
View File

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

18
src/client/app/desktop/views/components/follow-button.vue
View File

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

10
src/client/app/desktop/views/components/home.vue
View File

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

30
src/client/app/desktop/views/components/input-dialog.vue
View File

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

2
src/client/app/desktop/views/components/note-detail.vue
View File

@@ -225,7 +225,7 @@ export default Vue.extend({
</script>
<style lang="stylus" scoped>
@import '~const.styl'
root(isDark)
overflow hidden

8
src/client/app/desktop/views/components/notes.note.vue
View File

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

4
src/client/app/desktop/views/components/notes.vue
View File

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

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

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

22
src/client/app/desktop/views/components/progress-dialog.vue
View File

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

4
src/client/app/desktop/views/components/renote-form.vue
View File

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

4
src/client/app/desktop/views/components/settings.vue
View File

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

2
src/client/app/desktop/views/components/timeline.core.vue
View File

@@ -215,7 +215,7 @@ export default Vue.extend({
</script>
<style lang="stylus" scoped>
@import '~const.styl'
.mk-timeline-core
> .mk-friends-maker

12
src/client/app/desktop/views/components/timeline.vue
View File

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

12
src/client/app/desktop/views/components/ui.header.account.vue
View File

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

6
src/client/app/desktop/views/components/ui.header.nav.vue
View File

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

4
src/client/app/desktop/views/components/ui.header.notifications.vue
View File

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

10
src/client/app/desktop/views/components/ui.header.post.vue
View File

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

4
src/client/app/desktop/views/components/ui.header.search.vue
View File

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

4
src/client/app/desktop/views/components/user-preview.vue
View File

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

6
src/client/app/desktop/views/components/users-list.vue
View File

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

6
src/client/app/desktop/views/components/window.vue
View File

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