wip
This commit is contained in:
syuilo
@ -304,9 +304,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
.xqnhankfuuilcwvhgsopeqncafzsquya
|
||||
text-align center
|
||||
|
||||
> .go-index
|
||||
@ -319,7 +317,7 @@ root(isDark)
|
||||
|
||||
> header
|
||||
padding 8px
|
||||
border-bottom dashed 1px isDark ? #4c5761 : #c4cdd4
|
||||
border-bottom dashed 1px var(--reversiGameHeaderLine)
|
||||
|
||||
a
|
||||
color inherit
|
||||
@ -386,16 +384,16 @@ root(isDark)
|
||||
user-select none
|
||||
|
||||
&.empty
|
||||
border solid 2px isDark ? #51595f : #eee
|
||||
border solid 2px var(--reversiGameEmptyCell)
|
||||
|
||||
&.empty.can
|
||||
background isDark ? #51595f : #eee
|
||||
background var(--reversiGameEmptyCell)
|
||||
|
||||
&.empty.myTurn
|
||||
border-color isDark ? #6a767f : #ddd
|
||||
border-color var(--reversiGameEmptyCellMyTurn)
|
||||
|
||||
&.can
|
||||
background isDark ? #51595f : #eee
|
||||
background var(--reversiGameEmptyCellCanPut)
|
||||
cursor pointer
|
||||
|
||||
&:hover
|
||||
@ -409,7 +407,7 @@ root(isDark)
|
||||
box-shadow 0 0 0 4px var(--primaryAlpha07)
|
||||
|
||||
&.isEnded
|
||||
border-color isDark ? #6a767f : #ddd
|
||||
border-color var(--reversiGameEmptyCellMyTurn)
|
||||
|
||||
&.none
|
||||
border-color transparent !important
|
||||
@ -458,10 +456,4 @@ root(isDark)
|
||||
margin 0 8px
|
||||
min-width 70px
|
||||
|
||||
.xqnhankfuuilcwvhgsopeqncafzsquya[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.xqnhankfuuilcwvhgsopeqncafzsquya:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -138,9 +138,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
.phgnkghfpyvkrvwiajkiuoxyrdaqpzcx
|
||||
> h1
|
||||
margin 0
|
||||
padding 24px
|
||||
@ -148,7 +146,7 @@ root(isDark)
|
||||
text-align center
|
||||
font-weight normal
|
||||
color #fff
|
||||
background linear-gradient(to bottom, isDark ? #45730e : #8bca3e, isDark ? #464300 : #d6cf31)
|
||||
background linear-gradient(to bottom, var(--reversiBannerGradientStart), var(--reversiBannerGradientEnd))
|
||||
|
||||
& + p
|
||||
margin 0
|
||||
@ -156,7 +154,7 @@ root(isDark)
|
||||
margin-bottom 12px
|
||||
text-align center
|
||||
font-size 14px
|
||||
border-bottom solid 1px isDark ? #535f65 : #d3d9dc
|
||||
border-bottom solid 1px var(--faceDivider)
|
||||
|
||||
> .play
|
||||
margin 0 auto
|
||||
@ -171,14 +169,14 @@ root(isDark)
|
||||
padding 16px
|
||||
font-size 14px
|
||||
text-align left
|
||||
background isDark ? #282c37 : #f5f5f5
|
||||
background var(--reversiDescBg)
|
||||
border-radius 8px
|
||||
|
||||
> section
|
||||
margin 0 auto
|
||||
padding 0 16px 16px 16px
|
||||
max-width 500px
|
||||
border-top solid 1px isDark ? #535f65 : #d3d9dc
|
||||
border-top solid 1px var(--faceDivider)
|
||||
|
||||
> h2
|
||||
margin 0
|
||||
@ -189,9 +187,9 @@ root(isDark)
|
||||
.invitation
|
||||
margin 8px 0
|
||||
padding 8px
|
||||
color isDark ? #fff : #677f84
|
||||
color var(--text)
|
||||
background var(--face)
|
||||
box-shadow 0 2px 16px rgba(#000, isDark ? 0.7 : 0.15)
|
||||
box-shadow 0 2px 16px var(--reversiListItemShadow)
|
||||
border-radius 6px
|
||||
cursor pointer
|
||||
|
||||
@ -203,10 +201,10 @@ root(isDark)
|
||||
border-color var(--primary)
|
||||
|
||||
&:hover
|
||||
background isDark ? #313543 : #f5f5f5
|
||||
box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.05)
|
||||
|
||||
&:active
|
||||
background isDark ? #1e222b : #eee
|
||||
box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.1)
|
||||
|
||||
> .avatar
|
||||
width 32px
|
||||
@ -221,9 +219,9 @@ root(isDark)
|
||||
display block
|
||||
margin 8px 0
|
||||
padding 8px
|
||||
color isDark ? #fff : #677f84
|
||||
color var(--text)
|
||||
background var(--face)
|
||||
box-shadow 0 2px 16px rgba(#000, isDark ? 0.7 : 0.15)
|
||||
box-shadow 0 2px 16px var(--reversiListItemShadow)
|
||||
border-radius 6px
|
||||
cursor pointer
|
||||
|
||||
@ -232,10 +230,10 @@ root(isDark)
|
||||
user-select none
|
||||
|
||||
&:hover
|
||||
background isDark ? #313543 : #f5f5f5
|
||||
box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.05)
|
||||
|
||||
&:active
|
||||
background isDark ? #1e222b : #eee
|
||||
box-shadow 0 0 0 100px inset rgba(0, 0, 0, 0.1)
|
||||
|
||||
> .avatar
|
||||
width 32px
|
||||
@ -246,10 +244,4 @@ root(isDark)
|
||||
margin 0 8px
|
||||
line-height 32px
|
||||
|
||||
.phgnkghfpyvkrvwiajkiuoxyrdaqpzcx[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.phgnkghfpyvkrvwiajkiuoxyrdaqpzcx:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -252,11 +252,9 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
.urbixznjwwuukfsckrwzwsqzsxornqij
|
||||
text-align center
|
||||
background isDark ? #191b22 : #f9f9f9
|
||||
background var(--bg)
|
||||
|
||||
> header
|
||||
padding 8px
|
||||
@ -274,9 +272,9 @@ root(isDark)
|
||||
width 100%
|
||||
padding 12px 14px
|
||||
background var(--face)
|
||||
border 1px solid isDark ? #6a707d : #dcdfe6
|
||||
border 1px solid var(--reversiMapSelectBorder)
|
||||
border-radius 4px
|
||||
color isDark ? #fff : #606266
|
||||
color var(--text)
|
||||
cursor pointer
|
||||
transition border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
|
||||
-webkit-appearance none
|
||||
@ -284,7 +282,7 @@ root(isDark)
|
||||
appearance none
|
||||
|
||||
&:hover
|
||||
border-color isDark ? #a7aebd : #c0c4cc
|
||||
border-color var(--reversiMapSelectHoverBorder)
|
||||
|
||||
&:focus
|
||||
&:active
|
||||
@ -294,7 +292,8 @@ root(isDark)
|
||||
> .random
|
||||
padding 32px 0
|
||||
font-size 64px
|
||||
color isDark ? #4e5961 : #d8d8d8
|
||||
color var(--text)
|
||||
opacity 0.7
|
||||
|
||||
> .board
|
||||
display grid
|
||||
@ -302,11 +301,11 @@ root(isDark)
|
||||
width 300px
|
||||
height 300px
|
||||
margin 0 auto
|
||||
color isDark ? #fff : #444
|
||||
color var(--text)
|
||||
|
||||
> div
|
||||
background transparent
|
||||
border solid 2px isDark ? #6a767f : #ddd
|
||||
border solid 2px var(--faceDivider)
|
||||
border-radius 6px
|
||||
overflow hidden
|
||||
cursor pointer
|
||||
@ -332,31 +331,25 @@ root(isDark)
|
||||
max-width 400px
|
||||
border-radius 4px
|
||||
background var(--face)
|
||||
color isDark ? #fff : #303133
|
||||
box-shadow 0 2px 12px 0 rgba(#000, isDark ? 0.7 : 0.1)
|
||||
color var(--text)
|
||||
box-shadow 0 2px 12px 0 var(--reversiRoomFormShadow)
|
||||
|
||||
> header
|
||||
padding 18px 20px
|
||||
border-bottom 1px solid isDark ? #1c2023 : #ebeef5
|
||||
border-bottom 1px solid var(--faceDivider)
|
||||
|
||||
> div
|
||||
padding 20px
|
||||
color isDark ? #fff : #606266
|
||||
color var(--text)
|
||||
|
||||
> footer
|
||||
position sticky
|
||||
bottom 0
|
||||
padding 16px
|
||||
background rgba(isDark ? #191b22 : #fff, 0.9)
|
||||
border-top solid 1px isDark ? #606266 : #c4cdd4
|
||||
background var(--reversiRoomFooterBg)
|
||||
border-top solid 1px var(--faceDivider)
|
||||
|
||||
> .status
|
||||
margin 0 0 16px 0
|
||||
|
||||
.urbixznjwwuukfsckrwzwsqzsxornqij[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.urbixznjwwuukfsckrwzwsqzsxornqij:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -156,11 +156,9 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
color isDark ? #fff : #677f84
|
||||
background isDark ? #191b22 : #fff
|
||||
.vchtoekanapleubgzioubdtmlkribzfd
|
||||
color var(--text)
|
||||
background var(--bg)
|
||||
|
||||
> .matching
|
||||
> h1
|
||||
@ -177,10 +175,4 @@ root(isDark)
|
||||
text-align center
|
||||
border-top dashed 1px #c4cdd4
|
||||
|
||||
.vchtoekanapleubgzioubdtmlkribzfd[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.vchtoekanapleubgzioubdtmlkribzfd:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -195,9 +195,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
.mk-messaging-form
|
||||
> textarea
|
||||
cursor auto
|
||||
display block
|
||||
@ -212,7 +210,7 @@ root(isDark)
|
||||
color var(--inputText)
|
||||
outline none
|
||||
border none
|
||||
border-top solid 1px isDark ? #4b5056 : #eee
|
||||
border-top solid 1px var(--faceDivider)
|
||||
border-radius 0
|
||||
box-shadow none
|
||||
background transparent
|
||||
@ -302,10 +300,4 @@ root(isDark)
|
||||
input[type=file]
|
||||
display none
|
||||
|
||||
.mk-messaging-form[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.mk-messaging-form:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -67,10 +67,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
|
||||
.mk-poll
|
||||
> ul
|
||||
display block
|
||||
margin 0
|
||||
@ -82,8 +79,8 @@ root(isDark)
|
||||
margin 4px 0
|
||||
padding 4px 8px
|
||||
width 100%
|
||||
color isDark ? #fff : #000
|
||||
border solid 1px isDark ? #5e636f : #eee
|
||||
color var(--pollChoiceText)
|
||||
border solid 1px var(--pollChoiceBorder)
|
||||
border-radius 4px
|
||||
overflow hidden
|
||||
cursor pointer
|
||||
@ -110,7 +107,7 @@ root(isDark)
|
||||
margin-left 4px
|
||||
|
||||
> p
|
||||
color isDark ? #a3aebf : #000
|
||||
color var(--text)
|
||||
|
||||
a
|
||||
color inherit
|
||||
@ -125,10 +122,4 @@ root(isDark)
|
||||
&:active
|
||||
background transparent
|
||||
|
||||
.mk-poll[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.mk-poll:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -63,7 +63,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
root(isDark)
|
||||
.jtivnzhfwquxpsfidertopbmwmchmnmo
|
||||
height 100%
|
||||
width 100%
|
||||
|
||||
@ -81,10 +81,4 @@ root(isDark)
|
||||
height 100%
|
||||
width 100%
|
||||
|
||||
.jtivnzhfwquxpsfidertopbmwmchmnmo[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.jtivnzhfwquxpsfidertopbmwmchmnmo:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -49,13 +49,14 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
root(isDark)
|
||||
.csqvmxybqbycalfhkxvyfrgbrdalkaoc
|
||||
> .fetching
|
||||
> .empty
|
||||
margin 0
|
||||
padding 16px
|
||||
text-align center
|
||||
color #aaa
|
||||
color var(--text)
|
||||
opacity 0.7
|
||||
|
||||
> [data-fa]
|
||||
margin-right 4px
|
||||
@ -70,13 +71,13 @@ root(isDark)
|
||||
padding 14px 16px
|
||||
|
||||
&:not(:last-child)
|
||||
border-bottom solid 1px isDark ? #393f4f : #eee
|
||||
border-bottom solid 1px var(--faceDivider)
|
||||
|
||||
> .tag
|
||||
flex 1
|
||||
overflow hidden
|
||||
font-size 14px
|
||||
color isDark ? #9baec8 : #65727b
|
||||
color var(--text)
|
||||
|
||||
> a
|
||||
display block
|
||||
@ -94,10 +95,4 @@ root(isDark)
|
||||
> .chart
|
||||
height 30px
|
||||
|
||||
.csqvmxybqbycalfhkxvyfrgbrdalkaoc[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.csqvmxybqbycalfhkxvyfrgbrdalkaoc:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -32,7 +32,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
root(isDark, fill)
|
||||
root(fill)
|
||||
> button
|
||||
display block
|
||||
width 100%
|
||||
@ -65,16 +65,10 @@ root(isDark, fill)
|
||||
&:active
|
||||
background var(--primaryAlpha03)
|
||||
|
||||
.ui-button[data-darkmode]
|
||||
.ui-button
|
||||
&.fill
|
||||
root(true, true)
|
||||
root(true)
|
||||
&:not(.fill)
|
||||
root(true, false)
|
||||
|
||||
.ui-button:not([data-darkmode])
|
||||
&.fill
|
||||
root(false, true)
|
||||
&:not(.fill)
|
||||
root(false, false)
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -25,9 +25,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
.nvemkhtwcnnpkdrwfcbzuwhfulejhmzg
|
||||
display inline-block
|
||||
|
||||
& + .nvemkhtwcnnpkdrwfcbzuwhfulejhmzg
|
||||
@ -38,11 +36,11 @@ root(isDark)
|
||||
margin 0
|
||||
padding 12px 20px
|
||||
font-size 14px
|
||||
border 1px solid isDark ? #6d727d : #dcdfe6
|
||||
border 1px solid var(--formButtonBorder)
|
||||
border-radius 4px
|
||||
outline none
|
||||
box-shadow none
|
||||
color isDark ? #fff : #606266
|
||||
color var(--text)
|
||||
transition 0.1s
|
||||
|
||||
*
|
||||
@ -51,12 +49,12 @@ root(isDark)
|
||||
&:hover
|
||||
&:focus
|
||||
color var(--primary)
|
||||
//background rgba(var(--primary-r), var(--primary-g), var(--primary-b), isDark ? 0.2 : 0.12)
|
||||
//border-color rgba(var(--primary-r), var(--primary-g), var(--primary-b), isDark ? 0.5 : 0.3)
|
||||
background var(--formButtonHoverBg)
|
||||
border-color var(--formButtonHoverBorder)
|
||||
|
||||
&:active
|
||||
color var(--primaryDarken20)
|
||||
//background rgba(var(--primary-r), var(--primary-g), var(--primary-b), 0.12)
|
||||
background var(--formButtonActiveBg)
|
||||
border-color var(--primary)
|
||||
transition all 0s
|
||||
|
||||
@ -80,10 +78,4 @@ root(isDark)
|
||||
> button
|
||||
border-radius 64px
|
||||
|
||||
.nvemkhtwcnnpkdrwfcbzuwhfulejhmzg[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.nvemkhtwcnnpkdrwfcbzuwhfulejhmzg:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -49,9 +49,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
.uywduthvrdnlpsvsjkqigicixgyfctto
|
||||
display inline-flex
|
||||
margin 0 16px 0 0
|
||||
cursor pointer
|
||||
@ -93,7 +91,7 @@ root(isDark)
|
||||
width 20px
|
||||
height 20px
|
||||
background none
|
||||
border solid 2px isDark ? rgba(#fff, 0.6) : rgba(#000, 0.4)
|
||||
border solid 2px var(--radioBorder)
|
||||
border-radius 100%
|
||||
transition inherit
|
||||
|
||||
@ -117,10 +115,4 @@ root(isDark)
|
||||
line-height 20px
|
||||
cursor pointer
|
||||
|
||||
.uywduthvrdnlpsvsjkqigicixgyfctto[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.uywduthvrdnlpsvsjkqigicixgyfctto:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -155,9 +155,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark, fill)
|
||||
root(fill)
|
||||
margin 32px 0
|
||||
|
||||
> .icon
|
||||
@ -335,16 +333,10 @@ root(isDark, fill)
|
||||
left 0 !important
|
||||
transform scale(0.75)
|
||||
|
||||
.ui-input[data-darkmode]
|
||||
.ui-input
|
||||
&.fill
|
||||
root(true, true)
|
||||
root(true)
|
||||
&:not(.fill)
|
||||
root(true, false)
|
||||
|
||||
.ui-input:not([data-darkmode])
|
||||
&.fill
|
||||
root(false, true)
|
||||
&:not(.fill)
|
||||
root(false, false)
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -51,9 +51,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark)
|
||||
.ui-radio
|
||||
display inline-block
|
||||
margin 0 32px 0 0
|
||||
cursor pointer
|
||||
@ -111,10 +109,4 @@ root(isDark)
|
||||
line-height 20px
|
||||
cursor pointer
|
||||
|
||||
.ui-radio[data-darkmode]
|
||||
root(true)
|
||||
|
||||
.ui-radio:not([data-darkmode])
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
@ -70,9 +70,7 @@ export default Vue.extend({
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
|
||||
|
||||
root(isDark, fill)
|
||||
root(fill)
|
||||
margin 32px 0
|
||||
|
||||
> .icon
|
||||
@ -200,16 +198,10 @@ root(isDark, fill)
|
||||
left 0 !important
|
||||
transform scale(0.75)
|
||||
|
||||
.ui-select[data-darkmode]
|
||||
.ui-select
|
||||
&.fill
|
||||
root(true, true)
|
||||
root(true)
|
||||
&:not(.fill)
|
||||
root(true, false)
|
||||
|
||||
.ui-select:not([data-darkmode])
|
||||
&.fill
|
||||
root(false, true)
|
||||
&:not(.fill)
|
||||
root(false, false)
|
||||
root(false)
|
||||
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user