cindylouwho/ImmortalClanVue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

bloodchart resize

Browse Source
This commit is contained in:
EmberSpirit
2023-10-19 11:46:43 +02:00
parent f45128ceb9
commit cfaf527b95
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/BloodChart.vue
+6 -6
View File
@@ -127,11 +127,11 @@ function onSwiper(swiper) {
const token = computed(() => props.data?.token); const token = computed(() => props.data?.token);
//start with visual 5% of the filled bar, because otherwise the percentage number is not visible //start with visual 8% of the filled bar, because otherwise the percentage number is not visible
function getPercentageBloodChart(amount, goal) { function getPercentageBloodChart(amount, goal) {
let returnNumber = 5; let returnNumber = 8;
if ((Number(amount) / Number(goal)) * 100 < 5) { if ((Number(amount) / Number(goal)) * 100 < 8) {
returnNumber = 5; returnNumber = 8;
} else { } else {
returnNumber = (Number(amount) / Number(goal)) * 100; returnNumber = (Number(amount) / Number(goal)) * 100;
} }
@@ -147,7 +147,7 @@ function getPercentageBloodChart(amount, goal) {
// margin-bottom: 80px // margin-bottom: 80px
position: relative position: relative
.blood-chart .blood-chart
height: 750px height: 560px
width: 100% width: 100%
justify-content: space-around justify-content: space-around
display: inline-flex display: inline-flex
@@ -186,7 +186,7 @@ function getPercentageBloodChart(amount, goal) {
margin-bottom: 32px margin-bottom: 32px
.blood-chart-element-body .blood-chart-element-body
background-color: rgba(233, 233, 233, 0.2) background-color: rgba(233, 233, 233, 0.2)
flex: 0 0 500px flex: 1 1 100%
width: 60px width: 60px
border-radius: 8px 8px 40px 40px border-radius: 8px 8px 40px 40px
text-align: left text-align: left