proper disable

src/App.scss

@@ -402,6 +402,10 @@ nav {
     color: var(--text);
     font-size: 100%;
   }
+
+  &.disabled {
+    cursor: not-allowed;
+  }
 }
 
 .menu-item,

src/components/draft/draft.vue

@@ -27,8 +27,15 @@
         />
       </div>
       <div class="status-preview">
-        <p v-if="draft.status">{{ draft.status }}</p>
-        <p v-else class="faint">{{ $t('drafts.empty') }}</p>
+        <span class="status_content">
+          <p v-if="draft.spoilerText">
+            <i>
+              {{ draft.spoilerText }}:
+            </i>
+          </p>
+          <p v-if="draft.status">{{ draft.status }}</p>
+          <p v-else class="faint">{{ $t('drafts.empty') }}</p>
+        </span>
         <gallery
           v-if="draft.files?.length !== 0"
           class="attachments media-body"

src/components/menu_item.style.js

@@ -11,8 +11,9 @@ export default {
     'Avatar'
   ],
   states: {
-    hover: ':hover',
-    active: '.-active'
+    hover: ':hover:not(.disabled)',
+    active: '.-active',
+    disabled: '.disabled'
   },
   defaultRules: [
     {
@@ -85,6 +86,28 @@ export default {
         textColor: '--link',
         textAuto: 'no-preserve'
       }
+    },
+    {
+      component: 'Text',
+      parent: {
+        component: 'MenuItem',
+        state: ['disabled']
+      },
+      directives: {
+        textOpacity: 0.25,
+        textOpacityMode: 'blend'
+      }
+    },
+    {
+      component: 'Icon',
+      parent: {
+        component: 'MenuItem',
+        state: ['disabled']
+      },
+      directives: {
+        textOpacity: 0.25,
+        textOpacityMode: 'blend'
+      }
     }
   ]
 }

src/components/post_status_form/post_status_form.js

@@ -352,6 +352,12 @@ const PostStatusForm = {
         return this.$t('post_status.auto_save_nothing_new')
       }
     },
+    safeToSaveDraft () {
+      return this.newStatus.status ||
+        this.newStatus.spoilerText ||
+        this.newStatus.files?.length ||
+        this.newStatus.hasPoll
+    },
     ...mapGetters(['mergedConfig']),
     ...mapState({
       mobileLayout: state => state.interface.mobileLayout
@@ -747,9 +753,7 @@ const PostStatusForm = {
     saveDraft () {
       if (!this.disableDraft &&
           !this.saveInhibited) {
-        if (this.newStatus.status ||
-            this.newStatus.files?.length ||
-            this.newStatus.hasPoll) {
+        if (this.safeToSaveDraft) {
           return this.$store.dispatch('addOrSaveDraft', { draft: this.newStatus })
             .then(id => {
               if (this.newStatus.id !== id) {

src/components/post_status_form/post_status_form.vue

@@ -339,6 +339,8 @@
                   v-if="!disableDraft"
                   class="menu-item dropdown-item dropdown-item-icon"
                   role="menu"
+                  :disabled="!safeToSaveDraft"
+                  :class="{ disabled: !safeToSaveDraft }"
                   @click.prevent="saveDraft"
                   @click="close"
                 >