From 5db8106c7835c4fcc5320cdfc41353c739f6d70c Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Sat, 18 May 2024 12:26:28 +0900
Subject: [PATCH 01/12] =?UTF-8?q?:bug:=20SimpleButton=20=E3=81=AE=20font-s?=
 =?UTF-8?q?ize=20=E3=81=AE=E5=B1=9E=E6=80=A7=E3=81=8C=E9=96=93=E9=81=95?=
 =?UTF-8?q?=E3=81=A3=E3=81=A6=E3=81=84=E3=81=9F=E3=81=AE=E3=81=A7=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/shared/SimpleButton.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/shared/SimpleButton.vue b/src/components/shared/SimpleButton.vue
index 49d5037a..02cba020 100644
--- a/src/components/shared/SimpleButton.vue
+++ b/src/components/shared/SimpleButton.vue
@@ -3,7 +3,7 @@ import { computed } from 'vue'
 
 interface Props {
   type?: 'plain' | 'danger' | 'success'
-  fontSize: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl'
+  fontSize: 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | '3xl'
   padding: 'sm' | 'md' | 'lg' | 'xl'
   disabled?: boolean
 }

From 0fb01313fadcb6e63c3ffc6e750a73d99f2f5db3 Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Sat, 18 May 2024 12:26:43 +0900
Subject: [PATCH 02/12] =?UTF-8?q?:art:=20Figma=20=E3=81=AE=E3=82=B9?=
 =?UTF-8?q?=E3=82=BF=E3=82=A4=E3=83=AB=E3=82=92=E9=81=A9=E7=94=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../newRequest/NewRequestFileForm.vue         |  2 +-
 src/components/newRequest/NewRequestTag.vue   | 12 ++-
 .../newRequest/NewRequestTargets.vue          | 23 +++---
 src/components/shared/MarkdownTextarea.vue    | 73 +++++++------------
 src/pages/NewRequestPage.vue                  | 24 +++---
 5 files changed, 56 insertions(+), 78 deletions(-)

diff --git a/src/components/newRequest/NewRequestFileForm.vue b/src/components/newRequest/NewRequestFileForm.vue
index 5123224d..16471c11 100644
--- a/src/components/newRequest/NewRequestFileForm.vue
+++ b/src/components/newRequest/NewRequestFileForm.vue
@@ -44,7 +44,7 @@ function removeFile(index: number) {
 </script>
 
 <template>
-  <div class="flex flex-col">
+  <div class="flex flex-col gap-3">
     <label>画像</label>
     <input ref="inputRef" multiple type="file" @change="handleFileChange" />
   </div>
diff --git a/src/components/newRequest/NewRequestTag.vue b/src/components/newRequest/NewRequestTag.vue
index d1f4c85f..a465624c 100644
--- a/src/components/newRequest/NewRequestTag.vue
+++ b/src/components/newRequest/NewRequestTag.vue
@@ -10,13 +10,11 @@ const emit = defineEmits<{ (e: 'input', value: Tag[]): void }>()
 </script>
 
 <template>
-  <div class="flex flex-col">
+  <div class="flex flex-col gap-3">
     <label>タグ</label>
-    <div class="flex">
-      <InputSelectTagWithCreation
-        class="w-2/3"
-        :model-value="props.tags"
-        @update:model-value="emit('input', $event)" />
-    </div>
+    <InputSelectTagWithCreation
+      class="w-full"
+      :model-value="props.tags"
+      @update:model-value="emit('input', $event)" />
   </div>
 </template>
diff --git a/src/components/newRequest/NewRequestTargets.vue b/src/components/newRequest/NewRequestTargets.vue
index 0d6aba9b..e5c6697a 100644
--- a/src/components/newRequest/NewRequestTargets.vue
+++ b/src/components/newRequest/NewRequestTargets.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { PlusCircleIcon, MinusCircleIcon } from '@heroicons/vue/24/solid'
+import { PlusIcon, TrashIcon } from '@heroicons/vue/24/outline'
 import { storeToRefs } from 'pinia'
 import { useToast } from 'vue-toastification'
 
@@ -61,35 +61,38 @@ function handleRemoveTarget(index: number) {
 </script>
 
 <template>
-  <div class="flex flex-col">
+  <div class="flex flex-col gap-3">
     <label>払い戻し対象者</label>
-    <ul>
+    <ul class="flex flex-col gap-2">
       <li
         v-for="(target, i) in targets"
         :key="target.target"
-        class="mb-2 flex w-2/3 items-center gap-4">
+        class="flex items-center gap-3">
         <InputSelectSingle
-          class="!w-1/3 flex-grow"
+          class="flex-grow"
           :model-value="target.target"
           :options="userOptions"
           placeholder="払い戻し対象者を選択"
           @update:model-value="handleEditTarget(i, $event)" />
         <div>
           <InputNumber
-            class="mr-1"
+            class="mr-2"
             :min="1"
             :model-value="target.amount"
             placeholder="金額"
             @update:model-value="handleEditTarget(i, $event)" />円
         </div>
         <button class="flex" @click="handleRemoveTarget(i)">
-          <MinusCircleIcon class="w-6" />
+          <TrashIcon class="w-6 text-rose-500" />
         </button>
       </li>
     </ul>
-    <div v-if="userOptions.length > targets.length" class="w-2/3 text-center">
-      <button @click="handleAddTarget">
-        <PlusCircleIcon class="w-8" />
+    <div v-if="userOptions.length > targets.length" class="ml-3">
+      <button
+        class="flex items-center p-2 border rounded text-base"
+        @click="handleAddTarget">
+        <PlusIcon class="w-5 mr-2" />
+        払い戻し対象者を追加
       </button>
     </div>
   </div>
diff --git a/src/components/shared/MarkdownTextarea.vue b/src/components/shared/MarkdownTextarea.vue
index 1d7e11ec..4cee104f 100644
--- a/src/components/shared/MarkdownTextarea.vue
+++ b/src/components/shared/MarkdownTextarea.vue
@@ -1,7 +1,5 @@
 <script lang="ts" setup>
-import { computed, ref } from 'vue'
-
-import InputSelectSingle from '/@/components/shared/InputSelectSingle.vue'
+import { ref } from 'vue'
 
 import InputTextarea from './InputTextarea.vue'
 import MarkdownIt from './MarkdownIt.vue'
@@ -20,27 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
   autoFocus: false
 })
 const emit = defineEmits<{ (e: 'update:modelValue', value: string): void }>()
