aboutsummaryrefslogtreecommitdiff
path: root/src/components/opacity_input/opacity_input.vue
diff options
context:
space:
mode:
authorRinpatch <rinpatch@sdf.org>2018-12-13 17:22:19 +0300
committerRinpatch <rinpatch@sdf.org>2018-12-13 17:22:19 +0300
commit6de4dcc7c99e14552303e5eee7dac31dd5e58e2e (patch)
tree668904f3dba16ab39f683345b2e979e57696db94 /src/components/opacity_input/opacity_input.vue
parent48edc0c8fcc6c63e432c9b6d78f14af086b56900 (diff)
parent8e4777ccc6bf72b56a0905ca491c8e0e97fb73cf (diff)
Resolve merge conflict
Diffstat (limited to 'src/components/opacity_input/opacity_input.vue')
-rw-r--r--src/components/opacity_input/opacity_input.vue38
1 files changed, 38 insertions, 0 deletions
diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
new file mode 100644
index 00000000..3926915b
--- /dev/null
+++ b/src/components/opacity_input/opacity_input.vue
@@ -0,0 +1,38 @@
+<template>
+<div class="opacity-control style-control" :class="{ disabled: !present || disabled }">
+ <label :for="name" class="label">
+ {{$t('settings.style.common.opacity')}}
+ </label>
+ <input
+ v-if="typeof fallback !== 'undefined'"
+ class="opt exclude-disabled"
+ :id="name + '-o'"
+ type="checkbox"
+ :checked="present"
+ @input="$emit('input', !present ? fallback : undefined)">
+ <label v-if="typeof fallback !== 'undefined'" class="opt-l" :for="name + '-o'"></label>
+ <input
+ :id="name"
+ class="input-number"
+ type="number"
+ :value="value || fallback"
+ :disabled="!present || disabled"
+ @input="$emit('input', $event.target.value)"
+ max="1"
+ min="0"
+ step=".05">
+</div>
+</template>
+
+<script>
+export default {
+ props: [
+ 'name', 'value', 'fallback', 'disabled'
+ ],
+ computed: {
+ present () {
+ return typeof this.value !== 'undefined'
+ }
+ }
+}
+</script>