diff options
Diffstat (limited to 'pse-dashboard/src/components/FloatingLabelInput.vue')
-rw-r--r-- | pse-dashboard/src/components/FloatingLabelInput.vue | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/pse-dashboard/src/components/FloatingLabelInput.vue b/pse-dashboard/src/components/FloatingLabelInput.vue new file mode 100644 index 0000000..6f718fd --- /dev/null +++ b/pse-dashboard/src/components/FloatingLabelInput.vue @@ -0,0 +1,35 @@ +<script setup> +defineProps({ + type: { + type: String, + default: "text" + }, + label: { + type: String, + default: "Text" + }, + modelValue: { + type: String, + default: "" + } +}); +defineEmits(['update:modelValue']); + +</script> +<template> + <div class="form-floating form-input"> + <input + :id="$.uid" + :type="type" + class="form-control" + :value="modelValue" + :placeholder="label" + required + @input="$emit('update:modelValue', $event.target.value)" + > + <label :for="$.uid">{{ label }}</label> + </div> +</template> +<style scoped> +</style> + |