add: new price card design

Bigger header, icons for deletion and edit, form validation

app/components/Pp/FormInput.vue

@@ -1,6 +1,7 @@
 <template>
-  <div class="Input flex-col">
-    <input
+  <div class="Input">
+    <div class="input-wrapper flex-col">
+      <input
         v-model="text"
         :type="type"
         :id="id"
@@ -10,8 +11,10 @@
         :required="required"
         placeholder=" "
         @blur="emit('blur')"
-    />
-    <label :for="id">{{ label }}</label>
+      />
+      <label :for="id">{{ label }}</label>
+    </div>
+    <span v-if="message">{{ message }}</span>
   </div>
 </template>
 
@@ -22,6 +25,7 @@ type Props = {
   min ?: number
   step ?: number
   required ?: boolean
+  message ?: string
   label : string
   id : string
 }
@@ -31,9 +35,6 @@ const {
   required = false,
   step = 0.01,
   min = 1,
-  max,
-  label,
-  id,
 } = defineProps<Props>()
 
 const emit = defineEmits(['blur'])