icons added

Signed-off-by: Benny Samir Hierl <bennysamir@posteo.de>

src/components/FormWishlistItem.vue

@@ -8,12 +8,16 @@
       :alt="item.title"
     />
     <div class="flex w-full flex-col justify-between space-y-2 p-2">
-      <h1 v-if="mode === 'create'" class="text-xl">
-        {{ t('components.form-wishlist-item.headline-new-item.text') }}
-      </h1>
-      <h1 v-else class="text-xl">
-        {{ t('components.form-wishlist-item.headline-change-item.text') }}
-      </h1>
+      <div class="mb-4 flex flex-row items-center space-x-2 text-xl">
+        <IconPlus v-if="mode === 'create'" class="h-6 w-6" />
+        <IconPencil v-else class="h-5 w-5" />
+        <h1 v-if="mode === 'create'">
+          {{ t('components.form-wishlist-item.headline-new-item.text') }}
+        </h1>
+        <h1 v-else>
+          {{ t('components.form-wishlist-item.headline-change-item.text') }}
+        </h1>
+      </div>
       <form @submit="onSubmit" class="w-full flex-col">
         <InputText
           name="title"
@@ -76,7 +80,7 @@ import {
   InputCheckbox,
   InputTextArea,
 } from '@/components'
-import { IconSave, IconDelete } from '@/components/icons'
+import { IconSave, IconDelete, IconPlus, IconPencil } from '@/components/icons'
 import { WishlistItem } from '@/types'
 import { PropType } from 'vue'
 

src/components/icons/IconPencil.vue

@@ -0,0 +1,7 @@
+<template>
+  <svg viewBox="0 0 24 24">
+    <path
+      d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83l3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"
+    ></path>
+  </svg>
+</template>

src/components/icons/IconPlus.vue

@@ -0,0 +1,5 @@
+<template>
+  <svg viewBox="0 0 24 24">
+    <path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path>
+  </svg>
+</template>

src/components/icons/index.ts

@@ -12,3 +12,5 @@ export { default as IconToggleOn } from './IconToggleOn.vue'
 export { default as IconToggleOff } from './IconToggleOff.vue'
 export { default as IconSave } from './IconSave.vue'
 export { default as IconDelete } from './IconDelete.vue'
+export { default as IconPlus } from './IconPlus.vue'
+export { default as IconPencil } from './IconPencil.vue'