user auth rose pine color scheme

ui/components/Input.vue

@@ -0,0 +1,17 @@
+<script setup>
+const props = defineProps({
+    placeholder: String,
+    type: String | undefined,
+})
+const emit = defineEmits(['update:modelValue'])
+
+function updateValue(value) {
+    emit('update:modelValue', value)
+}
+</script>
+
+<template>
+    <input
+        class="py-2 px-4 resize-none bg-overlay rounded-md my-2 border border-muted/20 hover:border-muted/40 focus:border-muted/60 placeholder:italic placeholder:text-subtle transition-[border-color] max-w-64"
+        :placeholder="placeholder" :type="type" v-on:input="updateValue($event.target.value)" />
+</template>