Profectus/src/components/fields/Slider.vue

26 lines
493 B
Vue

<template>
<div class="field">
<span class="field-title" v-if="title">{{ title }}</span>
<tooltip :text="`${value}`" :class="{ fullWidth: !title }">
<input type="range" :value="value" @input="e => $emit('change', parseInt(e.target.value))" :min="min" :max="max" />
</tooltip>
</div>
</template>
<script>
export default {
name: 'Slider',
props: {
title: String,
value: Number,
min: Number,
max: Number
}
};
</script>
<style scoped>
.fullWidth {
width: 100%;
}
</style>