40 lines
1.4 KiB
Vue
40 lines
1.4 KiB
Vue
|
|
<script setup>
|
||
|
|
const props = defineProps({ flags: { type: Object, required: true } })
|
||
|
|
const emit = defineEmits(['update:flags'])
|
||
|
|
|
||
|
|
const set = (key, val) => emit('update:flags', { ...props.flags, [key]: val })
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div class="grid grid-cols-2 gap-3">
|
||
|
|
<label class="ascii-label">
|
||
|
|
Width
|
||
|
|
<input class="ascii-input" type="number" min="1" :value="flags.width"
|
||
|
|
@input="set('width', $event.target.value)" placeholder="auto" />
|
||
|
|
</label>
|
||
|
|
<label class="ascii-label">
|
||
|
|
Height
|
||
|
|
<input class="ascii-input" type="number" min="1" :value="flags.height"
|
||
|
|
@input="set('height', $event.target.value)" placeholder="auto" />
|
||
|
|
</label>
|
||
|
|
<label class="ascii-label">
|
||
|
|
Format
|
||
|
|
<select class="ascii-input" :value="flags.format"
|
||
|
|
@change="set('format', $event.target.value)">
|
||
|
|
<option value="">default</option>
|
||
|
|
<option>ansi</option><option>utf8</option><option>html</option>
|
||
|
|
</select>
|
||
|
|
</label>
|
||
|
|
<label class="ascii-label">
|
||
|
|
Dither
|
||
|
|
<input class="ascii-input" type="text" :value="flags.dither"
|
||
|
|
@input="set('dither', $event.target.value)" placeholder="default" />
|
||
|
|
</label>
|
||
|
|
<label class="ascii-label col-span-2">
|
||
|
|
Gamma
|
||
|
|
<input class="ascii-input" type="number" min="0.1" step="0.1" :value="flags.gamma"
|
||
|
|
@input="set('gamma', $event.target.value)" placeholder="1.0" />
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
</template>
|