wip
This commit is contained in:
parent
18be0d36f3
commit
fccfe19e13
8 changed files with 45 additions and 59 deletions
|
@ -16,23 +16,17 @@ export default define({
|
|||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
root(isDark)
|
||||
.mkw-nav
|
||||
.mkw-nav--body
|
||||
padding 16px
|
||||
font-size 12px
|
||||
color isDark ? #9aa4b3 : #aaa
|
||||
color var(--text)
|
||||
background var(--face)
|
||||
|
||||
a
|
||||
color isDark ? #9aa4b3 : #999
|
||||
color var(--text)
|
||||
|
||||
i
|
||||
color isDark ? #9aa4b3 : #ccc
|
||||
|
||||
.mkw-nav[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.mkw-nav:not([data-darkmode])
|
||||
root(false)
|
||||
color var(--text)
|
||||
|
||||
</style>
|
||||
|
|
|
@ -173,7 +173,7 @@ export default define({
|
|||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
root(isDark)
|
||||
.qpdmibaztplkylerhdbllwcokyrfxeyj
|
||||
&.dual
|
||||
> svg
|
||||
width 50%
|
||||
|
@ -192,7 +192,7 @@ root(isDark)
|
|||
|
||||
> text
|
||||
font-size 5px
|
||||
fill isDark ? rgba(#fff, 0.55) : rgba(#000, 0.55)
|
||||
fill var(--chartCaption)
|
||||
|
||||
> tspan
|
||||
opacity 0.5
|
||||
|
@ -202,10 +202,4 @@ root(isDark)
|
|||
display block
|
||||
clear both
|
||||
|
||||
.qpdmibaztplkylerhdbllwcokyrfxeyj[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.qpdmibaztplkylerhdbllwcokyrfxeyj:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
|
|
@ -65,7 +65,7 @@ export default define({
|
|||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
root(isDark)
|
||||
.mkw-rss
|
||||
.mkw-rss--body
|
||||
.feed
|
||||
padding 12px 16px
|
||||
|
@ -74,8 +74,8 @@ root(isDark)
|
|||
> a
|
||||
display block
|
||||
padding 4px 0
|
||||
color isDark ? #9aa4b3 : #666
|
||||
border-bottom dashed 1px isDark ? #1c2023 : #eee
|
||||
color var(--text)
|
||||
border-bottom dashed 1px var(--faceDivider)
|
||||
|
||||
&:last-child
|
||||
border-bottom none
|
||||
|
@ -90,7 +90,7 @@ root(isDark)
|
|||
margin-right 4px
|
||||
|
||||
&[data-mobile]
|
||||
background isDark ? #21242f : #f3f3f3
|
||||
background var(--face)
|
||||
|
||||
.feed
|
||||
padding 0
|
||||
|
@ -100,12 +100,6 @@ root(isDark)
|
|||
border-bottom none
|
||||
|
||||
&:nth-child(even)
|
||||
background isDark ? rgba(#000, 0.05) : rgba(#fff, 0.7)
|
||||
|
||||
.mkw-rss[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.mkw-rss:not([data-darkmode])
|
||||
root(false)
|
||||
background rgba(#000, 0.05)
|
||||
|
||||
</style>
|
||||
|
|
|
@ -129,7 +129,7 @@ export default Vue.extend({
|
|||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
root(isDark)
|
||||
.cpu-memory
|
||||
> svg
|
||||
display block
|
||||
padding 10px
|
||||
|
@ -144,7 +144,7 @@ root(isDark)
|
|||
|
||||
> text
|
||||
font-size 5px
|
||||
fill isDark ? rgba(#fff, 0.55) : rgba(#000, 0.55)
|
||||
fill var(--chartCaption)
|
||||
|
||||
> tspan
|
||||
opacity 0.5
|
||||
|
@ -154,10 +154,4 @@ root(isDark)
|
|||
display block
|
||||
clear both
|
||||
|
||||
.cpu-memory[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.cpu-memory:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
|
|
@ -125,7 +125,7 @@ root(isDark)
|
|||
|
||||
> text
|
||||
font-size 10px
|
||||
fill isDark ? rgba(#fff, 0.55) : rgba(#000, 0.55)
|
||||
fill var(--chartCaption)
|
||||
|
||||
> tspan
|
||||
opacity 0.5
|
||||
|
|
|
@ -115,10 +115,8 @@ export default Vue.extend({
|
|||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
$bg = isDark ? #22252f : #f7f7f7
|
||||
main
|
||||
$bg = var(--face)
|
||||
|
||||
> .is-suspended
|
||||
> .is-remote
|
||||
|
@ -148,7 +146,7 @@ root(isDark)
|
|||
|
||||
> .banner
|
||||
padding-bottom 33.3%
|
||||
background-color isDark ? #5f7273 : #cacaca
|
||||
background-color rgba(0, 0, 0, 0.1)
|
||||
background-size cover
|
||||
background-position center
|
||||
|
||||
|
@ -198,26 +196,26 @@ root(isDark)
|
|||
margin 0
|
||||
line-height 22px
|
||||
font-size 20px
|
||||
color isDark ? #fff : #757c82
|
||||
color var(--mobileUserPageName)
|
||||
|
||||
> .username
|
||||
display inline-block
|
||||
line-height 20px
|
||||
font-size 16px
|
||||
font-weight bold
|
||||
color isDark ? #657786 : #969ea5
|
||||
color var(--mobileUserPageAcct)
|
||||
|
||||
> .followed
|
||||
margin-left 8px
|
||||
padding 2px 4px
|
||||
font-size 12px
|
||||
color isDark ? #657786 : #fff
|
||||
background isDark ? #f8f8f8 : #a7bec7
|
||||
color var(--mobileUserPageFollowedFg)
|
||||
background var(--mobileUserPageFollowedBg)
|
||||
border-radius 4px
|
||||
|
||||
> .description
|
||||
margin 8px 0
|
||||
color isDark ? #fff : #757c82
|
||||
color var(--mobileUserPageDescription)
|
||||
|
||||
> .info
|
||||
margin 8px 0
|
||||
|
@ -225,14 +223,14 @@ root(isDark)
|
|||
> p
|
||||
display inline
|
||||
margin 0 16px 0 0
|
||||
color isDark ? #a9b9c1 : #90989c
|
||||
color var(--text)
|
||||
|
||||
> i
|
||||
margin-right 4px
|
||||
|
||||
> .status
|
||||
> a
|
||||
color isDark ? #657786 : #818a92
|
||||
color var(--text)
|
||||
|
||||
&:not(:last-child)
|
||||
margin-right 16px
|
||||
|
@ -240,7 +238,7 @@ root(isDark)
|
|||
> b
|
||||
margin-right 4px
|
||||
font-size 16px
|
||||
color isDark ? #fff : #787e86
|
||||
color var(--mobileUserPageStatusHighlight)
|
||||
|
||||
> i
|
||||
font-size 14px
|
||||
|
@ -249,7 +247,7 @@ root(isDark)
|
|||
position -webkit-sticky
|
||||
position sticky
|
||||
top 47px
|
||||
box-shadow 0 4px 4px isDark ? rgba(#000, 0.3) : rgba(#000, 0.07)
|
||||
box-shadow 0 4px 4px var(--mobileUserPageHeaderShadow)
|
||||
background-color $bg
|
||||
z-index 2
|
||||
|
||||
|
@ -266,7 +264,7 @@ root(isDark)
|
|||
line-height 48px
|
||||
font-size 12px
|
||||
text-decoration none
|
||||
color isDark ? #657786 : #9ca1a5
|
||||
color var(--text)
|
||||
border-bottom solid 2px transparent
|
||||
|
||||
@media (min-width 400px)
|
||||
|
@ -289,10 +287,4 @@ root(isDark)
|
|||
@media (min-width 600px)
|
||||
padding 32px
|
||||
|
||||
main[data-darkmode]
|
||||
root(true)
|
||||
|
||||
main:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
|
|
@ -86,6 +86,8 @@
|
|||
"calendarSaturdayOrSunday": "#ff6679",
|
||||
"calendarDay": "#c5ced6",
|
||||
|
||||
"chartCaption": ":alpha<0.6<$text",
|
||||
|
||||
"announcementsBg": "#253a50",
|
||||
"announcementsTitle": "#539eff",
|
||||
"announcementsText": "#fff",
|
||||
|
@ -125,6 +127,13 @@
|
|||
"desktopSettingsNavItem": ":alpha<0.8<$text",
|
||||
"desktopSettingsNavItemHover": ":lighten<10<$text",
|
||||
|
||||
"mobileUserPageName": "#fff",
|
||||
"mobileUserPageAcct": "$text",
|
||||
"mobileUserPageDescription": "$text",
|
||||
"mobileUserPageFollowedBg": "rgba(0, 0, 0, 0.3)",
|
||||
"mobileUserPageFollowedFg": "$text",
|
||||
"mobileUserPageStatusHighlight": "#fff",
|
||||
"mobileUserPageHeaderShadow": "rgba(0, 0, 0, 0.3)",
|
||||
"mobileAnnouncement": "rgba(30, 129, 216, 0.2)",
|
||||
"mobileAnnouncementFg": "#fff",
|
||||
"mobileSignedInAsBg": "#273c34",
|
||||
|
|
|
@ -86,6 +86,8 @@
|
|||
"calendarSaturdayOrSunday": "#ef95a0",
|
||||
"calendarDay": "#777",
|
||||
|
||||
"chartCaption": ":alpha<0.6<$text",
|
||||
|
||||
"announcementsBg": "#f3f9ff",
|
||||
"announcementsTitle": "#4078c0",
|
||||
"announcementsText": "#57616f",
|
||||
|
@ -125,6 +127,13 @@
|
|||
"desktopSettingsNavItem": ":alpha<0.8<$text",
|
||||
"desktopSettingsNavItemHover": ":darken<10<$text",
|
||||
|
||||
"mobileUserPageName": "#757c82",
|
||||
"mobileUserPageAcct": "#969ea5",
|
||||
"mobileUserPageDescription": "#757c82",
|
||||
"mobileUserPageFollowedBg": "#a7bec7",
|
||||
"mobileUserPageFollowedFg": "#fff",
|
||||
"mobileUserPageStatusHighlight": "#787e86",
|
||||
"mobileUserPageHeaderShadow": "rgba(0, 0, 0, 0.07)",
|
||||
"mobileAnnouncement": "rgba(155, 196, 232, 0.2)",
|
||||
"mobileAnnouncementFg": "#3f4967",
|
||||
"mobileSignedInAsBg": "#fcfff5",
|
||||
|
|
Loading…
Reference in a new issue