From a79bad5cdb896fd965e544df3ba8d0a87b3db458 Mon Sep 17 00:00:00 2001
From: lain <lain@soykaf.club>
Date: Fri, 19 Jun 2020 12:46:48 +0200
Subject: [PATCH 1/4] StatusContent: Better separate subject from status
 content.

---
 .../status_content/status_content.js          |  6 -----
 .../status_content/status_content.vue         | 22 +++++++++++--------
 2 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index c0a71e8f..cfee77a3 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -142,12 +142,6 @@ const StatusContent = {
         return html
       }
     },
-    contentHtml () {
-      if (!this.status.summary_html) {
-        return this.postBodyHtml
-      }
-      return this.status.summary_html + '<br />' + this.postBodyHtml
-    },
     ...mapGetters(['mergedConfig']),
     ...mapState({
       betterShadow: state => state.interface.browserSupport.cssFilter,
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index efc2485e..df980a71 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -31,7 +31,7 @@
       <div
         class="status-content media-body"
         @click.prevent="linkClicked"
-        v-html="contentHtml"
+        v-html="postBodyHtml"
       />
       <a
         v-if="showingLongSubject"
@@ -52,17 +52,17 @@
         href="#"
         @click.prevent="toggleShowMore"
       >{{ $t("general.show_more") }}</a>
+      <div
+        v-if="status.summary_html"
+        class="status-content media-body summary"
+        @click.prevent="linkClicked"
+        v-html="status.summary_html"
+      />
       <div
         v-if="!hideSubjectStatus"
         class="status-content media-body"
         @click.prevent="linkClicked"
-        v-html="contentHtml"
-      />
-      <div
-        v-else
-        class="status-content media-body"
-        @click.prevent="linkClicked"
-        v-html="status.summary_html"
+        v-html="postBodyHtml"
       />
       <a
         v-if="hideSubjectStatus"
@@ -181,6 +181,10 @@ $status-margin: 0.75em;
     line-height: 1.4em;
     white-space: pre-wrap;
 
+    &.summary {
+      font-weight: bold;
+    }
+
     blockquote {
       margin: 0.2em 0 0.2em 2em;
       font-style: italic;
@@ -226,7 +230,7 @@ $status-margin: 0.75em;
 
 .greentext {
   color: $fallback--cGreen;
-  color: var(--postGreentext, $fallback--cGreen);
+  color: var(--cGreen, $fallback--cGreen);
 }
 
 .timeline :not(.panel-disabled) > {

From 4da0a0c0bfcfaccd58def8d2170b952c1d15106a Mon Sep 17 00:00:00 2001
From: lain <lain@soykaf.club>
Date: Fri, 19 Jun 2020 12:49:42 +0200
Subject: [PATCH 2/4] StatusContent: Fix greentext.

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

diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index df980a71..431661eb 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -230,7 +230,7 @@ $status-margin: 0.75em;
 
 .greentext {
   color: $fallback--cGreen;
-  color: var(--cGreen, $fallback--cGreen);
+  color: var(--postGreentext, $fallback--cGreen);
 }
 
 .timeline :not(.panel-disabled) > {

From 44edb730c1e2298a00be0c1a139f80a1335ad7cf Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shp@cock.li>
Date: Fri, 26 Jun 2020 14:07:39 +0300
Subject: [PATCH 3/4] rip restyle subject, fix some issues with long subject

---
 .../status_content/status_content.js          |   2 +-
 .../status_content/status_content.vue         | 133 +++++++++++-------
 2 files changed, 83 insertions(+), 52 deletions(-)

diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index cfee77a3..66501b3e 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -44,7 +44,7 @@ const StatusContent = {
       return lengthScore > 20
     },
     longSubject () {
-      return this.status.summary.length > 900
+      return this.status.summary.length > 240
     },
     // When a status has a subject and is also tall, we should only have one show more/less button. If the default is to collapse statuses with subjects, we just treat it like a status with a subject; otherwise, we just treat it like a tall status.
     mightHideBecauseSubject () {
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index 431661eb..5698b4c0 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -3,16 +3,55 @@
   <div class="status-body">
     <slot name="header" />
     <div
-      v-if="longSubject"
+      v-if="status.summary_html"
+      class="summary-wrapper"
+      :class="{ 'tall-subject': (longSubject && !showingLongSubject) }"
+    >
+      <div
+        class="media-body summary"
+        @click.prevent="linkClicked"
+        v-html="status.summary_html"
+      />
+      <a
+        v-if="longSubject && showingLongSubject"
+        href="#"
+        class="tall-subject-hider"
+        @click.prevent="showingLongSubject=false"
+      >{{ $t("general.show_less") }}</a>
+      <a
+        v-else-if="longSubject"
+        class="tall-subject-hider"
+        :class="{ 'tall-subject-hider_focused': focused }"
+        href="#"
+        @click.prevent="showingLongSubject=true"
+      >
+        {{ $t("general.show_more") }}
+      </a>
+    </div>
+    <div
+      :class="{'tall-status': hideTallStatus}"
       class="status-content-wrapper"
-      :class="{ 'tall-status': !showingLongSubject }"
     >
       <a
-        v-if="!showingLongSubject"
+        v-if="hideTallStatus"
         class="tall-status-hider"
         :class="{ 'tall-status-hider_focused': focused }"
         href="#"
-        @click.prevent="showingLongSubject=true"
+        @click.prevent="toggleShowMore"
+      >
+        {{ $t("general.show_more") }}
+      </a>
+      <div
+        v-if="!hideSubjectStatus"
+        class="status-content media-body"
+        @click.prevent="linkClicked"
+        v-html="postBodyHtml"
+      />
+      <a
+        v-if="hideSubjectStatus"
+        href="#"
+        class="cw-status-hider"
+        @click.prevent="toggleShowMore"
       >
         {{ $t("general.show_more") }}
         <span
@@ -28,48 +67,6 @@
           class="icon-link"
         />
       </a>
-      <div
-        class="status-content media-body"
-        @click.prevent="linkClicked"
-        v-html="postBodyHtml"
-      />
-      <a
-        v-if="showingLongSubject"
-        href="#"
-        class="status-unhider"
-        @click.prevent="showingLongSubject=false"
-      >{{ $t("general.show_less") }}</a>
-    </div>
-    <div
-      v-else
-      :class="{'tall-status': hideTallStatus}"
-      class="status-content-wrapper"
-    >
-      <a
-        v-if="hideTallStatus"
-        class="tall-status-hider"
-        :class="{ 'tall-status-hider_focused': focused }"
-        href="#"
-        @click.prevent="toggleShowMore"
-      >{{ $t("general.show_more") }}</a>
-      <div
-        v-if="status.summary_html"
-        class="status-content media-body summary"
-        @click.prevent="linkClicked"
-        v-html="status.summary_html"
-      />
-      <div
-        v-if="!hideSubjectStatus"
-        class="status-content media-body"
-        @click.prevent="linkClicked"
-        v-html="postBodyHtml"
-      />
-      <a
-        v-if="hideSubjectStatus"
-        href="#"
-        class="cw-status-hider"
-        @click.prevent="toggleShowMore"
-      >{{ $t("general.show_more") }}</a>
       <a
         v-if="showingMore"
         href="#"
@@ -129,6 +126,12 @@ $status-margin: 0.75em;
   flex: 1;
   min-width: 0;
 
+  .status-content-wrapper {
+    display: flex;
+    flex-direction: column;
+    flex-wrap: nowrap;
+  }
+
   .tall-status {
     position: relative;
     height: 220px;
@@ -136,7 +139,7 @@ $status-margin: 0.75em;
     overflow-y: hidden;
     z-index: 1;
     .status-content {
-      height: 100%;
+      min-height: 0;
       mask: linear-gradient(to top, white, transparent) bottom/100% 70px no-repeat,
             linear-gradient(to top, white, white);
       /* Autoprefixed seem to ignore this one, and also syntax is different */
@@ -176,15 +179,43 @@ $status-margin: 0.75em;
     }
   }
 
+  .summary-wrapper {
+    margin-bottom: 0.5em;
+    border-style: solid;
+    border-width: 0 0 1px 0;
+    border-color: var(--border, $fallback--border);
+    flex-grow: 0;
+  }
+
+  .summary {
+    font-style: italic;
+    padding-bottom: 0.5em;
+  }
+
+  .tall-subject {
+    position: relative;
+    .summary {
+      max-height: 2em;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+  }
+
+  .tall-subject-hider {
+    display: inline-block;
+    word-break: break-all;
+    // position: absolute;
+    width: 100%;
+    text-align: center;
+    padding-bottom: 0.5em;
+  }
+
   .status-content {
     font-family: var(--postFont, sans-serif);
     line-height: 1.4em;
     white-space: pre-wrap;
 
-    &.summary {
-      font-weight: bold;
-    }
-
     blockquote {
       margin: 0.2em 0 0.2em 2em;
       font-style: italic;

From 8c3106c588f964a8e26c69784d5808ad1f72625c Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shp@cock.li>
Date: Fri, 26 Jun 2020 18:20:32 +0300
Subject: [PATCH 4/4] Change the show/hide strings about, remove subjected
 status toggle when 'collapse' option not used

---
 src/components/status_content/status_content.js  |  4 ++--
 src/components/status_content/status_content.vue | 10 ++++++----
 src/i18n/en.json                                 |  6 +++++-
 3 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index 66501b3e..09ea3a20 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -48,10 +48,10 @@ const StatusContent = {
     },
     // When a status has a subject and is also tall, we should only have one show more/less button. If the default is to collapse statuses with subjects, we just treat it like a status with a subject; otherwise, we just treat it like a tall status.
     mightHideBecauseSubject () {
-      return this.status.summary && (!this.tallStatus || this.localCollapseSubjectDefault)
+      return !!this.status.summary && this.localCollapseSubjectDefault
     },
     mightHideBecauseTall () {
-      return this.tallStatus && (!this.status.summary || !this.localCollapseSubjectDefault)
+      return this.tallStatus && !(this.status.summary && this.localCollapseSubjectDefault)
     },
     hideSubjectStatus () {
       return this.mightHideBecauseSubject && !this.expandingSubject
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index 5698b4c0..3460c2fa 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -17,7 +17,7 @@
         href="#"
         class="tall-subject-hider"
         @click.prevent="showingLongSubject=false"
-      >{{ $t("general.show_less") }}</a>
+      >{{ $t("status.hide_full_subject") }}</a>
       <a
         v-else-if="longSubject"
         class="tall-subject-hider"
@@ -25,7 +25,7 @@
         href="#"
         @click.prevent="showingLongSubject=true"
       >
-        {{ $t("general.show_more") }}
+        {{ $t("status.show_full_subject") }}
       </a>
     </div>
     <div
@@ -53,7 +53,7 @@
         class="cw-status-hider"
         @click.prevent="toggleShowMore"
       >
-        {{ $t("general.show_more") }}
+        {{ $t("status.show_content") }}
         <span
           v-if="hasImageAttachments"
           class="icon-picture"
@@ -72,7 +72,9 @@
         href="#"
         class="status-unhider"
         @click.prevent="toggleShowMore"
-      >{{ $t("general.show_less") }}</a>
+      >
+        {{ tallStatus ? $t("general.show_less") : $t("status.hide_content") }}
+      </a>
     </div>
 
     <div v-if="status.poll && status.poll.options">
diff --git a/src/i18n/en.json b/src/i18n/en.json
index eefe10e5..ede8c3d8 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -629,7 +629,11 @@
     "status_unavailable": "Status unavailable",
     "copy_link": "Copy link to status",
     "thread_muted": "Thread muted",
-    "thread_muted_and_words": ", has words:"
+    "thread_muted_and_words": ", has words:",
+    "show_full_subject": "Show full subject",
+    "hide_full_subject": "Hide full subject",
+    "show_content": "Show content",
+    "hide_content": "Hide content"
   },
   "user_card": {
     "approve": "Approve",