mirror of
https://github.com/owntone/owntone-server.git
synced 2025-01-26 22:23:17 -05:00
[web] Use default Bulma progress bar styles
This commit is contained in:
parent
7fcc0473a8
commit
b2ee4f3f19
@ -1,26 +1,21 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="width > 0"
|
||||
class="progress-bar"
|
||||
:style="{ width: width_percent }"
|
||||
<progress
|
||||
v-if="value > 0"
|
||||
class="progress is-info"
|
||||
:value="value"
|
||||
:max="max"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'ProgressBar',
|
||||
props: ['max', 'value'],
|
||||
|
||||
computed: {
|
||||
width() {
|
||||
if (this.value > 0 && this.max > 0) {
|
||||
return parseInt((this.value * 100) / this.max)
|
||||
}
|
||||
return 0
|
||||
},
|
||||
width_percent() {
|
||||
return `${this.width}%`
|
||||
}
|
||||
}
|
||||
props: ['max', 'value']
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.progress {
|
||||
height: 0.25rem;
|
||||
}
|
||||
</style>
|
||||
|
@ -13,12 +13,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
background-color: $info;
|
||||
border-radius: 2px;
|
||||
height: 4px;
|
||||
}
|
||||
|
||||
.media.with-progress h2:last-of-type {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user