-
 const currentTab = ref<TabType>('input')
-const selectedTemplate = ref('')
-
-const templateOptions = computed(() => {
-  return (
-    props.templates?.map(template => {
-      return {
-        key: template.name,
-        value: template.name
-      }
-    }) ?? []
-  )
-})
-
-function setTemplate(template: string) {
-  const foundTemplate = props.templates?.find(t => t.name === template)
-  if (foundTemplate !== undefined) {
-    emit('update:modelValue', foundTemplate.value)
-  }
-}
 
 function changeCurrentTab(tab: TabType) {
   currentTab.value = tab
@@ -49,31 +27,30 @@ function changeCurrentTab(tab: TabType) {
 
 <template>
   <div>
-    <div class="flex gap-2">
-      <button
-        :class="`w-20 rounded-t py-1 ${
-          currentTab === 'input' ? 'bg-gray-400 text-white' : 'bg-gray-200'
-        }`"
-        @click.prevent="changeCurrentTab('input')">
-        入力
-      </button>
-      <button
-        :class="`w-20 rounded-t py-1 ${
-          currentTab === 'preview' ? 'bg-gray-400 text-white' : 'bg-gray-200'
-        }`"
-        @click.prevent="changeCurrentTab('preview')">
-        プレビュー
-      </button>
-      <InputSelectSingle
-        v-if="props.templates !== undefined"
-        v-model="selectedTemplate"
-        class="m-1 ml-auto inline-block w-1/3"
-        :options="templateOptions"
-        placeholder="テンプレートを選択"
-        @option:selected="setTemplate(selectedTemplate)">
-      </InputSelectSingle>
+    <div class="h-10 bg-gray-200 border border-zinc-300 rounded-t">
+      <div class="h-8 mt-[7px] flex gap-2">
+        <button
+          :class="`w-18 ml-3 text-xs rounded-t border-zinc-300 ${
+            currentTab === 'input'
+              ? 'bg-white border-x border-t'
+              : 'bg-gray-200 border-b'
+          }`"
+          @click.prevent="changeCurrentTab('input')">
+          入力
+        </button>
+        <button
+          :class="`w-18 text-xs rounded-t border-zinc-300 ${
+            currentTab === 'preview'
+              ? 'bg-white border-x border-t'
+              : 'bg-gray-200 border-b'
+          }`"
+          @click.prevent="changeCurrentTab('preview')">
+          プレビュー
+        </button>
+      </div>
     </div>
-    <div>
+    <div
+      class="px-5 py-3 box-border border-x border-b border-zinc-300 rounded-b">
       <InputTextarea
         v-if="currentTab === 'input'"
         :auto-focus="autoFocus"
@@ -83,7 +60,7 @@ function changeCurrentTab(tab: TabType) {
         @update:model-value="emit('update:modelValue', $event)" />
       <MarkdownIt
         v-if="currentTab === 'preview'"
-        class="min-h-40 w-full overflow-y-scroll border border-gray-500 px-1"
+        class="min-h-40 w-full overflow-y-scroll"
         :text="modelValue" />
     </div>
   </div>
diff --git a/src/pages/NewRequestPage.vue b/src/pages/NewRequestPage.vue
index 30183077..783604b3 100644
--- a/src/pages/NewRequestPage.vue
+++ b/src/pages/NewRequestPage.vue
@@ -40,24 +40,24 @@ if (!isUserFetched.value) {
 </script>
 
 <template>
-  <div class="min-w-160 mx-auto flex w-2/3 flex-col px-12 pt-8">
+  <div class="min-w-147 mx-50 mt-8 mb-30 flex flex-col">
     <div class="pb-8">
-      <h1 class="text-center text-3xl">申請の新規作成</h1>
+      <h1 class="text-2xl">申請の新規作成</h1>
     </div>
-    <form class="flex flex-col gap-2">
-      <div class="flex flex-col">
+    <form class="flex flex-col gap-6">
+      <div class="flex flex-col gap-3">
         申請者
         <span class="text-xl">{{ me?.name }}</span>
       </div>
-      <div class="flex flex-col">
+      <div class="flex flex-col gap-3">
         <label>タイトル</label>
         <InputText
           v-model="request.title"
           auto-focus
-          class="h-8"
+          class=""
           placeholder="タイトルを入力" />
       </div>
-      <div class="flex flex-col">
+      <div class="flex flex-col gap-3">
         <label>詳細</label>
         <MarkdownTextarea
           v-model="request.content"
@@ -67,11 +67,11 @@ if (!isUserFetched.value) {
       <NewRequestTargets
         :targets="request.targets"
         @input="request.targets = $event" />
-      <div class="flex flex-col">
+      <div class="flex flex-col gap-3">
         <label>グループ</label>
         <InputSelectSingle
           v-model="request.group"
-          class="!w-2/3"
+          class="w-full"
           :options="groupOptions"
           placeholder="グループを選択" />
       </div>
@@ -79,12 +79,12 @@ if (!isUserFetched.value) {
       <NewRequestFileForm :files="files" @input="files = $event" />
       <div class="text-right">
         <SimpleButton
-          class="mb-4"
+          class="!px-5"
           :disabled="isSending"
-          font-size="xl"
+          font-size="base"
           padding="md"
           @click.stop="postRequest">
-          申請を作成する
+          申請を作成
         </SimpleButton>
       </div>
     </form>

From 10bf029e6214d06cd6ad7bc01d8e671db3925f4f Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Sat, 18 May 2024 13:22:30 +0900
Subject: [PATCH 03/12] =?UTF-8?q?:bug:=20SimpleButton=20=E3=81=A7=E5=A4=89?=
 =?UTF-8?q?=E6=9B=B4=E3=81=97=E3=81=9F=E5=88=86=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/requestDetail/NewComment.vue           | 2 +-
 src/components/requestDetail/ToTransactionButtons.vue | 4 ++--
 src/pages/TransactionDetailPage.vue                   | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/requestDetail/NewComment.vue b/src/components/requestDetail/NewComment.vue
index a96794f7..fa447a37 100644
--- a/src/components/requestDetail/NewComment.vue
+++ b/src/components/requestDetail/NewComment.vue
@@ -19,7 +19,7 @@ const { comment, isSending, submit } = useNewComment(request.value?.id ?? '')
       <SimpleButton
         class="ml-auto"
         :disabled="isSending"
-        font-size="md"
+        font-size="base"
         padding="sm"
         @click.prevent="submit">
         コメントする
diff --git a/src/components/requestDetail/ToTransactionButtons.vue b/src/components/requestDetail/ToTransactionButtons.vue
index 4e3325e0..a352c31c 100644
--- a/src/components/requestDetail/ToTransactionButtons.vue
+++ b/src/components/requestDetail/ToTransactionButtons.vue
@@ -22,13 +22,13 @@ const { isAdmin } = storeToRefs(userStore)
       v-if="isAdmin"
       class="w-full"
       :disabled="isSending"
-      font-size="md"
+      font-size="base"
       padding="sm"
       @click="request && postTransactionFromRequest(request)">
       この申請から入出金記録を作成する
     </SimpleButton>
     <RouterLink class="w-full" :to="`/transactions?requestID=${request?.id}`">
-      <SimpleButton class="w-full" font-size="md" padding="sm">
+      <SimpleButton class="w-full" font-size="base" padding="sm">
         この申請の入出金記録へ移動
       </SimpleButton>
     </RouterLink>
diff --git a/src/pages/TransactionDetailPage.vue b/src/pages/TransactionDetailPage.vue
index 61915ffb..46a1fc3b 100644
--- a/src/pages/TransactionDetailPage.vue
+++ b/src/pages/TransactionDetailPage.vue
@@ -71,7 +71,7 @@ if (!isGroupFetched.value) {
       @cancel="isEditMode = false"
       @finish-editing="finishEditing($event)" />
     <RouterLink class="w-fit" :to="`/requests/${transaction.request}`">
-      <SimpleButton font-size="md" padding="sm">
+      <SimpleButton font-size="base" padding="sm">
         紐づいている申請へ移動
       </SimpleButton>
     </RouterLink>

From 24c1fa09e1b29aab7c0c2bc2f883dd304d2c0ee2 Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Sat, 18 May 2024 13:23:51 +0900
Subject: [PATCH 04/12] =?UTF-8?q?:bug:=20=E5=B0=91=E3=81=97=E3=83=90?=
 =?UTF-8?q?=E3=82=B0=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/shared/MarkdownTextarea.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/shared/MarkdownTextarea.vue b/src/components/shared/MarkdownTextarea.vue
index 4cee104f..5ed62e96 100644
--- a/src/components/shared/MarkdownTextarea.vue
+++ b/src/components/shared/MarkdownTextarea.vue
@@ -53,10 +53,10 @@ function changeCurrentTab(tab: TabType) {
       class="px-5 py-3 box-border border-x border-b border-zinc-300 rounded-b">
       <InputTextarea
         v-if="currentTab === 'input'"
-        :auto-focus="autoFocus"
+        :auto-focus="props.autoFocus"
         class="min-h-40 w-full"
-        :model-value="modelValue"
-        :placeholder="placeholder"
+        :model-value="props.modelValue"
+        :placeholder="props.placeholder"
         @update:model-value="emit('update:modelValue', $event)" />
       <MarkdownIt
         v-if="currentTab === 'preview'"

From eb03043025e9d42b24eb45fb5d2715a8b00f6216 Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Sat, 18 May 2024 14:55:02 +0900
Subject: [PATCH 05/12] =?UTF-8?q?=E3=83=87=E3=82=B6=E3=82=A4=E3=83=B3?=
 =?UTF-8?q?=E3=81=AB=E8=BF=91=E3=81=84=E8=89=B2=E3=82=92=E5=8F=96=E3=81=A3?=
 =?UTF-8?q?=E3=81=9F=E3=81=91=E3=81=A9=E5=A4=89=E3=81=AA=E8=89=B2=E3=81=99?=
 =?UTF-8?q?=E3=81=8E=E3=81=9F=E3=81=8B=E3=82=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/newRequest/NewRequestTargets.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/newRequest/NewRequestTargets.vue b/src/components/newRequest/NewRequestTargets.vue
index e5c6697a..cf4734bc 100644
--- a/src/components/newRequest/NewRequestTargets.vue
+++ b/src/components/newRequest/NewRequestTargets.vue
@@ -83,7 +83,7 @@ function handleRemoveTarget(index: number) {
             @update:model-value="handleEditTarget(i, $event)" />円
         </div>
         <button class="flex" @click="handleRemoveTarget(i)">
-          <TrashIcon class="w-6 text-rose-500" />
+          <TrashIcon class="w-6 text-red-400" />
         </button>
       </li>
     </ul>

From 8291b73c0bb3ef06efc1ccc39bf6a7a356b4134f Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Sat, 18 May 2024 22:12:57 +0900
Subject: [PATCH 06/12] =?UTF-8?q?:fire:=20Markdown=20=E9=96=A2=E9=80=A3?=
 =?UTF-8?q?=E3=82=92=20revert?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/shared/MarkdownTextarea.vue | 79 +++++++++++++---------
 1 file changed, 47 insertions(+), 32 deletions(-)

diff --git a/src/components/shared/MarkdownTextarea.vue b/src/components/shared/MarkdownTextarea.vue
index 5ed62e96..ee52e9c7 100644
--- a/src/components/shared/MarkdownTextarea.vue
+++ b/src/components/shared/MarkdownTextarea.vue
@@ -1,25 +1,39 @@
 <script lang="ts" setup>
-import { ref } from 'vue'
-
+import { computed, ref } from 'vue'
+import InputSelectSingle from '/@/components/shared/InputSelectSingle.vue'
 import InputTextarea from './InputTextarea.vue'
 import MarkdownIt from './MarkdownIt.vue'
 
 type TabType = 'input' | 'preview'
-
 interface Props {
   placeholder?: string
   modelValue: string
   templates?: readonly { name: string; value: string }[]
   autoFocus?: boolean
 }
-
 const props = withDefaults(defineProps<Props>(), {
   placeholder: '',
   autoFocus: false
 })
 const emit = defineEmits<{ (e: 'update:modelValue', value: string): void }>()
 const currentTab = ref<TabType>('input')
-
+const selectedTemplate = ref('')
+const templateOptions = computed(() => {
+  return (
+    props.templates?.map(template => {
+      return {
+        key: template.name,
+        value: template.name
+      }
+    }) ?? []
+  )
+})
+function setTemplate(template: string) {
+  const foundTemplate = props.templates?.find(t => t.name === template)
+  if (foundTemplate !== undefined) {
+    emit('update:modelValue', foundTemplate.value)
+  }
+}
 function changeCurrentTab(tab: TabType) {
   currentTab.value = tab
 }
@@ -27,40 +41,41 @@ function changeCurrentTab(tab: TabType) {
 
 <template>
   <div>
-    <div class="h-10 bg-gray-200 border border-zinc-300 rounded-t">
-      <div class="h-8 mt-[7px] flex gap-2">
-        <button
-          :class="`w-18 ml-3 text-xs rounded-t border-zinc-300 ${
-            currentTab === 'input'
-              ? 'bg-white border-x border-t'
-              : 'bg-gray-200 border-b'
-          }`"
-          @click.prevent="changeCurrentTab('input')">
-          入力
-        </button>
-        <button
-          :class="`w-18 text-xs rounded-t border-zinc-300 ${
-            currentTab === 'preview'
-              ? 'bg-white border-x border-t'
-              : 'bg-gray-200 border-b'
-          }`"
-          @click.prevent="changeCurrentTab('preview')">
-          プレビュー
-        </button>
-      </div>
+    <div class="flex gap-2">
+      <button
+        :class="`w-20 rounded-t py-1 ${
+          currentTab === 'input' ? 'bg-gray-400 text-white' : 'bg-gray-200'
+        }`"
+        @click.prevent="changeCurrentTab('input')">
+        入力
+      </button>
+      <button
+        :class="`w-20 rounded-t py-1 ${
+          currentTab === 'preview' ? 'bg-gray-400 text-white' : 'bg-gray-200'
+        }`"
+        @click.prevent="changeCurrentTab('preview')">
+        プレビュー
+      </button>
+      <InputSelectSingle
+        v-if="props.templates !== undefined"
+        v-model="selectedTemplate"
+        class="m-1 ml-auto inline-block w-1/3"
+        :options="templateOptions"
+        placeholder="テンプレートを選択"
+        @option:selected="setTemplate(selectedTemplate)">
+      </InputSelectSingle>
     </div>
-    <div
-      class="px-5 py-3 box-border border-x border-b border-zinc-300 rounded-b">
+    <div>
       <InputTextarea
         v-if="currentTab === 'input'"
-        :auto-focus="props.autoFocus"
+        :auto-focus="autoFocus"
         class="min-h-40 w-full"
-        :model-value="props.modelValue"
-        :placeholder="props.placeholder"
+        :model-value="modelValue"
+        :placeholder="placeholder"
         @update:model-value="emit('update:modelValue', $event)" />
       <MarkdownIt
         v-if="currentTab === 'preview'"
-        class="min-h-40 w-full overflow-y-scroll"
+        class="min-h-40 w-full overflow-y-scroll border border-gray-500 px-1"
         :text="modelValue" />
     </div>
   </div>

From 538e98d630daa6148505055fe7db86e330e41cbe Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Sat, 18 May 2024 23:14:05 +0900
Subject: [PATCH 07/12] =?UTF-8?q?label=20input=20=E3=82=92=20id=20for=20?=
 =?UTF-8?q?=E3=81=A7=E9=96=A2=E9=80=A3=E4=BB=98=E3=81=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/newRequest/NewRequestFileForm.vue  |  9 +++++++--
 src/components/newRequest/NewRequestTag.vue       |  3 ++-
 src/components/shared/InputSelectMultiple.vue     |  2 ++
 src/components/shared/InputSelectSingle.vue       |  2 ++
 .../shared/InputSelectTagWithCreation.vue         |  2 ++
 src/components/shared/InputTextarea.vue           |  2 ++
 src/components/shared/MarkdownTextarea.vue        |  2 ++
 src/pages/NewRequestPage.vue                      | 15 ++++++++-------
 8 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/src/components/newRequest/NewRequestFileForm.vue b/src/components/newRequest/NewRequestFileForm.vue
index 16471c11..8ddadcf5 100644
--- a/src/components/newRequest/NewRequestFileForm.vue
+++ b/src/components/newRequest/NewRequestFileForm.vue
@@ -45,8 +45,13 @@ function removeFile(index: number) {
 
 <template>
   <div class="flex flex-col gap-3">
-    <label>画像</label>
-    <input ref="inputRef" multiple type="file" @change="handleFileChange" />
+    <label class="text-xl" for="image">画像</label>
+    <input
+      id="image"
+      ref="inputRef"
+      multiple
+      type="file"
+      @change="handleFileChange" />
   </div>
   <div>
     <div v-if="files.length === 0">画像プレビュー</div>
diff --git a/src/components/newRequest/NewRequestTag.vue b/src/components/newRequest/NewRequestTag.vue
index a465624c..c08c4e19 100644
--- a/src/components/newRequest/NewRequestTag.vue
+++ b/src/components/newRequest/NewRequestTag.vue
@@ -11,8 +11,9 @@ const emit = defineEmits<{ (e: 'input', value: Tag[]): void }>()
 
 <template>
   <div class="flex flex-col gap-3">
-    <label>タグ</label>
+    <label class="text-xl" for="tag">タグ</label>
     <InputSelectTagWithCreation
+      id="tag"
       class="w-full"
       :model-value="props.tags"
       @update:model-value="emit('input', $event)" />
diff --git a/src/components/shared/InputSelectMultiple.vue b/src/components/shared/InputSelectMultiple.vue
index 3c3ae66c..c6c70608 100644
--- a/src/components/shared/InputSelectMultiple.vue
+++ b/src/components/shared/InputSelectMultiple.vue
@@ -20,6 +20,7 @@ interface Props {
   isDropdownAbove?: boolean
   /* [optionsのkey, modelValueのkey] modelValueをselectedValuesに適用するときに使う*/
   uniqKeys?: [string, string]
+  id?: string
   /* デフォルト幅を設定するため */
   class?: string
 }
@@ -284,6 +285,7 @@ onUnmounted(() => {
           <button type="button" @click="removeValue(selectedValue)">×</button>
         </div>
         <input
+          :id="props.id"
           ref="inputRef"
           v-model="searchQuery"
           class="flex-grow bg-transparent pl-1 focus:outline-none"
diff --git a/src/components/shared/InputSelectSingle.vue b/src/components/shared/InputSelectSingle.vue
index 7e135674..8240f39c 100644
--- a/src/components/shared/InputSelectSingle.vue
+++ b/src/components/shared/InputSelectSingle.vue
@@ -17,6 +17,7 @@ interface Props {
   disabled?: boolean
   isDropdownAbove?: boolean
   uniqKeys?: [string, string]
+  id?: string
   class?: string
 }
 
@@ -191,6 +192,7 @@ onUnmounted(() => {
           {{ selectedValue.key }}
         </span>
         <input
+          :id="props.id"
           ref="inputRef"
           v-model="searchQuery"
           class="flex-grow bg-transparent focus:outline-none"
diff --git a/src/components/shared/InputSelectTagWithCreation.vue b/src/components/shared/InputSelectTagWithCreation.vue
index d3a35e53..66af62a4 100644
--- a/src/components/shared/InputSelectTagWithCreation.vue
+++ b/src/components/shared/InputSelectTagWithCreation.vue
@@ -9,6 +9,7 @@ import type { Tag } from '/@/features/tag/model'
 
 interface Props {
   modelValue: Tag[]
+  id?: string
 }
 const props = defineProps<Props>()
 const emit = defineEmits<{ (e: 'update:modelValue', value: Tag[]): void }>()
@@ -24,6 +25,7 @@ const value = computed({
 
 <template>
   <InputSelectMultiple
+    :id="props.id"
     v-model="value"
     :create-option="
       (tag: string) => ({ name: tag, id: '', created_at: '', updated_at: '' })
diff --git a/src/components/shared/InputTextarea.vue b/src/components/shared/InputTextarea.vue
index b583b824..7eaff5a2 100644
--- a/src/components/shared/InputTextarea.vue
+++ b/src/components/shared/InputTextarea.vue
@@ -6,6 +6,7 @@ interface Props {
   required?: boolean
   placeholder?: string
   autoFocus?: boolean
+  id?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -33,6 +34,7 @@ onMounted(() => {
 
 <template>
   <textarea
+    :id="props.id"
     ref="textareaRef"
     class="bg-background min-h-32 rounded border border-gray-300 px-1"
     :placeholder="props.placeholder"
diff --git a/src/components/shared/MarkdownTextarea.vue b/src/components/shared/MarkdownTextarea.vue
index ee52e9c7..d3320017 100644
--- a/src/components/shared/MarkdownTextarea.vue
+++ b/src/components/shared/MarkdownTextarea.vue
@@ -10,6 +10,7 @@ interface Props {
   modelValue: string
   templates?: readonly { name: string; value: string }[]
   autoFocus?: boolean
+  id?: string
 }
 const props = withDefaults(defineProps<Props>(), {
   placeholder: '',
@@ -68,6 +69,7 @@ function changeCurrentTab(tab: TabType) {
     <div>
       <InputTextarea
         v-if="currentTab === 'input'"
+        :id="props.id"
         :auto-focus="autoFocus"
         class="min-h-40 w-full"
         :model-value="modelValue"
diff --git a/src/pages/NewRequestPage.vue b/src/pages/NewRequestPage.vue
index 783604b3..cd4a0975 100644
--- a/src/pages/NewRequestPage.vue
+++ b/src/pages/NewRequestPage.vue
@@ -46,20 +46,21 @@ if (!isUserFetched.value) {
     </div>
     <form class="flex flex-col gap-6">
       <div class="flex flex-col gap-3">
-        申請者
-        <span class="text-xl">{{ me?.name }}</span>
+        <label class="text-xl">申請者</label>
+        <span>{{ me?.name }}</span>
       </div>
       <div class="flex flex-col gap-3">
-        <label>タイトル</label>
+        <label class="text-xl" for="title">タイトル</label>
         <InputText
+          id="title"
           v-model="request.title"
           auto-focus
-          class=""
           placeholder="タイトルを入力" />
       </div>
       <div class="flex flex-col gap-3">
-        <label>詳細</label>
+        <label class="text-xl" for="details">詳細</label>
         <MarkdownTextarea
+          id="details"
           v-model="request.content"
           placeholder=""
           :templates="requestTemplates" />
@@ -68,8 +69,9 @@ if (!isUserFetched.value) {
         :targets="request.targets"
         @input="request.targets = $event" />
       <div class="flex flex-col gap-3">
-        <label>グループ</label>
+        <label class="text-xl" for="group">グループ</label>
         <InputSelectSingle
+          id="group"
           v-model="request.group"
           class="w-full"
           :options="groupOptions"
@@ -79,7 +81,6 @@ if (!isUserFetched.value) {
       <NewRequestFileForm :files="files" @input="files = $event" />
       <div class="text-right">
         <SimpleButton
-          class="!px-5"
           :disabled="isSending"
           font-size="base"
           padding="md"

From ba7616cd13129dd66d10f08c179e6b0b36c97ef3 Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Sat, 18 May 2024 23:16:38 +0900
Subject: [PATCH 08/12] =?UTF-8?q?:art:=20=E6=9C=80=E5=BE=8C=E3=81=AE?=
 =?UTF-8?q?=EF=BC=91=E3=81=A4=E3=81=AF=E6=B6=88=E3=81=9B=E3=81=AA=E3=81=84?=
 =?UTF-8?q?=E3=82=88=E3=81=86=E3=81=AB=E3=81=99=E3=82=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/newRequest/NewRequestTargets.vue | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/components/newRequest/NewRequestTargets.vue b/src/components/newRequest/NewRequestTargets.vue
index cf4734bc..4fffcedd 100644
--- a/src/components/newRequest/NewRequestTargets.vue
+++ b/src/components/newRequest/NewRequestTargets.vue
@@ -1,7 +1,6 @@
 <script lang="ts" setup>
 import { PlusIcon, TrashIcon } from '@heroicons/vue/24/outline'
 import { storeToRefs } from 'pinia'
-import { useToast } from 'vue-toastification'
 
 import { useUserStore } from '/@/stores/user'
 
@@ -18,7 +17,6 @@ const props = defineProps<Props>()
 const emit = defineEmits<{ (e: 'input', value: RequestTarget[]): void }>()
 
 const userStore = useUserStore()
-const toast = useToast()
 const { userOptions } = storeToRefs(userStore)
 
 function handleEditTarget(index: number, value: unknown) {
@@ -49,10 +47,6 @@ function handleAddTarget() {
   emit('input', [...props.targets, { target: '', amount: 0 }])
 }
 function handleRemoveTarget(index: number) {
-  if (props.targets.length === 1) {
-    toast.warning('払い戻し対象者は1人以上必要です')
-    return
-  }
   emit(
     'input',
     props.targets.filter((_, i) => i !== index)
@@ -62,13 +56,14 @@ function handleRemoveTarget(index: number) {
 
 <template>
   <div class="flex flex-col gap-3">
-    <label>払い戻し対象者</label>
+    <label class="text-xl" for="target">払い戻し対象者</label>
     <ul class="flex flex-col gap-2">
       <li
         v-for="(target, i) in targets"
         :key="target.target"
         class="flex items-center gap-3">
         <InputSelectSingle
+          id="target"
           class="flex-grow"
           :model-value="target.target"
           :options="userOptions"
@@ -82,7 +77,10 @@ function handleRemoveTarget(index: number) {
             placeholder="金額"
             @update:model-value="handleEditTarget(i, $event)" />円
         </div>
-        <button class="flex" @click="handleRemoveTarget(i)">
+        <button
+          v-if="targets.length > 1"
+          class="flex"
+          @click="handleRemoveTarget(i)">
           <TrashIcon class="w-6 text-red-400" />
         </button>
       </li>

From 7ce391a247a7b1f95b4b16da2341fa8cb03a32ad Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Fri, 24 May 2024 23:27:23 +0900
Subject: [PATCH 09/12] =?UTF-8?q?:art:=20=E3=83=AA=E3=82=B9=E3=83=88?=
 =?UTF-8?q?=E3=81=AE=E9=83=A8=E5=88=86=E3=81=AE=20label=20input=20?=
 =?UTF-8?q?=E3=82=92=E6=9C=80=E5=BE=8C=E3=81=AE=E8=A1=8C=E3=81=AB=E7=B4=90?=
 =?UTF-8?q?=E3=81=A5=E3=81=91=E3=82=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/newRequest/NewRequestTargets.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/newRequest/NewRequestTargets.vue b/src/components/newRequest/NewRequestTargets.vue
index 4fffcedd..4791fcc1 100644
--- a/src/components/newRequest/NewRequestTargets.vue
+++ b/src/components/newRequest/NewRequestTargets.vue
@@ -63,7 +63,7 @@ function handleRemoveTarget(index: number) {
         :key="target.target"
         class="flex items-center gap-3">
         <InputSelectSingle
-          id="target"
+          :id="i === targets.length - 1 ? 'target' : undefined"
           class="flex-grow"
           :model-value="target.target"
           :options="userOptions"

From 22f3d063ab429e5a2685b6374dca856831626ff1 Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Fri, 24 May 2024 23:27:34 +0900
Subject: [PATCH 10/12] =?UTF-8?q?:art:=20=E3=82=B9=E3=82=BF=E3=82=A4?=
 =?UTF-8?q?=E3=83=AB=E3=81=AE=E8=AA=BF=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html                                       |  2 +-
 src/components/newRequest/NewRequestFileForm.vue |  8 +++++---
 src/components/newRequest/NewRequestTag.vue      |  4 ++--
 src/components/newRequest/NewRequestTargets.vue  |  4 ++--
 src/pages/NewRequestPage.vue                     | 16 ++++++++--------
 5 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/index.html b/index.html
index f469c8c9..eb5acc2d 100644
--- a/index.html
+++ b/index.html
@@ -14,7 +14,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
-      href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap"
+      href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap"
       rel="stylesheet" />
   </head>
   <body>
diff --git a/src/components/newRequest/NewRequestFileForm.vue b/src/components/newRequest/NewRequestFileForm.vue
index 8ddadcf5..11e81359 100644
--- a/src/components/newRequest/NewRequestFileForm.vue
+++ b/src/components/newRequest/NewRequestFileForm.vue
@@ -44,8 +44,8 @@ function removeFile(index: number) {
 </script>
 
 <template>
-  <div class="flex flex-col gap-3">
-    <label class="text-xl" for="image">画像</label>
+  <div class="flex flex-col gap-2">
+    <label class="text-sm font-medium" for="image">画像</label>
     <input
       id="image"
       ref="inputRef"
@@ -54,7 +54,9 @@ function removeFile(index: number) {
       @change="handleFileChange" />
   </div>
   <div>
-    <div v-if="files.length === 0">画像プレビュー</div>
+    <div v-if="files.length === 0" class="text-sm font-medium">
+      画像プレビュー
+    </div>
     <div v-if="files.length !== 0" class="flex flex-wrap">
       <div
         v-for="(file, index) in files"
diff --git a/src/components/newRequest/NewRequestTag.vue b/src/components/newRequest/NewRequestTag.vue
index c08c4e19..2dff8767 100644
--- a/src/components/newRequest/NewRequestTag.vue
+++ b/src/components/newRequest/NewRequestTag.vue
@@ -10,8 +10,8 @@ const emit = defineEmits<{ (e: 'input', value: Tag[]): void }>()
 </script>
 
 <template>
-  <div class="flex flex-col gap-3">
-    <label class="text-xl" for="tag">タグ</label>
+  <div class="flex flex-col gap-2">
+    <label class="text-sm font-medium" for="tag">タグ</label>
     <InputSelectTagWithCreation
       id="tag"
       class="w-full"
diff --git a/src/components/newRequest/NewRequestTargets.vue b/src/components/newRequest/NewRequestTargets.vue
index 4791fcc1..c3e7bc3b 100644
--- a/src/components/newRequest/NewRequestTargets.vue
+++ b/src/components/newRequest/NewRequestTargets.vue
@@ -55,8 +55,8 @@ function handleRemoveTarget(index: number) {
 </script>
 
 <template>
-  <div class="flex flex-col gap-3">
-    <label class="text-xl" for="target">払い戻し対象者</label>
+  <div class="flex flex-col gap-2">
+    <label class="text-sm font-medium" for="target">払い戻し対象者</label>
     <ul class="flex flex-col gap-2">
       <li
         v-for="(target, i) in targets"
diff --git a/src/pages/NewRequestPage.vue b/src/pages/NewRequestPage.vue
index cd4a0975..80423b0c 100644
--- a/src/pages/NewRequestPage.vue
+++ b/src/pages/NewRequestPage.vue
@@ -45,20 +45,20 @@ if (!isUserFetched.value) {
       <h1 class="text-2xl">申請の新規作成</h1>
     </div>
     <form class="flex flex-col gap-6">
-      <div class="flex flex-col gap-3">
-        <label class="text-xl">申請者</label>
+      <div class="flex flex-col gap-2">
+        <label class="text-sm font-medium">申請者</label>
         <span>{{ me?.name }}</span>
       </div>
-      <div class="flex flex-col gap-3">
-        <label class="text-xl" for="title">タイトル</label>
+      <div class="flex flex-col gap-2">
+        <label class="text-sm font-medium" for="title">タイトル</label>
         <InputText
           id="title"
           v-model="request.title"
           auto-focus
           placeholder="タイトルを入力" />
       </div>
-      <div class="flex flex-col gap-3">
-        <label class="text-xl" for="details">詳細</label>
+      <div class="flex flex-col gap-2">
+        <label class="text-sm font-medium" for="details">詳細</label>
         <MarkdownTextarea
           id="details"
           v-model="request.content"
@@ -68,8 +68,8 @@ if (!isUserFetched.value) {
       <NewRequestTargets
         :targets="request.targets"
         @input="request.targets = $event" />
-      <div class="flex flex-col gap-3">
-        <label class="text-xl" for="group">グループ</label>
+      <div class="flex flex-col gap-2">
+        <label class="text-sm font-medium" for="group">グループ</label>
         <InputSelectSingle
           id="group"
           v-model="request.group"

From c47c76ffaa7a64f95f220cdb7d0bfeca7e9c2cdb Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Mon, 15 Jul 2024 17:32:38 +0900
Subject: [PATCH 11/12] =?UTF-8?q?=F0=9F=8E=A8=20Icon=20=E3=81=AE=E3=83=9C?=
 =?UTF-8?q?=E3=82=BF=E3=83=B3=E3=81=AB=20aria-label=20=E3=82=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/newRequest/NewRequestFileForm.vue | 1 +
 src/components/newRequest/NewRequestTargets.vue  | 1 +
 2 files changed, 2 insertions(+)

diff --git a/src/components/newRequest/NewRequestFileForm.vue b/src/components/newRequest/NewRequestFileForm.vue
index 11e81359..e4eb0602 100644
--- a/src/components/newRequest/NewRequestFileForm.vue
+++ b/src/components/newRequest/NewRequestFileForm.vue
@@ -69,6 +69,7 @@ function removeFile(index: number) {
           :src="file.src" />
         <DocumentIcon v-else class="h-32" />
         <button
+          aria-label="ファイルを削除"
           class="absolute top-0 right-0 h-6 w-6"
           @click="removeFile(index)">
           <XCircleIcon />
diff --git a/src/components/newRequest/NewRequestTargets.vue b/src/components/newRequest/NewRequestTargets.vue
index c3e7bc3b..6e81fdc1 100644
--- a/src/components/newRequest/NewRequestTargets.vue
+++ b/src/components/newRequest/NewRequestTargets.vue
@@ -79,6 +79,7 @@ function handleRemoveTarget(index: number) {
         </div>
         <button
           v-if="targets.length > 1"
+          aria-label="ターゲットを削除"
           class="flex"
           @click="handleRemoveTarget(i)">
           <TrashIcon class="w-6 text-red-400" />

From abb140c4676426da0361c5c049a63d289881cf93 Mon Sep 17 00:00:00 2001
From: anko9801 <daiusa3@icloud.com>
Date: Mon, 22 Jul 2024 12:02:06 +0900
Subject: [PATCH 12/12] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20=E4=BF=AE=E6=AD=A3?=
 =?UTF-8?q?=E3=81=97=E3=81=9F=E6=B0=97=E3=81=AB=E3=81=AA=E3=81=A3=E3=81=A6?=
 =?UTF-8?q?=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/newRequest/NewRequestTargets.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/newRequest/NewRequestTargets.vue b/src/components/newRequest/NewRequestTargets.vue
index 6e81fdc1..210d68bc 100644
--- a/src/components/newRequest/NewRequestTargets.vue
+++ b/src/components/newRequest/NewRequestTargets.vue
@@ -63,7 +63,6 @@ function handleRemoveTarget(index: number) {
         :key="target.target"
         class="flex items-center gap-3">
         <InputSelectSingle
-          :id="i === targets.length - 1 ? 'target' : undefined"
           class="flex-grow"
           :model-value="target.target"
           :options="userOptions"
@@ -79,7 +78,7 @@ function handleRemoveTarget(index: number) {
         </div>
         <button
           v-if="targets.length > 1"
-          aria-label="ターゲットを削除"
+          aria-label="払い戻し対象者を削除"
           class="flex"
           @click="handleRemoveTarget(i)">
           <TrashIcon class="w-6 text-red-400" />