thepaperpilot/chromatic-lattice
1
0
Fork 0
Code Issues Pull requests Releases Activity Actions

Made slider tooltips appear below the slider

Browse source
This commit is contained in:
thepaperpilot 2022-05-20 00:51:37 -05:00
parent f23541f3a6
commit 0ead4e8ce0
1 changed files with 2 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/components/fields/Slider.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<div class="field"> <div class="field">
<span class="field-title" v-if="title">{{ title }}</span> <span class="field-title" v-if="title">{{ title }}</span>
<Tooltip :display="`${value}`" :class="{ fullWidth: !title }"> <Tooltip :display="`${value}`" :class="{ fullWidth: !title }" :direction="Direction.Down">
<input type="range" v-model="value" :min="min" :max="max" /> <input type="range" v-model="value" :min="min" :max="max" />
</Tooltip> </Tooltip>
</div> </div>
@ -11,6 +11,7 @@
import { computed, toRefs, unref } from "vue"; import { computed, toRefs, unref } from "vue";
import Tooltip from "features/tooltips/Tooltip.vue"; import Tooltip from "features/tooltips/Tooltip.vue";
import "components/common/fields.css"; import "components/common/fields.css";
import { Direction } from "util/common";
const _props = defineProps<{ const _props = defineProps<{
title?: string; title?: string;