wip
This commit is contained in:
parent
1eb6ad58d5
commit
0ef64a6d0b
12 changed files with 57 additions and 47 deletions
|
@ -137,7 +137,7 @@ root(isDark)
|
|||
overflow hidden
|
||||
font-weight bold
|
||||
text-overflow ellipsis
|
||||
color isDark ? #fff : #627079
|
||||
color var(--noteHeaderName)
|
||||
|
||||
> .username
|
||||
margin 0 .5em 0 0
|
||||
|
|
|
@ -225,8 +225,6 @@ export default Vue.extend({
|
|||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
overflow hidden
|
||||
text-align left
|
||||
|
@ -243,24 +241,24 @@ root(isDark)
|
|||
text-align center
|
||||
color #999
|
||||
cursor pointer
|
||||
background isDark ? #21242d : #fafafa
|
||||
background var(--subNoteBg)
|
||||
outline none
|
||||
border none
|
||||
border-bottom solid 1px isDark ? #1c2023 : #eef0f2
|
||||
border-radius 6px 6px 0 0
|
||||
border-bottom solid 1px var(--faceDivider)
|
||||
border-radius var(--round) var(--round) 0 0
|
||||
|
||||
&:hover
|
||||
background isDark ? #2e3440 : #f6f6f6
|
||||
box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.05)
|
||||
|
||||
&:active
|
||||
background isDark ? #21242b : #f0f0f0
|
||||
box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.1)
|
||||
|
||||
&:disabled
|
||||
color isDark ? #21242b : #ccc
|
||||
cursor wait
|
||||
|
||||
> .conversation
|
||||
> *
|
||||
border-bottom 1px solid isDark ? #1c2023 : #eef0f2
|
||||
border-bottom 1px solid var(--faceDivider)
|
||||
|
||||
> .renote
|
||||
color var(--renoteText)
|
||||
|
@ -287,7 +285,7 @@ root(isDark)
|
|||
padding-top 8px
|
||||
|
||||
> .reply-to
|
||||
border-bottom 1px solid isDark ? #1c2023 : #eef0f2
|
||||
border-bottom 1px solid var(--faceDivider)
|
||||
|
||||
> article
|
||||
padding 28px 32px 18px 32px
|
||||
|
@ -299,7 +297,7 @@ root(isDark)
|
|||
|
||||
&:hover
|
||||
> footer > button
|
||||
color isDark ? #707b97 : #888
|
||||
color var(--noteActionsHighlighted)
|
||||
|
||||
> .avatar
|
||||
width 60px
|
||||
|
@ -316,7 +314,7 @@ root(isDark)
|
|||
display inline-block
|
||||
margin 0
|
||||
line-height 24px
|
||||
color isDark ? #fff : #627079
|
||||
color var(--noteHeaderName)
|
||||
font-size 18px
|
||||
font-weight 700
|
||||
text-align left
|
||||
|
@ -394,20 +392,20 @@ root(isDark)
|
|||
background transparent
|
||||
border none
|
||||
font-size 1em
|
||||
color isDark ? #606984 : #ccc
|
||||
color var(--noteActions)
|
||||
cursor pointer
|
||||
|
||||
&:hover
|
||||
color isDark ? #a1a8bf : #444
|
||||
color var(--noteActionsHover)
|
||||
|
||||
&.replyButton:hover
|
||||
color #0af
|
||||
color var(--noteActionsReplyHover)
|
||||
|
||||
&.renoteButton:hover
|
||||
color #8d0
|
||||
color var(--noteActionsRenoteHover)
|
||||
|
||||
&.reactionButton:hover
|
||||
color #fa0
|
||||
color var(--noteActionsReactionHover)
|
||||
|
||||
> .count
|
||||
display inline
|
||||
|
@ -415,11 +413,11 @@ root(isDark)
|
|||
color #999
|
||||
|
||||
&.reacted, &.reacted:hover
|
||||
color #fa0
|
||||
color var(--noteActionsReactionHover)
|
||||
|
||||
> .replies
|
||||
> *
|
||||
border-top 1px solid isDark ? #1c2023 : #eef0f2
|
||||
border-top 1px solid var(--faceDivider)
|
||||
|
||||
.mk-note-detail[data-darkmode]
|
||||
root(true)
|
||||
|
|
|
@ -47,7 +47,7 @@ root(isDark)
|
|||
margin 0
|
||||
padding 16px 32px
|
||||
font-size 0.9em
|
||||
background isDark ? #21242d : #fcfcfc
|
||||
background var(--subNoteBg)
|
||||
|
||||
> .avatar
|
||||
flex-shrink 0
|
||||
|
|
|
@ -398,7 +398,7 @@ root(isDark)
|
|||
|
||||
&:hover
|
||||
> .main > footer > button
|
||||
color isDark ? #707b97 : #888
|
||||
color var(--noteActionsHighlighted)
|
||||
|
||||
> .avatar
|
||||
flex-shrink 0
|
||||
|
@ -500,22 +500,22 @@ root(isDark)
|
|||
padding 0 8px
|
||||
line-height 32px
|
||||
font-size 1em
|
||||
color isDark ? #606984 : #ddd
|
||||
color var(--noteActions)
|
||||
background transparent
|
||||
border none
|
||||
cursor pointer
|
||||
|
||||
&:hover
|
||||
color isDark ? #a1a8bf : #444
|
||||
color var(--noteActionsHover)
|
||||
|
||||
&.replyButton:hover
|
||||
color #0af
|
||||
color var(--noteActionsReplyHover)
|
||||
|
||||
&.renoteButton:hover
|
||||
color #8d0
|
||||
color var(--noteActionsRenoteHover)
|
||||
|
||||
&.reactionButton:hover
|
||||
color #fa0
|
||||
color var(--noteActionsReactionHover)
|
||||
|
||||
> .count
|
||||
display inline
|
||||
|
@ -523,7 +523,7 @@ root(isDark)
|
|||
color #999
|
||||
|
||||
&.reacted, &.reacted:hover
|
||||
color #fa0
|
||||
color var(--noteActionsReactionHover)
|
||||
|
||||
> .detail
|
||||
padding-top 4px
|
||||
|
|
|
@ -33,7 +33,7 @@ root(isDark)
|
|||
display flex
|
||||
padding 16px
|
||||
font-size 10px
|
||||
background isDark ? #21242d : #fcfcfc
|
||||
background var(--subNoteBg)
|
||||
|
||||
&.smart
|
||||
> .main
|
||||
|
|
|
@ -402,7 +402,7 @@ root(isDark)
|
|||
border none
|
||||
box-shadow none
|
||||
font-size 1em
|
||||
color isDark ? #606984 : #ddd
|
||||
color var(--noteActions)
|
||||
cursor pointer
|
||||
|
||||
&:not(:last-child)
|
||||
|
|
|
@ -223,8 +223,6 @@ export default Vue.extend({
|
|||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
overflow hidden
|
||||
width 100%
|
||||
|
@ -248,22 +246,22 @@ root(isDark)
|
|||
text-align center
|
||||
color #999
|
||||
cursor pointer
|
||||
background isDark ? #21242d : #fafafa
|
||||
background var(--subNoteBg)
|
||||
outline none
|
||||
border none
|
||||
border-bottom solid 1px isDark ? #1c2023 : #eef0f2
|
||||
border-bottom solid 1px var(--faceDivider)
|
||||
border-radius 6px 6px 0 0
|
||||
box-shadow none
|
||||
|
||||
&:hover
|
||||
background isDark ? #16181d : #f6f6f6
|
||||
box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.05)
|
||||
|
||||
&:disabled
|
||||
color #ccc
|
||||
&:active
|
||||
box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.1)
|
||||
|
||||
> .conversation
|
||||
> *
|
||||
border-bottom 1px solid isDark ? #1c2023 : #eef0f2
|
||||
border-bottom 1px solid var(--faceDivider)
|
||||
|
||||
> .renote
|
||||
color var(--renoteText)
|
||||
|
@ -290,7 +288,7 @@ root(isDark)
|
|||
padding-top 8px
|
||||
|
||||
> .reply-to
|
||||
border-bottom 1px solid isDark ? #1c2023 : #eef0f2
|
||||
border-bottom 1px solid var(--faceDivider)
|
||||
|
||||
> article
|
||||
padding 14px 16px 9px 16px
|
||||
|
@ -323,7 +321,7 @@ root(isDark)
|
|||
> .name
|
||||
display inline-block
|
||||
margin .4em 0
|
||||
color isDark ? #fff : #627079
|
||||
color var(--noteHeaderName)
|
||||
font-size 16px
|
||||
font-weight bold
|
||||
text-align left
|
||||
|
@ -407,7 +405,7 @@ root(isDark)
|
|||
border none
|
||||
box-shadow none
|
||||
font-size 1em
|
||||
color isDark ? #606984 : #ddd
|
||||
color var(--noteActions)
|
||||
cursor pointer
|
||||
|
||||
&:not(:last-child)
|
||||
|
@ -426,7 +424,7 @@ root(isDark)
|
|||
|
||||
> .replies
|
||||
> *
|
||||
border-top 1px solid isDark ? #1c2023 : #eef0f2
|
||||
border-top 1px solid var(--faceDivider)
|
||||
|
||||
.mk-note-detail[data-darkmode]
|
||||
root(true)
|
||||
|
|
|
@ -45,7 +45,7 @@ root(isDark)
|
|||
display flex
|
||||
padding 16px
|
||||
font-size 10px
|
||||
background isDark ? #21242d : #fcfcfc
|
||||
background var(--subNoteBg)
|
||||
|
||||
@media (min-width 350px)
|
||||
font-size 12px
|
||||
|
|
|
@ -442,7 +442,7 @@ root(isDark)
|
|||
border none
|
||||
box-shadow none
|
||||
font-size 1em
|
||||
color isDark ? #606984 : #ddd
|
||||
color var(--noteActions)
|
||||
cursor pointer
|
||||
|
||||
&:not(:last-child)
|
||||
|
|
|
@ -14,8 +14,15 @@
|
|||
"faceDivider": "rgba(0, 0, 0, 0.3)",
|
||||
"popupBg": "#2c303c",
|
||||
"popupFg": "#d6dce2",
|
||||
"subNoteBg": "rgba(0, 0, 0, 0.18)",
|
||||
"renoteGradient": "#314027",
|
||||
"renoteText": "#9dbb00",
|
||||
"noteActions": "#606984",
|
||||
"noteActionsHover": "#a1a8bf",
|
||||
"noteActionsReplyHover": "#0af",
|
||||
"noteActionsRenoteHover": "#8d0",
|
||||
"noteActionsReactionHover": "#fa0",
|
||||
"noteActionsHighlighted": "#707b97",
|
||||
"modalBackdrop": "rgba(0, 0, 0, 0.5)",
|
||||
"dateDividerBg": "#242731",
|
||||
"dateDividerFg": "#666b79",
|
||||
|
|
|
@ -7,9 +7,9 @@
|
|||
"primary": "#fb8d4e",
|
||||
"primaryForeground": "#fff",
|
||||
"bg": "#1b1a35",
|
||||
"face": "#282c37",
|
||||
"faceHeader": "#313543",
|
||||
"faceDivider": "rgba(0, 0, 0, 0.3)",
|
||||
"face": "#2e2a3e",
|
||||
"faceHeader": "#36314e",
|
||||
"dateDividerBg": "#26253c",
|
||||
"popupBg": "#2c303c",
|
||||
"popupFg": "#d6dce2",
|
||||
"renoteGradient": "#5d2d1a",
|
||||
|
|
|
@ -14,8 +14,15 @@
|
|||
"faceDivider": "rgba(0, 0, 0, 0.082)",
|
||||
"popupBg": "#fff",
|
||||
"popupFg": "#586069",
|
||||
"subNoteBg": "rgba(0, 0, 0, 0.01)",
|
||||
"renoteGradient": "#edfde2",
|
||||
"renoteText": "#9dbb00",
|
||||
"noteActions": "#ddd",
|
||||
"noteActionsHover": "#444",
|
||||
"noteActionsReplyHover": "#0af",
|
||||
"noteActionsRenoteHover": "#8d0",
|
||||
"noteActionsReactionHover": "#fa0",
|
||||
"noteActionsHighlighted": "#888",
|
||||
"modalBackdrop": "rgba(0, 0, 0, 0.1)",
|
||||
"dateDividerBg": "#fdfdfd",
|
||||
"dateDividerFg": "#aaa",
|
||||
|
|
Loading…
Reference in a new issue