Fixes: Style compatibility and gradient exceptions

This commit is contained in:
jiaming743 2019-08-27 10:21:42 +08:00
parent 4bd17d0a07
commit e069d52544
3 changed files with 21 additions and 4 deletions

View File

@ -1,7 +1,15 @@
.dv-percent-pond { .dv-percent-pond {
position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.dv-percent-pond svg {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
}
.dv-percent-pond polyline { .dv-percent-pond polyline {
transition: all 0.3s; transition: all 0.3s;
} }

View File

@ -4,13 +4,13 @@
<defs> <defs>
<linearGradient :id="gradientId1" x1="0%" y1="0%" x2="100%" y2="0%"> <linearGradient :id="gradientId1" x1="0%" y1="0%" x2="100%" y2="0%">
<stop v-for="lc in linearGradient" :key="lc[0]" <stop v-for="lc in linearGradient" :key="lc[0]"
:offset="lc[0]" :offset="`${lc[0]}%`"
:stop-color="lc[1]" /> :stop-color="lc[1]" />
</linearGradient> </linearGradient>
<linearGradient :id="gradientId2" x1="0%" y1="0%" :x2="gradient2XPos" y2="0%"> <linearGradient :id="gradientId2" x1="0%" y1="0%" :x2="gradient2XPos" y2="0%">
<stop v-for="lc in linearGradient" :key="lc[0]" <stop v-for="lc in linearGradient" :key="lc[0]"
:offset="lc[0]" :offset="`${lc[0]}%`"
:stop-color="lc[1]" /> :stop-color="lc[1]" />
</linearGradient> </linearGradient>
</defs> </defs>

View File

@ -4,13 +4,13 @@
<defs> <defs>
<linearGradient :id="gradientId1" x1="0%" y1="0%" x2="100%" y2="0%"> <linearGradient :id="gradientId1" x1="0%" y1="0%" x2="100%" y2="0%">
<stop v-for="lc in linearGradient" :key="lc[0]" <stop v-for="lc in linearGradient" :key="lc[0]"
:offset="lc[0]" :offset="`${lc[0]}%`"
:stop-color="lc[1]" /> :stop-color="lc[1]" />
</linearGradient> </linearGradient>
<linearGradient :id="gradientId2" x1="0%" y1="0%" :x2="gradient2XPos" y2="0%"> <linearGradient :id="gradientId2" x1="0%" y1="0%" :x2="gradient2XPos" y2="0%">
<stop v-for="lc in linearGradient" :key="lc[0]" <stop v-for="lc in linearGradient" :key="lc[0]"
:offset="lc[0]" :offset="`${lc[0]}%`"
:stop-color="lc[1]" /> :stop-color="lc[1]" />
</linearGradient> </linearGradient>
</defs> </defs>
@ -254,9 +254,18 @@ export default {
<style lang="less"> <style lang="less">
.dv-percent-pond { .dv-percent-pond {
position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
svg {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
}
polyline { polyline {
transition: all 0.3s; transition: all 0.3s;
} }