From cc184858cdc197984a8d6fce069a95ac2143835f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 27 Dec 2024 17:10:17 +0200
Subject: [PATCH] drafts list update

---
 src/components/draft/draft.vue   | 38 ++++++++++++++------------------
 src/components/drafts/drafts.vue |  4 ++++
 src/i18n/en.json                 |  1 +
 3 files changed, 21 insertions(+), 22 deletions(-)

diff --git a/src/components/draft/draft.vue b/src/components/draft/draft.vue
index d9d356121..d462045ed 100644
--- a/src/components/draft/draft.vue
+++ b/src/components/draft/draft.vue
@@ -1,21 +1,5 @@
 <template>
   <article class="Draft">
-    <div class="actions">
-      <button
-        class="btn button-default"
-        :class="{ toggled: editing }"
-        :aria-expanded="editing"
-        @click.prevent.stop="toggleEditing"
-      >
-        {{ $t('drafts.continue') }}
-      </button>
-      <button
-        class="btn button-default"
-        @click.prevent.stop="abandon"
-      >
-        {{ $t('drafts.abandon') }}
-      </button>
-    </div>
     <div
       v-if="!editing"
       class="status-content"
@@ -66,6 +50,22 @@
         {{ $t('drafts.abandon_confirm') }}
       </confirm-modal>
     </teleport>
+    <div class="actions">
+      <button
+        class="btn button-default"
+        :class="{ toggled: editing }"
+        :aria-expanded="editing"
+        @click.prevent.stop="toggleEditing"
+      >
+        {{ $t('drafts.continue') }}
+      </button>
+      <button
+        class="btn button-default"
+        @click.prevent.stop="abandon"
+      >
+        {{ $t('drafts.abandon') }}
+      </button>
+    </div>
   </article>
 </template>
 
@@ -73,13 +73,7 @@
 
 <style lang="scss">
 .Draft {
-  margin: 1em;
-
   .status-content {
-    border: 1px solid;
-    border-color: var(--faint);
-    border-radius: var(--inputRadius);
-    color: var(--text);
     padding: 0.5em;
     margin: 0.5em 0;
   }
diff --git a/src/components/drafts/drafts.vue b/src/components/drafts/drafts.vue
index e64a506e5..18d83d704 100644
--- a/src/components/drafts/drafts.vue
+++ b/src/components/drafts/drafts.vue
@@ -7,7 +7,11 @@
         </div>
       </div>
       <div class="panel-body">
+        <p v-if="drafts.length === 0">
+          {{ $t('drafts.no_drafts') }}
+        </p>
         <List
+          v-else
           :items="drafts"
         >
           <template #item="{ item: draft }">
diff --git a/src/i18n/en.json b/src/i18n/en.json
index b4e56bc11..a1bf32ef4 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -1513,6 +1513,7 @@
   },
   "drafts": {
     "drafts": "Drafts",
+    "no_drafts": "You have no drafts",
     "continue": "Continue composing",
     "abandon": "Abandon draft",
     "abandon_confirm_title": "Abandon confirmation",