chore: change some var name related to hollowoutable

This commit is contained in:
07akioni 2019-09-19 11:17:55 +08:00
parent 71d4835ba8
commit 5cbc286d03
6 changed files with 15 additions and 15 deletions

View File

@ -32,7 +32,7 @@
<n-spin
v-if="loading"
:class="{
'simulate-transparent-stroke': simulateTransparent
'simulate-hollow-out-stroke': simulateHollowOut
}"
:size="null"
:stroke-width="4"
@ -40,7 +40,7 @@
<n-icon
v-else-if="icon"
:class="{
'simulate-transparent-text': simulateTransparent
'simulate-hollow-out-text': simulateHollowOut
}"
:type="icon"
/>
@ -58,7 +58,7 @@
v-if="!circle && $slots.default"
class="n-button__content"
:class="{
'simulate-transparent-text': simulateTransparent
'simulate-hollow-out-text': simulateHollowOut
}"
:style="style"
>
@ -83,7 +83,7 @@
<n-spin
v-if="loading"
:class="{
'simulate-transparent-stroke': simulateTransparent
'simulate-hollow-out-stroke': simulateHollowOut
}"
:stroke-width="4"
/>
@ -91,7 +91,7 @@
v-else-if="icon"
:type="icon"
:class="{
'simulate-transparent-text': simulateTransparent
'simulate-hollow-out-text': simulateHollowOut
}"
/>
<div
@ -193,7 +193,7 @@ export default {
avoidHollowOut () {
return this.ghost || !['primary', 'link', 'info', 'success', 'warning', 'error'].includes(this.type)
},
simulateTransparent () {
simulateHollowOut () {
if (this.ghost) return false
if (['primary', 'link', 'info', 'success', 'warning', 'error'].includes(this.type)) return true
else return false

View File

@ -12,7 +12,7 @@
<div
class="n-radio-button__label"
:class="{
'simulate-transparent-text': checked
'simulate-hollow-out-text': checked
}"
>
<slot />

View File

@ -22,14 +22,14 @@
<div
v-for="mark in computedMarks"
:key="mark.label"
class="n-slider-dot simulate-transparent-background"
class="n-slider-dot simulate-hollow-out-background"
:style="mark.style"
/>
</div>
</div>
<div
ref="firstHandle"
class="n-slider-handle simulate-transparent-background"
class="n-slider-handle simulate-hollow-out-background"
tabindex="0"
:style="firstHandleStyle"
@mousedown="handleFirstHandleMouseDown"
@ -39,7 +39,7 @@
<div
v-if="range"
ref="secondHandle"
class="n-slider-handle simulate-transparent-background"
class="n-slider-handle simulate-hollow-out-background"
tabindex="0"
:style="secondHandleStyle"
@mousedown="handleSecondHandleMouseDown"

View File

@ -29,7 +29,7 @@
v-if="!finished || (finished && finishStatus === 'process')"
class="n-step-indicator__index"
:class="{
'simulate-transparent-text': active
'simulate-hollow-out-text': active
}"
>
{{ index }}

View File

@ -43,7 +43,7 @@ export default {
},
mounted () {
this.hollowOutBackgroundColorId = 'x' + Math.random().toString(16).slice(9)
this.$el.setAttribute('n-background-id', this.hollowOutBackgroundColorId)
this.$el.setAttribute('n-hollowoutable-id', this.hollowOutBackgroundColorId)
if (this.avoidHollowOut) return
this.updateHollowOutStyle()
},

View File

@ -6,13 +6,13 @@ class HollowOutStyleManager {
}
styleForComponent (id, backgroundColor) {
if (!backgroundColor) return ''
return `[n-background-id=${id}] .simulate-transparent-text {
return `[n-hollowoutable-id=${id}] .simulate-hollow-out-text {
color: ${backgroundColor}!important;
}
[n-background-id=${id}] .simulate-transparent-background {
[n-hollowoutable-id=${id}] .simulate-hollow-out-background {
background-color: ${backgroundColor}!important;
}
[n-background-id=${id}] .simulate-transparent-stroke circle {
[n-hollowoutable-id=${id}] .simulate-hollow-out-stroke circle {
stroke: ${backgroundColor}!important;
}
`