From 2869ab787d11010435fce6d4f86e5c8d07131e37 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 12:24:09 +0300
Subject: [PATCH 01/38] fix #1378

---
 src/components/emoji_picker/emoji_picker.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/emoji_picker/emoji_picker.js b/src/components/emoji_picker/emoji_picker.js
index 17a317a4d..f9b306fb4 100644
--- a/src/components/emoji_picker/emoji_picker.js
+++ b/src/components/emoji_picker/emoji_picker.js
@@ -143,10 +143,10 @@ const EmojiPicker = {
       const fontSize = css.getPropertyValue('font-size') || '14px'
       const emojiSize = css.getPropertyValue('--emojiSize') || '2.2rem'
 
-      const fontSizeUnit = fontSize.replace(/[0-9,.]+/, '')
+      const fontSizeUnit = fontSize.replace(/[0-9,.]+/, '').trim()
       const fontSizeValue = Number(fontSize.replace(/[^0-9,.]+/, ''))
 
-      const emojiSizeUnit = emojiSize.replace(/[0-9,.]+/, '')
+      const emojiSizeUnit = emojiSize.replace(/[0-9,.]+/, '').trim()
       const emojiSizeValue = Number(emojiSize.replace(/[^0-9,.]+/, ''))
 
       let fontSizeMultiplier

From a6c844e52221c3c9a1f001d0109213aa1f3077cb Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 12:31:12 +0300
Subject: [PATCH 02/38] make favs etc strip newlines so status is more visible

---
 src/components/notification/notification.vue     | 1 +
 src/components/status_body/status_body.js        | 4 ++++
 src/components/status_body/status_body.vue       | 2 +-
 src/components/status_content/status_content.vue | 1 +
 4 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 0930e0990..a531b35d3 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -247,6 +247,7 @@
           <StatusContent
             :compact="!statusExpanded"
             :status="notification.status"
+            :collapse="true"
           />
         </template>
       </div>
diff --git a/src/components/status_body/status_body.js b/src/components/status_body/status_body.js
index aa334499e..e89d1d173 100644
--- a/src/components/status_body/status_body.js
+++ b/src/components/status_body/status_body.js
@@ -22,6 +22,7 @@ const StatusContent = {
   name: 'StatusContent',
   props: [
     'compact',
+    'collapse', // replaces newlines with spaces
     'status',
     'focused',
     'noHeading',
@@ -95,6 +96,9 @@ const StatusContent = {
     attachmentTypes () {
       return this.status.attachments.map(file => fileType.fileType(file.mimetype))
     },
+    collapsedStatus () {
+      return this.status.raw_html.replace(/(\n|<br\s?\/?>)/g, ' ')
+    },
     ...mapGetters(['mergedConfig'])
   },
   components: {
diff --git a/src/components/status_body/status_body.vue b/src/components/status_body/status_body.vue
index 0fc024b04..1035d04c6 100644
--- a/src/components/status_body/status_body.vue
+++ b/src/components/status_body/status_body.vue
@@ -38,7 +38,7 @@
           v-if="!hideSubjectStatus && !(singleLine && status.summary_raw_html)"
           :class="{ '-single-line': singleLine }"
           class="text media-body"
-          :html="status.raw_html"
+          :html="collapse ? collapsedStatus : status.raw_html"
           :emoji="status.emojis"
           :handle-links="true"
           :faint="compact"
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index 64a1d6a53..6f5b1d613 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -14,6 +14,7 @@
       :toggle-showing-tall="toggleShowingTall"
       :toggle-expanding-subject="toggleExpandingSubject"
       :toggle-showing-long-subject="toggleShowingLongSubject"
+      :collapse="true"
       @parse-ready="$emit('parseReady', $event)"
     >
       <div v-if="status.poll && status.poll.options && !compact">

From 0b9b7a51a63756d85e4093b3f9cf579bc44c042f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 12:53:19 +0300
Subject: [PATCH 03/38] collapse notifications and also allow expand on click
 anywhere

---
 src/components/notification/notification.js      |  4 ++++
 src/components/notification/notification.scss    |  7 +++++++
 src/components/notification/notification.vue     | 12 ++++++++++--
 src/components/status_content/status_content.js  |  1 +
 src/components/status_content/status_content.vue |  2 +-
 5 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/src/components/notification/notification.js b/src/components/notification/notification.js
index 043be1b1a..247b73848 100644
--- a/src/components/notification/notification.js
+++ b/src/components/notification/notification.js
@@ -64,6 +64,7 @@ const Notification = {
   },
   methods: {
     toggleStatusExpanded () {
+      if (!this.expandable) return
       this.statusExpanded = !this.statusExpanded
     },
     generateUserProfileLink (user) {
@@ -136,6 +137,9 @@ const Notification = {
       const user = this.notification.from_profile
       return highlightStyle(highlight[user.screen_name])
     },
+    expandable () {
+      return (new Set(['like', '-pleroma:emoji_reaction', 'repeat'])).has(this.notification.type)
+    },
     user () {
       return this.$store.getters.findUser(this.notification.from_profile.id)
     },
diff --git a/src/components/notification/notification.scss b/src/components/notification/notification.scss
index e8895ce59..9c94d4090 100644
--- a/src/components/notification/notification.scss
+++ b/src/components/notification/notification.scss
@@ -1,10 +1,17 @@
 // TODO Copypaste from Status, should unify it somehow
+.NotificationParent {
+  &.-expandable {
+    cursor: pointer;
+  }
+}
+
 .Notification {
   border-bottom: 1px solid;
   border-color: var(--border);
   overflow-wrap: break-word;
   text-wrap: pretty;
 
+
   &.Status {
     /* stylelint-disable-next-line declaration-no-important */
     background-color: transparent !important;
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index a531b35d3..c9b557970 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -9,9 +9,17 @@
       @interacted="interacted"
     />
   </article>
-  <article v-else>
+  <article
+    class="NotificationParent"
+    :class="{ '-expandable': expandable }"
+    :aria-controls="'notif-' +notification.id"
+    @click="toggleStatusExpanded()"
+    v-else
+  >
     <div
       v-if="needMute && !unmuted"
+      :id="'notif-' +notification.id"
+      :aria-expanded="statusExpanded"
       class="Notification container -muted"
     >
       <small>
@@ -247,7 +255,7 @@
           <StatusContent
             :compact="!statusExpanded"
             :status="notification.status"
-            :collapse="true"
+            :collapse="statusExpanded"
           />
         </template>
       </div>
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index 3bf25c75b..f61ba0d05 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -53,6 +53,7 @@ const StatusContent = {
   props: [
     'status',
     'compact',
+    'collapse',
     'focused',
     'noHeading',
     'fullContent',
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index 6f5b1d613..fb08186b4 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -14,7 +14,7 @@
       :toggle-showing-tall="toggleShowingTall"
       :toggle-expanding-subject="toggleExpandingSubject"
       :toggle-showing-long-subject="toggleShowingLongSubject"
-      :collapse="true"
+      :collapse="collapse"
       @parse-ready="$emit('parseReady', $event)"
     >
       <div v-if="status.poll && status.poll.options && !compact">

From 6e479d246b755806319faf387cf43a8ec74fc905 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 12:59:51 +0300
Subject: [PATCH 04/38] visually combine subject and content into one input

---
 src/components/emoji_input/emoji_input.vue    |   2 +-
 .../post_status_form/post_status_form.scss    |   4 +
 .../post_status_form/post_status_form.vue     | 125 +++++++++---------
 3 files changed, 69 insertions(+), 62 deletions(-)

diff --git a/src/components/emoji_input/emoji_input.vue b/src/components/emoji_input/emoji_input.vue
index a1cba33bc..de5ac8755 100644
--- a/src/components/emoji_input/emoji_input.vue
+++ b/src/components/emoji_input/emoji_input.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     ref="root"
-    class="input emoji-input"
+    class="emoji-input"
     :class="{ 'with-picker': !hideEmojiButton }"
   >
     <slot
diff --git a/src/components/post_status_form/post_status_form.scss b/src/components/post_status_form/post_status_form.scss
index a79cae4a6..7c25002fb 100644
--- a/src/components/post_status_form/post_status_form.scss
+++ b/src/components/post_status_form/post_status_form.scss
@@ -216,6 +216,10 @@
     position: relative;
   }
 
+  .subject-input {
+    border-bottom: 1px solid var(--border);
+  }
+
   .character-counter {
     position: absolute;
     bottom: 0;
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 303413b55..bbff7d4b7 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -156,67 +156,69 @@
             class="preview-status"
           />
         </div>
-        <EmojiInput
-          v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
-          v-model="newStatus.spoilerText"
-          enable-emoji-picker
-          :suggest="emojiSuggestor"
-          class="input form-control"
-        >
-          <template #default="inputProps">
-            <input
-              v-model="newStatus.spoilerText"
-              type="text"
-              :placeholder="$t('post_status.content_warning')"
-              :disabled="posting && !optimisticPosting"
-              v-bind="propsToNative(inputProps)"
-              size="1"
-              class="input form-post-subject"
-            >
-          </template>
-        </EmojiInput>
-        <EmojiInput
-          ref="emoji-input"
-          v-model="newStatus.status"
-          :suggest="emojiUserSuggestor"
-          :placement="emojiPickerPlacement"
-          class="input form-control main-input"
-          enable-sticker-picker
-          enable-emoji-picker
-          hide-emoji-button
-          :newline-on-ctrl-enter="submitOnEnter"
-          @input="onEmojiInputInput"
-          @sticker-uploaded="addMediaFile"
-          @sticker-upload-failed="uploadFailed"
-          @shown="handleEmojiInputShow"
-        >
-          <template #default="inputProps">
-            <textarea
-              ref="textarea"
-              v-model="newStatus.status"
-              :placeholder="placeholder || $t('post_status.default')"
-              rows="1"
-              cols="1"
-              :disabled="posting && !optimisticPosting"
-              class="input form-post-body"
-              :class="{ 'scrollable-form': !!maxHeight }"
-              v-bind="propsToNative(inputProps)"
-              @keydown.exact.enter="submitOnEnter && postStatus($event, newStatus)"
-              @keydown.meta.enter="postStatus($event, newStatus)"
-              @keydown.ctrl.enter="!submitOnEnter && postStatus($event, newStatus)"
-              @input="resize"
-              @compositionupdate="resize"
-              @paste="paste"
-            />
-            <p
-              v-if="hasStatusLengthLimit"
-              class="character-counter faint"
-              :class="{ error: isOverLengthLimit }"
-            >
-              {{ charactersLeft }}
-            </p>
-          </template>
-        </EmojiInput>
+        <div class="input">
+          <EmojiInput
+            v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
+            v-model="newStatus.spoilerText"
+            enable-emoji-picker
+            :suggest="emojiSuggestor"
+            class="input form-control subject-input unstyled"
+          >
+            <template #default="inputProps">
+              <input
+                v-model="newStatus.spoilerText"
+                type="text"
+                :placeholder="$t('post_status.content_warning')"
+                :disabled="posting && !optimisticPosting"
+                v-bind="propsToNative(inputProps)"
+                size="1"
+                class="input form-post-subject"
+              >
+            </template>
+          </EmojiInput>
+          <EmojiInput
+            ref="emoji-input"
+            v-model="newStatus.status"
+            :suggest="emojiUserSuggestor"
+            :placement="emojiPickerPlacement"
+            class="input form-control main-input unstyled"
+            enable-sticker-picker
+            enable-emoji-picker
+            hide-emoji-button
+            :newline-on-ctrl-enter="submitOnEnter"
+            @input="onEmojiInputInput"
+            @sticker-uploaded="addMediaFile"
+            @sticker-upload-failed="uploadFailed"
+            @shown="handleEmojiInputShow"
+          >
+            <template #default="inputProps">
+              <textarea
+                ref="textarea"
+                v-model="newStatus.status"
+                :placeholder="placeholder || $t('post_status.default')"
+                rows="1"
+                cols="1"
+                :disabled="posting && !optimisticPosting"
+                class="input form-post-body"
+                :class="{ 'scrollable-form': !!maxHeight }"
+                v-bind="propsToNative(inputProps)"
+                @keydown.exact.enter="submitOnEnter && postStatus($event, newStatus)"
+                @keydown.meta.enter="postStatus($event, newStatus)"
+                @keydown.ctrl.enter="!submitOnEnter && postStatus($event, newStatus)"
+                @input="resize"
+                @compositionupdate="resize"
+                @paste="paste"
+              />
+              <p
+                v-if="hasStatusLengthLimit"
+                class="character-counter faint"
+                :class="{ error: isOverLengthLimit }"
+              >
+                {{ charactersLeft }}
+              </p>
+            </template>
+          </EmojiInput>
+        </div>
         <div
           v-if="!disableScopeSelector"
           class="visibility-tray"
@@ -238,6 +240,7 @@
               v-model="newStatus.contentType"
               class="input form-control"
               :attrs="{ 'aria-label': $t('post_status.content_type_selection') }"
+              unstyled="true"
             >
               <option
                 v-for="postFormat in postFormats"

From f35633c855ff86f3e2ceeef99fd682bff6408a21 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 13:07:03 +0300
Subject: [PATCH 05/38] remove redundand emoji button

---
 src/components/post_status_form/post_status_form.js   | 4 ----
 src/components/post_status_form/post_status_form.scss | 7 +++----
 src/components/post_status_form/post_status_form.vue  | 8 --------
 3 files changed, 3 insertions(+), 16 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index 4fb8e0428..238be88df 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -726,10 +726,6 @@ const PostStatusForm = {
         scrollerRef.scrollTop = targetScroll
       }
     },
-    showEmojiPicker () {
-      this.$refs.textarea.focus()
-      this.$refs['emoji-input'].triggerShowPicker()
-    },
     clearError () {
       this.error = null
     },
diff --git a/src/components/post_status_form/post_status_form.scss b/src/components/post_status_form/post_status_form.scss
index 7c25002fb..0befba9c3 100644
--- a/src/components/post_status_form/post_status_form.scss
+++ b/src/components/post_status_form/post_status_form.scss
@@ -41,9 +41,8 @@
 
   .form-bottom-left {
     display: flex;
-    flex: 1;
-    padding-right: 7px;
-    margin-right: 7px;
+    padding-right: 0.5em;
+    margin-right: 0.5em;
     max-width: 10em;
   }
 
@@ -102,7 +101,7 @@
   .visibility-tray {
     display: flex;
     justify-content: space-between;
-    padding-top: 5px;
+    padding-top: 0.5em;
     align-items: baseline;
   }
 
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index bbff7d4b7..ec8bbd224 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -184,7 +184,6 @@
             class="input form-control main-input unstyled"
             enable-sticker-picker
             enable-emoji-picker
-            hide-emoji-button
             :newline-on-ctrl-enter="submitOnEnter"
             @input="onEmojiInputInput"
             @sticker-uploaded="addMediaFile"
@@ -288,13 +287,6 @@
             @upload-failed="uploadFailed"
             @all-uploaded="finishedUploadingFiles"
           />
-          <button
-            class="emoji-icon button-unstyled"
-            :title="$t('emoji.add_emoji')"
-            @click="showEmojiPicker"
-          >
-            <FAIcon icon="smile-beam" />
-          </button>
           <button
             v-if="pollsAvailable"
             class="poll-icon button-unstyled"

From aa5688a43bae6fe3239afd96ac290e52dfd456c5 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 13:08:03 +0300
Subject: [PATCH 06/38] unstyle the content type selector

---
 src/components/post_status_form/post_status_form.scss | 9 ++++++---
 src/components/post_status_form/post_status_form.vue  | 4 ++--
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.scss b/src/components/post_status_form/post_status_form.scss
index 0befba9c3..ac223edb1 100644
--- a/src/components/post_status_form/post_status_form.scss
+++ b/src/components/post_status_form/post_status_form.scss
@@ -41,9 +41,12 @@
 
   .form-bottom-left {
     display: flex;
-    padding-right: 0.5em;
-    margin-right: 0.5em;
-    max-width: 10em;
+    gap: 1.5em;
+
+    button {
+      padding: 0.5em;
+      margin: -0.5em;
+    }
   }
 
   .preview-heading {
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index ec8bbd224..37371f1de 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -172,7 +172,7 @@
                 :disabled="posting && !optimisticPosting"
                 v-bind="propsToNative(inputProps)"
                 size="1"
-                class="input form-post-subject"
+                class="input form-post-subject unstyled"
               >
             </template>
           </EmojiInput>
@@ -237,7 +237,7 @@
           >
             <Select
               v-model="newStatus.contentType"
-              class="input form-control"
+              class="input form-control unstyled"
               :attrs="{ 'aria-label': $t('post_status.content_type_selection') }"
               unstyled="true"
             >

From 5bb04243973ef3ee62d7a37f3b74b96625566d1f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 16:17:26 +0300
Subject: [PATCH 07/38] improve visibilty of user profile text

---
 src/components/user_card/user_card.scss | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index 4fdc73777..c0d079575 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -272,6 +272,11 @@
     // big one
     z-index: 1;
     line-height: 2em;
+    text-shadow:
+      0 0 5em var(--profileTint),
+      0 0 1em var(--profileTint),
+      0 0 0.5em var(--profileTint),
+      0 0 0.2em var(--profileTint);
 
     --emoji-size: 1.7em;
 

From 97adff267f087d4bec0fa4650f0f12ab3f3f73ad Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 16:45:24 +0300
Subject: [PATCH 08/38] delay splash screen, only show if loading takes too
 long

---
 index.html               | 2 +-
 public/static/splash.css | 7 +++++++
 src/App.scss             | 7 +------
 src/main.js              | 1 +
 4 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/index.html b/index.html
index fb92252c5..26eeee19b 100644
--- a/index.html
+++ b/index.html
@@ -16,7 +16,7 @@
   </head>
   <body>
     <noscript>To use Pleroma, please enable JavaScript.</noscript>
-    <div id="splash">
+    <div id="splash" class="initial-hidden">
       <!-- we are hiding entire graphic so no point showing credit -->
       <div aria-hidden="true" id="splash-credit">
         Art by pipivovott
diff --git a/public/static/splash.css b/public/static/splash.css
index abdc19fc2..c6f6832b9 100644
--- a/public/static/splash.css
+++ b/public/static/splash.css
@@ -21,6 +21,13 @@ body {
   position: absolute;
   z-index: 9999;
   font-size: calc(1vw + 1vh + 1vmin);
+  opacity: 1;
+  transition: opacity 500ms ease-out 0.5s;
+}
+
+#splash.hidden,
+#splash.initial-hidden {
+  opacity: 0;
 }
 
 #splash-credit {
diff --git a/src/App.scss b/src/App.scss
index 51f2c9af3..78a3494c7 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -929,12 +929,7 @@ option {
 
 #splash {
   pointer-events: none;
-  transition: opacity 0.5s;
-  opacity: 1;
-
-  &.hidden {
-    opacity: 0;
-  }
+  // transition: opacity 0.5s;
 
   #status {
     &.css-ok {
diff --git a/src/main.js b/src/main.js
index 4654679b8..1cd1afe6c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -80,6 +80,7 @@ const persistedStateOptions = {
       console.error('Storage error', e)
       storageError = e
     }
+    document.querySelector('#splash').classList.remove('initial-hidden')
     document.querySelector('#mascot').src = `/static/pleromatan_apology${isFox}_small.webp`
     document.querySelector('#status').removeAttribute('class')
     document.querySelector('#status').textContent = i18n.global.t('splash.loading')

From e076403fcb0689f68a37d247e030f2b11e8fe031 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 16:48:47 +0300
Subject: [PATCH 09/38] em

---
 public/static/splash.css | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/public/static/splash.css b/public/static/splash.css
index c6f6832b9..f56f33d07 100644
--- a/public/static/splash.css
+++ b/public/static/splash.css
@@ -5,15 +5,14 @@ body {
 
 #splash {
   --scale: 1;
+
   width: 100vw;
   height: 100vh;
   display: grid;
   grid-template-rows: auto;
   grid-template-columns: auto;
   align-content: center;
-  align-items: center;
-  justify-content: center;
-  justify-items: center;
+  place-items: center;
   flex-direction: column;
   background: #0f161e;
   font-family: sans-serif;
@@ -22,7 +21,7 @@ body {
   z-index: 9999;
   font-size: calc(1vw + 1vh + 1vmin);
   opacity: 1;
-  transition: opacity 500ms ease-out 0.5s;
+  transition: opacity 500ms ease-out 2s;
 }
 
 #splash.hidden,
@@ -32,9 +31,9 @@ body {
 
 #splash-credit {
   position: absolute;
-  font-size: 14px;
-  bottom: 16px;
-  right: 16px;
+  font-size: 1em;
+  bottom: 1em;
+  right: 1em;
 }
 
 #splash-container {

From bfb9f6c5e2f7f1f44e3edff12f1d99a1867a54b9 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 16:50:00 +0300
Subject: [PATCH 10/38] scale avatars

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

diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index c0336d407..d9e96d52d 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -41,7 +41,7 @@
   display: inline-block;
   position: relative;
   width: 3.5em;
-  height: 48px;
+  height: 3.5em;
 
   &.-compact {
     width: 2.2em;

From 6399de114c305190a925a9735ddc49be47fe6ac3 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 16:56:59 +0300
Subject: [PATCH 11/38] fix right icons alignment

---
 src/components/status/status.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index 93253b1a7..020f4f277 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -116,6 +116,7 @@
   .heading-right {
     display: flex;
     flex-shrink: 0;
+    align-self: baseline;
 
     .button-unstyled {
       padding: 5px;

From 4c17458e58ac7c60d11294590c314503ccc13e5c Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 17:08:52 +0300
Subject: [PATCH 12/38] fix favicons

---
 src/components/status/status.scss | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index 020f4f277..0f325ea7f 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -76,9 +76,10 @@
   }
 
   .status-favicon {
-    height: 18px;
-    width: 18px;
+    height: 1.2em;
+    width: 1.2em;
     margin-right: 0.4em;
+    object-fit: contain;
   }
 
   .status-heading {
@@ -100,7 +101,8 @@
   }
 
   .account-name {
-    min-width: 1.6em;
+    display: inline-block;
+    min-width: 1em;
     margin-right: 0.4em;
     white-space: nowrap;
     overflow: hidden;
@@ -119,8 +121,8 @@
     align-self: baseline;
 
     .button-unstyled {
-      padding: 5px;
-      margin: -5px;
+      padding: 0.2em;
+      margin: -0.2em;
     }
 
     .svg-inline--fa {

From 49a98a6fe2ee1b48a8d29ae463d10fbc9a7feb9f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 17:27:13 +0300
Subject: [PATCH 13/38] bunch of px -> em, small fixes

---
 src/App.scss                                  | 16 +++++------
 src/components/attachment/attachment.scss     |  6 ++--
 src/components/gallery/gallery.vue            |  2 +-
 src/components/media_modal/media_modal.vue    |  2 +-
 src/components/mention_link/mention_link.scss |  1 -
 .../mrf_transparency_panel.scss               |  8 +++---
 .../helpers/emoji_editing_popover.vue         |  4 +--
 .../settings_modal/tabs/security_tab/mfa.vue  | 12 ++++++--
 .../tabs/theme_tab/theme_preview.vue          | 28 ++++++++++---------
 .../tabs/theme_tab/theme_tab.scss             |  4 +--
 src/components/shout_panel/shout_panel.vue    |  4 +--
 src/components/tab_switcher/tab_switcher.scss |  4 +--
 .../user_reporting_modal.vue                  | 10 +++++--
 src/hocs/with_load_more/with_load_more.scss   |  2 +-
 .../with_subscription/with_subscription.scss  |  2 +-
 15 files changed, 58 insertions(+), 47 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index 78a3494c7..be6929f69 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -741,17 +741,17 @@ option {
   }
 
   &.-dot {
-    min-height: 8px;
-    max-height: 8px;
-    min-width: 8px;
-    max-width: 8px;
+    min-height: 0.6em;
+    max-height: 0.6em;
+    min-width: 0.6em;
+    max-width: 0.6em;
     padding: 0;
     line-height: 0;
     font-size: 0;
-    left: calc(50% - 4px);
-    top: calc(50% - 4px);
-    margin-left: 6px;
-    margin-top: -6px;
+    left: calc(50% - 0.6em);
+    top: calc(50% - 0.6em);
+    margin-left: 0.4em;
+    margin-top: -0.4em;
   }
 
   &.-counter {
diff --git a/src/components/attachment/attachment.scss b/src/components/attachment/attachment.scss
index 16346c97c..97515eb32 100644
--- a/src/components/attachment/attachment.scss
+++ b/src/components/attachment/attachment.scss
@@ -107,9 +107,9 @@
 
   .play-icon {
     position: absolute;
-    font-size: 64px;
-    top: calc(50% - 32px);
-    left: calc(50% - 32px);
+    font-size: 4.5em;
+    top: calc(50% - 2.25rem);
+    left: calc(50% - 2.25rem);
     color: rgb(255 255 255 / 75%);
     text-shadow: 0 0 2px rgb(0 0 0 / 40%);
 
diff --git a/src/components/gallery/gallery.vue b/src/components/gallery/gallery.vue
index 7209e9144..eb1054df6 100644
--- a/src/components/gallery/gallery.vue
+++ b/src/components/gallery/gallery.vue
@@ -129,7 +129,7 @@
 
         .gallery-item {
           margin: 0;
-          height: 200px;
+          height: 15em;
         }
       }
     }
diff --git a/src/components/media_modal/media_modal.vue b/src/components/media_modal/media_modal.vue
index 5cc8c50a3..7f625755c 100644
--- a/src/components/media_modal/media_modal.vue
+++ b/src/components/media_modal/media_modal.vue
@@ -168,7 +168,7 @@ $modal-view-button-icon-margin: 0.5em;
     flex: 0 0 auto;
     overflow-y: auto;
     min-height: 1em;
-    max-width: 500px;
+    max-width: 35.8em;
     max-height: 9.5em;
     overflow-wrap: break-word;
     text-wrap: pretty;
diff --git a/src/components/mention_link/mention_link.scss b/src/components/mention_link/mention_link.scss
index c3261e17d..3aa7816be 100644
--- a/src/components/mention_link/mention_link.scss
+++ b/src/components/mention_link/mention_link.scss
@@ -7,7 +7,6 @@
   & .new,
   & .original {
     display: inline;
-    border-radius: 2px;
   }
 
   .mention-avatar {
diff --git a/src/components/mrf_transparency_panel/mrf_transparency_panel.scss b/src/components/mrf_transparency_panel/mrf_transparency_panel.scss
index a262ed1c5..8e2fa553a 100644
--- a/src/components/mrf_transparency_panel/mrf_transparency_panel.scss
+++ b/src/components/mrf_transparency_panel/mrf_transparency_panel.scss
@@ -4,13 +4,13 @@
   table {
     width: 100%;
     text-align: left;
-    padding-left: 10px;
-    padding-bottom: 20px;
+    padding-left: 0.5em;
+    padding-bottom: 1.1em;
 
     th,
     td {
-      width: 180px;
-      max-width: 360px;
+      width: 11em;
+      max-width: 25em;
       overflow: hidden;
       vertical-align: text-top;
     }
diff --git a/src/components/settings_modal/helpers/emoji_editing_popover.vue b/src/components/settings_modal/helpers/emoji_editing_popover.vue
index 1cca45fbf..33c52da4d 100644
--- a/src/components/settings_modal/helpers/emoji_editing_popover.vue
+++ b/src/components/settings_modal/helpers/emoji_editing_popover.vue
@@ -229,8 +229,8 @@ export default {
     padding-bottom: 0.5em;
 
     .emoji {
-      width: 32px;
-      height: 32px;
+      width: 2.3em;
+      height: 2.3em;
     }
   }
 </style>
diff --git a/src/components/settings_modal/tabs/security_tab/mfa.vue b/src/components/settings_modal/tabs/security_tab/mfa.vue
index 9421b16ee..7e825062f 100644
--- a/src/components/settings_modal/tabs/security_tab/mfa.vue
+++ b/src/components/settings_modal/tabs/security_tab/mfa.vue
@@ -159,10 +159,16 @@
 
     .qr-code {
       flex: 1;
-      padding-right: 10px;
+      padding-right: 0.7em;
+    }
+
+    .verify {
+      flex: 1;
+    }
+
+    .error {
+      margin: 0.3em 0 0;
     }
-    .verify { flex: 1; }
-    .error { margin: 4px 0 0; }
 
     .confirm-otp-actions {
       button {
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_preview.vue b/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
index e8ac0d8a3..016d84c49 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
@@ -21,7 +21,7 @@
       </div>
       <div class="panel-body theme-preview-content">
         <div class="post">
-          <div class="avatar still-image">
+          <div class="avatar still-image" aria-hidden="true">
             ( ͡° ͜ʖ ͡°)
           </div>
           <div class="content">
@@ -71,7 +71,7 @@
         </div>
 
         <div class="after-post">
-          <div class="avatar-alt">
+          <div class="avatar-alt" aria-hidden="true">
             :^)
           </div>
           <div class="content">
@@ -149,7 +149,7 @@ export default {
   background-position: 50% 50%;
 
   .theme-preview-content {
-    padding: 20px;
+    padding: 1.5em;
   }
 
   .dummy {
@@ -203,19 +203,21 @@ export default {
 
     .avatar-alt {
       flex: 0 auto;
-      margin-left: 28px;
-      font-size: 12px;
-      min-width: 20px;
-      min-height: 20px;
-      line-height: 20px;
+      margin-left: 2em;
+      font-size: 0.85em;
+      min-width: 2.2rem;
+      min-height: 2.2rem;
+      line-height: 1.5em;
+      align-content: center;
     }
 
     .avatar {
       flex: 0 auto;
-      width: 48px;
-      height: 48px;
-      font-size: 14px;
-      line-height: 48px;
+      width: 3.5em;
+      height: 3.5em;
+      font-size: 1rem;
+      line-height: 3.5em;
+      justify-content: center;
     }
 
     .actions {
@@ -241,7 +243,7 @@ export default {
 
   .underlay-preview {
     position: absolute;
-    inset: 0 10px;
+    inset: 0 0.9em;
   }
 }
  </style>
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.scss b/src/components/settings_modal/tabs/theme_tab/theme_tab.scss
index d83beffa0..ae2364dcc 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.scss
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.scss
@@ -107,7 +107,7 @@
     justify-content: space-between;
     align-items: baseline;
     width: 100%;
-    min-height: 30px;
+    min-height: 2.1em;
     margin-bottom: 1em;
 
     p {
@@ -212,7 +212,7 @@
   .theme-color-cl,
   .theme-radius-in,
   .theme-color-in {
-    margin-left: 4px;
+    margin-left: 0.3em;
   }
 
   .theme-radius-in {
diff --git a/src/components/shout_panel/shout_panel.vue b/src/components/shout_panel/shout_panel.vue
index 1b2b591c2..184fe81e0 100644
--- a/src/components/shout_panel/shout_panel.vue
+++ b/src/components/shout_panel/shout_panel.vue
@@ -122,8 +122,8 @@
 
   .shout-avatar {
     img {
-      height: 24px;
-      width: 24px;
+      height: 0.6em;
+      width: 0.6em;
       border-radius: var(--roundness);
       margin-right: 0.5em;
       margin-top: 0.25em;
diff --git a/src/components/tab_switcher/tab_switcher.scss b/src/components/tab_switcher/tab_switcher.scss
index 60413c5f4..b7274d86d 100644
--- a/src/components/tab_switcher/tab_switcher.scss
+++ b/src/components/tab_switcher/tab_switcher.scss
@@ -202,9 +202,9 @@
     }
 
     img {
-      max-height: 26px;
+      max-height: 1.9em;
       vertical-align: top;
-      margin-top: -5px;
+      margin-top: -0.3em;
     }
   }
 
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index 0e93824b7..dbd7e7e56 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -10,7 +10,7 @@
           keypath="user_reporting.title"
           class="title"
         >
-          <UserLink :user="user" />
+          <UserLink class="user-link" :user="user" />
         </i18n-t>
       </div>
       <div class="panel-body">
@@ -74,10 +74,14 @@
 <style lang="scss">
 .user-reporting-panel {
   width: 90vw;
-  max-width: 700px;
+  max-width: 50rem;
   min-height: 20vh;
   max-height: 80vh;
 
+  .user-link {
+    display: inline
+  }
+
   .panel-body {
     display: flex;
     flex-direction: column-reverse;
@@ -104,7 +108,7 @@
     }
 
     textarea.form-control {
-      line-height: 16px;
+      line-height: 1.1;
       resize: none;
       overflow: hidden;
       transition: min-height 200ms 100ms;
diff --git a/src/hocs/with_load_more/with_load_more.scss b/src/hocs/with_load_more/with_load_more.scss
index 524e4012f..6b007ac2e 100644
--- a/src/hocs/with_load_more/with_load_more.scss
+++ b/src/hocs/with_load_more/with_load_more.scss
@@ -1,6 +1,6 @@
 .with-load-more {
   &-footer {
-    padding: 10px;
+    padding: 0.9em;
     text-align: center;
     border-top: 1px solid;
     border-top-color: var(--border);
diff --git a/src/hocs/with_subscription/with_subscription.scss b/src/hocs/with_subscription/with_subscription.scss
index 996045b43..8c0af336c 100644
--- a/src/hocs/with_subscription/with_subscription.scss
+++ b/src/hocs/with_subscription/with_subscription.scss
@@ -1,6 +1,6 @@
 .with-subscription {
   &-loading {
-    padding: 10px;
+    padding: 0.7em;
     text-align: center;
 
     .error {

From 267692f56a657e79ec0ac624a3ad9269d7428051 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 17:49:06 +0300
Subject: [PATCH 14/38] improve shadows on user-card

---
 src/components/user_card/user_card.scss | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index c0d079575..19593e6a4 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -206,10 +206,10 @@
       padding: 0.6em;
       margin: -0.6em;
 
-      &.save-profile-button,
-      &.reset-profile-button,
-      &.edit-banner-button {
-        width: auto;
+      .icon {
+        filter: drop-shadow(0 0 5em var(--profileTint))
+                drop-shadow(0 0 0.5em var(--profileTint))
+                drop-shadow(0 0 0.2em var(--profileTint));
       }
 
       &:hover .icon {
@@ -273,11 +273,15 @@
     z-index: 1;
     line-height: 2em;
     text-shadow:
-      0 0 5em var(--profileTint),
       0 0 1em var(--profileTint),
       0 0 0.5em var(--profileTint),
       0 0 0.2em var(--profileTint);
 
+    .alert {
+      text-shadow: none;
+    }
+
+
     --emoji-size: 1.7em;
 
     .RichContent {

From f0250ffc525bd1d60dc9f9bc33107dd80f21713e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 17:57:38 +0300
Subject: [PATCH 15/38] fix edit banner button

---
 src/components/user_card/user_card.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index 19593e6a4..1bf3ed53b 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -212,6 +212,10 @@
                 drop-shadow(0 0 0.2em var(--profileTint));
       }
 
+      &.edit-banner-button {
+        width: auto;
+      }
+
       &:hover .icon {
         color: var(--textFaint);
       }

From c7ad009496a90392a1e112e4edfa38502d59650b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 17:58:04 +0300
Subject: [PATCH 16/38] apply shadow to everything, not just icons

---
 src/components/user_card/user_card.scss | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index 1bf3ed53b..3ff6b5666 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -205,12 +205,9 @@
       line-height: 2em;
       padding: 0.6em;
       margin: -0.6em;
-
-      .icon {
-        filter: drop-shadow(0 0 5em var(--profileTint))
-                drop-shadow(0 0 0.5em var(--profileTint))
-                drop-shadow(0 0 0.2em var(--profileTint));
-      }
+      filter: drop-shadow(0 0 5em var(--profileTint))
+              drop-shadow(0 0 0.5em var(--profileTint))
+              drop-shadow(0 0 0.2em var(--profileTint));
 
       &.edit-banner-button {
         width: auto;

From c65c0afce3209db359592adabee48b5c33e409f1 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 18:06:08 +0300
Subject: [PATCH 17/38] fix emoji input

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

diff --git a/src/components/emoji_input/emoji_input.vue b/src/components/emoji_input/emoji_input.vue
index de5ac8755..a1cba33bc 100644
--- a/src/components/emoji_input/emoji_input.vue
+++ b/src/components/emoji_input/emoji_input.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     ref="root"
-    class="emoji-input"
+    class="input emoji-input"
     :class="{ 'with-picker': !hideEmojiButton }"
   >
     <slot

From e560b1d6c704e9919dc4bc88240622fad5652f24 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 18:15:03 +0300
Subject: [PATCH 18/38] fix plasma browser?

---
 src/App.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/App.js b/src/App.js
index a251682dc..0027d908a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -214,6 +214,9 @@ export default {
       splashscreenRoot.addEventListener('transitionend', () => {
         splashscreenRoot.remove()
       })
+      setTimeout(() => {
+        splashscreenRoot.remove() // forcibly remove it, should fix my plasma browser widget t. HJ
+      }, 600)
       splashscreenRoot.classList.add('hidden')
       document.querySelector('#app').classList.remove('hidden')
     }

From 69726895b11998172b9e1d02b45c0db5c6267d4b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 18:19:57 +0300
Subject: [PATCH 19/38] changelog

---
 changelog.d/visual.change | 4 ++++
 1 file changed, 4 insertions(+)
 create mode 100644 changelog.d/visual.change

diff --git a/changelog.d/visual.change b/changelog.d/visual.change
new file mode 100644
index 000000000..c2e743cd4
--- /dev/null
+++ b/changelog.d/visual.change
@@ -0,0 +1,4 @@
+Combined subject and content fields in post form (visually)
+Fixes for some elements not scaling with user UI scale
+Moved post form's emoji button into input field
+Minor visual changes and fixes

From 9f481052d074b17c1bb86809808f1cb3af5d24c4 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 21:03:25 +0300
Subject: [PATCH 20/38] restore border for visibility notice

---
 src/components/post_status_form/post_status_form.scss | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/components/post_status_form/post_status_form.scss b/src/components/post_status_form/post_status_form.scss
index ac223edb1..f54edd00f 100644
--- a/src/components/post_status_form/post_status_form.scss
+++ b/src/components/post_status_form/post_status_form.scss
@@ -108,6 +108,12 @@
     align-items: baseline;
   }
 
+  .visibility-notice {
+    border: 1px solid var(--border);
+    border-radius: var(--roundness);
+    padding: 0.5em 1em
+  }
+
   .visibility-notice.edit-warning {
     > :first-child {
       margin-top: 0;

From 9b58b8c29048caf23467f5841e4bcd6f59b6e289 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Aug 2025 23:15:06 +0300
Subject: [PATCH 21/38] better paddings

---
 src/components/post_status_form/post_status_form.scss | 5 +++++
 src/components/post_status_form/post_status_form.vue  | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/post_status_form/post_status_form.scss b/src/components/post_status_form/post_status_form.scss
index f54edd00f..78b93fd28 100644
--- a/src/components/post_status_form/post_status_form.scss
+++ b/src/components/post_status_form/post_status_form.scss
@@ -201,6 +201,10 @@
     line-height: 1.85;
   }
 
+  .inputs-wrapper {
+    padding: 0;
+  }
+
   .input.form-post-body {
     // TODO: make a resizable textarea component?
     box-sizing: content-box; // needed for easier computation of dynamic size
@@ -208,6 +212,7 @@
     transition: min-height 200ms 100ms;
     // stock padding + 1 line of text (for counter)
     padding-bottom: calc(var(--_padding) + var(--post-line-height) * 1em);
+    padding-right: 1.5em;
     // two lines of text
     height: calc(var(--post-line-height) * 1em);
     min-height: calc(var(--post-line-height) * 1em);
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 37371f1de..f661a980d 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -156,7 +156,7 @@
             class="preview-status"
           />
         </div>
-        <div class="input">
+        <div class="input inputs-wrapper">
           <EmojiInput
             v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
             v-model="newStatus.spoilerText"

From bfd1809a34eeba9cadb3533f98735cad8cb1ec4e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 09:10:26 +0300
Subject: [PATCH 22/38] move expand click handler to StatusContent

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

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index c9b557970..d638420c7 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -13,7 +13,6 @@
     class="NotificationParent"
     :class="{ '-expandable': expandable }"
     :aria-controls="'notif-' +notification.id"
-    @click="toggleStatusExpanded()"
     v-else
   >
     <div
@@ -256,6 +255,7 @@
             :compact="!statusExpanded"
             :status="notification.status"
             :collapse="statusExpanded"
+            @click="toggleStatusExpanded()"
           />
         </template>
       </div>

From 1c0aa025a31140ed063d32b203c507befc3f12ec Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 09:13:53 +0300
Subject: [PATCH 23/38] fix shadows on profile and add spacing between user
 handle and nickname

---
 src/components/user_card/user_card.scss | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index 3ff6b5666..60ed97c9a 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -205,9 +205,6 @@
       line-height: 2em;
       padding: 0.6em;
       margin: -0.6em;
-      filter: drop-shadow(0 0 5em var(--profileTint))
-              drop-shadow(0 0 0.5em var(--profileTint))
-              drop-shadow(0 0 0.2em var(--profileTint));
 
       &.edit-banner-button {
         width: auto;
@@ -273,10 +270,9 @@
     // big one
     z-index: 1;
     line-height: 2em;
-    text-shadow:
-      0 0 1em var(--profileTint),
-      0 0 0.5em var(--profileTint),
-      0 0 0.2em var(--profileTint);
+    filter: drop-shadow(0 0 5em var(--profileTint))
+            drop-shadow(0 0 0.5em var(--profileTint))
+            drop-shadow(0 0 0.2em var(--profileTint));
 
     .alert {
       text-shadow: none;
@@ -343,6 +339,7 @@
       font-size: 0.9em;
       font-size: calc(max(90%, 2.5cqw));
       line-height: 1.5;
+      margin-top: 0.5em;
     }
 
     .lock-icon {

From 866b416dbe341e81c2b3b2ba7512dc05df886d22 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 09:14:26 +0300
Subject: [PATCH 24/38] changelog update

---
 changelog.d/visual.change | 1 +
 1 file changed, 1 insertion(+)

diff --git a/changelog.d/visual.change b/changelog.d/visual.change
index c2e743cd4..e0cd42f65 100644
--- a/changelog.d/visual.change
+++ b/changelog.d/visual.change
@@ -2,3 +2,4 @@ Combined subject and content fields in post form (visually)
 Fixes for some elements not scaling with user UI scale
 Moved post form's emoji button into input field
 Minor visual changes and fixes
+Clicking on fav/rt/emoji notifications' contents expands/collapses it

From 35fea49bd0e94d17b6b6f84764c48c0eee19d190 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 09:27:11 +0300
Subject: [PATCH 25/38] reduce bookmark action button width

---
 src/components/notification/notification.scss           | 8 +++-----
 src/components/notification/notification.vue            | 1 +
 src/components/status_action_buttons/action_button.scss | 4 ++--
 3 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/components/notification/notification.scss b/src/components/notification/notification.scss
index 9c94d4090..934d3e58d 100644
--- a/src/components/notification/notification.scss
+++ b/src/components/notification/notification.scss
@@ -1,9 +1,4 @@
 // TODO Copypaste from Status, should unify it somehow
-.NotificationParent {
-  &.-expandable {
-    cursor: pointer;
-  }
-}
 
 .Notification {
   border-bottom: 1px solid;
@@ -11,6 +6,9 @@
   overflow-wrap: break-word;
   text-wrap: pretty;
 
+  .status-content {
+    cursor: pointer;
+  }
 
   &.Status {
     /* stylelint-disable-next-line declaration-no-important */
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index d638420c7..b4398b448 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -252,6 +252,7 @@
         />
         <template v-else>
           <StatusContent
+            class="status-content"
             :compact="!statusExpanded"
             :status="notification.status"
             :collapse="statusExpanded"
diff --git a/src/components/status_action_buttons/action_button.scss b/src/components/status_action_buttons/action_button.scss
index 8c6924871..df445391a 100644
--- a/src/components/status_action_buttons/action_button.scss
+++ b/src/components/status_action_buttons/action_button.scss
@@ -26,8 +26,8 @@
     align-self: stretch;
     width: 1px;
     background-color: var(--icon);
-    margin-left: 1em;
-    margin-right: 0.5em;
+    margin-left: 0.75em;
+    margin-right: 0.125em;
   }
 
   &.-pin {

From c47bfe53ffd3fdb2f0f1765e3215b65cd0b79024 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 09:38:36 +0300
Subject: [PATCH 26/38] aria

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

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index b4398b448..28ab1b9b8 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -12,13 +12,13 @@
   <article
     class="NotificationParent"
     :class="{ '-expandable': expandable }"
-    :aria-controls="'notif-' +notification.id"
     v-else
   >
     <div
       v-if="needMute && !unmuted"
       :id="'notif-' +notification.id"
       :aria-expanded="statusExpanded"
+      :aria-controls="'notif-' +notification.id"
       class="Notification container -muted"
     >
       <small>

From 9ed2fd3c4b97850f6a4c398111e94db24a9ff50a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 09:41:08 +0300
Subject: [PATCH 27/38] default to 1rem instead 14px

---
 src/App.scss                                | 2 +-
 src/components/emoji_picker/emoji_picker.js | 2 +-
 src/components/status/status.scss           | 4 ++--
 src/modules/instance.js                     | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index be6929f69..01f24d0ca 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -21,7 +21,7 @@
 }
 
 html {
-  font-size: var(--textSize, 14px);
+  font-size: var(--textSize, 1rem);
 
   --navbar-height: var(--navbarSize, 3.5rem);
   --emoji-size: var(--emojiSize, 32px);
diff --git a/src/components/emoji_picker/emoji_picker.js b/src/components/emoji_picker/emoji_picker.js
index f9b306fb4..8e572d1d2 100644
--- a/src/components/emoji_picker/emoji_picker.js
+++ b/src/components/emoji_picker/emoji_picker.js
@@ -140,7 +140,7 @@ const EmojiPicker = {
     },
     updateEmojiSize () {
       const css = window.getComputedStyle(this.$refs.popover.$el)
-      const fontSize = css.getPropertyValue('font-size') || '14px'
+      const fontSize = css.getPropertyValue('font-size') || '1rem'
       const emojiSize = css.getPropertyValue('--emojiSize') || '2.2rem'
 
       const fontSizeUnit = fontSize.replace(/[0-9,.]+/, '').trim()
diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index 0f325ea7f..09b37aa14 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -245,8 +245,8 @@
     margin-right: 0;
 
     .emoji {
-      width: 14px;
-      height: 14px;
+      width: 1em;
+      height: 1em;
       vertical-align: middle;
       object-fit: contain;
     }
diff --git a/src/modules/instance.js b/src/modules/instance.js
index 93f81e4d8..7317debf8 100644
--- a/src/modules/instance.js
+++ b/src/modules/instance.js
@@ -108,7 +108,7 @@ const defaultState = {
   palette: null,
   style: null,
   emojiReactionsScale: 0.5,
-  textSize: '14px',
+  textSize: '1rem',
   emojiSize: '2.2rem',
   navbarSize: '3.5rem',
   panelHeaderSize: '3.2rem',

From 028556f8ab7f88ef0d0894593a11f8b449c1812b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 09:48:28 +0300
Subject: [PATCH 28/38] remove icons from "show more" since we show attachments
 anyway

---
 src/components/status_body/status_body.vue | 26 ----------------------
 1 file changed, 26 deletions(-)

diff --git a/src/components/status_body/status_body.vue b/src/components/status_body/status_body.vue
index 1035d04c6..1291533c9 100644
--- a/src/components/status_body/status_body.vue
+++ b/src/components/status_body/status_body.vue
@@ -57,32 +57,6 @@
             @click.prevent="toggleShowMore"
           >
             {{ toggleText }}
-            <template v-if="!showingMore">
-              <FAIcon
-                v-if="attachmentTypes.includes('image')"
-                icon="image"
-              />
-              <FAIcon
-                v-if="attachmentTypes.includes('video')"
-                icon="video"
-              />
-              <FAIcon
-                v-if="attachmentTypes.includes('audio')"
-                icon="music"
-              />
-              <FAIcon
-                v-if="attachmentTypes.includes('unknown')"
-                icon="file"
-              />
-              <FAIcon
-                v-if="status.poll && status.poll.options"
-                icon="poll-h"
-              />
-              <FAIcon
-                v-if="status.card"
-                icon="link"
-              />
-            </template>
           </button>
         </div>
       </div>

From 16ada7ec6c18c7fdeb4fe1d5598a27120da560da Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 09:49:28 +0300
Subject: [PATCH 29/38] add padding to compact status' poll icon

---
 src/components/status_content/status_content.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index fb08186b4..bab4f70a5 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -24,7 +24,7 @@
         />
       </div>
 
-      <div v-else-if="status.poll && status.poll.options && compact">
+      <div class="poll-icon" v-else-if="status.poll && status.poll.options && compact">
         <FAIcon
           icon="poll-h"
           size="2x"
@@ -63,5 +63,9 @@
 .StatusContent {
   flex: 1;
   min-width: 0;
+
+  .poll-icon {
+    margin: 0.5em;
+  }
 }
 </style>

From 7b2f3b648ad0e2377ea352a900663490a7738030 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 15 Aug 2025 10:03:34 +0300
Subject: [PATCH 30/38] improve visibilty of attachment buttons

---
 src/App.scss                   |  4 ++++
 src/components/button.style.js | 20 ++++++++++++++++++++
 2 files changed, 24 insertions(+)

diff --git a/src/App.scss b/src/App.scss
index 01f24d0ca..00a8e9547 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -382,6 +382,10 @@ nav {
   font-family: sans-serif;
   font-family: var(--font);
 
+  &.-transparent {
+    backdrop-filter: blur(0.125em) contrast(60%);
+  }
+
   &::-moz-focus-inner {
     border: none;
   }
diff --git a/src/components/button.style.js b/src/components/button.style.js
index ecbf54d9e..c32a232f4 100644
--- a/src/components/button.style.js
+++ b/src/components/button.style.js
@@ -64,6 +64,26 @@ export default {
         opacity: 0.5
       }
     },
+    {
+      component: 'Text',
+      parent: {
+        component: 'Button',
+        variant: 'transparent'
+      },
+      directives: {
+        textColor: '--text'
+      }
+    },
+    {
+      component: 'Icon',
+      parent: {
+        component: 'Button',
+        variant: 'transparent'
+      },
+      directives: {
+        textColor: '--text'
+      }
+    },
     {
       state: ['hover'],
       directives: {

From 0d6453baecbb1385b19fc159bce04c1b861cce5a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 19 Aug 2025 16:21:30 +0300
Subject: [PATCH 31/38] fix emoji reactions notifs being non-expandable

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

diff --git a/src/components/notification/notification.js b/src/components/notification/notification.js
index 247b73848..8692c6190 100644
--- a/src/components/notification/notification.js
+++ b/src/components/notification/notification.js
@@ -138,7 +138,7 @@ const Notification = {
       return highlightStyle(highlight[user.screen_name])
     },
     expandable () {
-      return (new Set(['like', '-pleroma:emoji_reaction', 'repeat'])).has(this.notification.type)
+      return (new Set(['like', 'pleroma:emoji_reaction', 'repeat'])).has(this.notification.type)
     },
     user () {
       return this.$store.getters.findUser(this.notification.from_profile.id)

From 26a2232e1841a359d3f34200d38ca9c897b1f30a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 19 Aug 2025 16:21:44 +0300
Subject: [PATCH 32/38] fix incorrect collapse state

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

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 28ab1b9b8..76ede11e2 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -255,7 +255,7 @@
             class="status-content"
             :compact="!statusExpanded"
             :status="notification.status"
-            :collapse="statusExpanded"
+            :collapse="!statusExpanded"
             @click="toggleStatusExpanded()"
           />
         </template>

From 8780e0191e7213b141cf36efa40365401304b06d Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 19 Aug 2025 16:35:40 +0300
Subject: [PATCH 33/38] proper collapse

---
 src/components/rich_content/rich_content.jsx | 19 +++++++++++++++++--
 src/components/status_body/status_body.vue   |  3 ++-
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx
index 9466603cd..599985c3b 100644
--- a/src/components/rich_content/rich_content.jsx
+++ b/src/components/rich_content/rich_content.jsx
@@ -86,6 +86,12 @@ export default {
       required: false,
       type: Boolean,
       default: false
+    },
+    // Collapse newlines
+    collapse: {
+      required: false,
+      type: Boolean,
+      default: false
     }
   },
   // NEVER EVER TOUCH DATA INSIDE RENDER
@@ -281,11 +287,20 @@ export default {
 
     const pass1 = convertHtmlToTree(html).map(processItem)
     const pass2 = [...pass1].reverse().map(processItemReverse).reverse()
+
     // DO NOT USE SLOTS they cause a re-render feedback loop here.
     // slots updated -> rerender -> emit -> update up the tree -> rerender -> ...
     // at least until vue3?
-    const result = <span class={['RichContent', this.faint ? '-faint' : '']}>
-      { pass2 }
+    const result =
+    <span class={['RichContent', this.faint ? '-faint' : '']}>
+      {
+        this.collapse
+          ? pass2.map(x => {
+            if (!Array.isArray(x)) return x.replace(/\n/g, ' ')
+            return x.map(y => y.type === 'br' ? ' ' : y)
+          })
+          : pass2
+      }
     </span>
 
     const event = {
diff --git a/src/components/status_body/status_body.vue b/src/components/status_body/status_body.vue
index 1291533c9..0735e8d98 100644
--- a/src/components/status_body/status_body.vue
+++ b/src/components/status_body/status_body.vue
@@ -38,7 +38,8 @@
           v-if="!hideSubjectStatus && !(singleLine && status.summary_raw_html)"
           :class="{ '-single-line': singleLine }"
           class="text media-body"
-          :html="collapse ? collapsedStatus : status.raw_html"
+          :html="status.raw_html"
+          :collapse="collapse"
           :emoji="status.emojis"
           :handle-links="true"
           :faint="compact"

From bebb3fcfa62270ee0d358febe241ebde2f4d73e3 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 19 Aug 2025 17:28:19 +0300
Subject: [PATCH 34/38] better click handler

---
 src/components/notification/notification.js   | 25 +++++++++++++++++++
 src/components/notification/notification.vue  |  4 ++-
 src/components/status_body/status_body.js     |  1 +
 .../status_content/status_content.js          |  1 +
 4 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/src/components/notification/notification.js b/src/components/notification/notification.js
index 8692c6190..3edf21de7 100644
--- a/src/components/notification/notification.js
+++ b/src/components/notification/notification.js
@@ -42,6 +42,7 @@ library.add(
 const Notification = {
   data () {
     return {
+      selecting: false,
       statusExpanded: false,
       unmuted: false,
       showingApproveConfirmDialog: false,
@@ -62,11 +63,35 @@ const Notification = {
     UserLink,
     ConfirmModal
   },
+  mounted () {
+    document.addEventListener('selectionchange', this.onContentSelect)
+  },
+  unmounted () {
+    document.removeEventListener('selectionchange', this.onContentSelect)
+  },
   methods: {
     toggleStatusExpanded () {
       if (!this.expandable) return
       this.statusExpanded = !this.statusExpanded
     },
+    onContentSelect () {
+      const { isCollapsed, anchorNode, offsetNode } = document.getSelection()
+      if (isCollapsed) {
+        this.selecting = false
+        return
+      }
+      const within = this.$refs.root.contains(anchorNode) || this.$refs.root.contains(offsetNode)
+      if (within) {
+        this.selecting = true
+      } else {
+        this.selecting = false
+      }
+    },
+    onContentClick (e) {
+      if (!this.selecting && !e.target.closest('a') && !e.target.closest('button')) {
+        this.toggleStatusExpanded()
+      }
+    },
     generateUserProfileLink (user) {
       return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)
     },
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 76ede11e2..b639b9c88 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -1,6 +1,7 @@
 <template>
   <article
     v-if="notification.type === 'mention' || notification.type === 'status'"
+    ref="root"
   >
     <Status
       class="Notification"
@@ -12,6 +13,7 @@
   <article
     class="NotificationParent"
     :class="{ '-expandable': expandable }"
+    ref="root"
     v-else
   >
     <div
@@ -256,7 +258,7 @@
             :compact="!statusExpanded"
             :status="notification.status"
             :collapse="!statusExpanded"
-            @click="toggleStatusExpanded()"
+            @click="onContentClick"
           />
         </template>
       </div>
diff --git a/src/components/status_body/status_body.js b/src/components/status_body/status_body.js
index e89d1d173..f23055955 100644
--- a/src/components/status_body/status_body.js
+++ b/src/components/status_body/status_body.js
@@ -41,6 +41,7 @@ const StatusContent = {
       parseReadyDone: false
     }
   },
+  emits: ['parseReady'],
   computed: {
     localCollapseSubjectDefault () {
       return this.mergedConfig.collapseMessageWithSubject
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index f61ba0d05..364123f49 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -65,6 +65,7 @@ const StatusContent = {
     'controlledShowingLongSubject',
     'controlledToggleShowingLongSubject'
   ],
+  emits: ['parseReady', 'mediaplay', 'mediapause'],
   data () {
     return {
       uncontrolledShowingTall: this.fullContent || (this.inConversation && this.focused),

From 528cc9f388c1abb893152c89a1113b1e1210c635 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 21 Aug 2025 17:20:33 +0300
Subject: [PATCH 35/38] fix emoji vertical alignment when using stealer

---
 src/components/rich_content/rich_content.scss | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/components/rich_content/rich_content.scss b/src/components/rich_content/rich_content.scss
index 6b70d1356..400b553ce 100644
--- a/src/components/rich_content/rich_content.scss
+++ b/src/components/rich_content/rich_content.scss
@@ -78,6 +78,11 @@
     max-height: 400px;
     vertical-align: middle;
     object-fit: contain;
+
+    // fix vertical alignment of stealable emoji
+    button {
+      display: inline-flex;
+    }
   }
 
   .greentext {

From 8f320faa2d45d16427b61ba7366ba50f39991566 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 21 Aug 2025 17:33:57 +0300
Subject: [PATCH 36/38] lint

---
 src/components/notification/notification.vue           |  4 ++--
 .../settings_modal/helpers/emoji_editing_popover.vue   |  5 ++++-
 .../settings_modal/tabs/theme_tab/theme_preview.vue    | 10 ++++++++--
 src/components/status_content/status_content.vue       |  5 ++++-
 .../still-image/still-image-emoji-popover.vue          |  2 +-
 .../user_reporting_modal/user_reporting_modal.vue      |  5 ++++-
 6 files changed, 23 insertions(+), 8 deletions(-)

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 118c1ba0e..7165289dc 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -11,10 +11,10 @@
     />
   </article>
   <article
+    v-else
+    ref="root"
     class="NotificationParent"
     :class="{ '-expandable': expandable }"
-    ref="root"
-    v-else
   >
     <div
       v-if="needMute && !unmuted"
diff --git a/src/components/settings_modal/helpers/emoji_editing_popover.vue b/src/components/settings_modal/helpers/emoji_editing_popover.vue
index e466822b3..d25b02da2 100644
--- a/src/components/settings_modal/helpers/emoji_editing_popover.vue
+++ b/src/components/settings_modal/helpers/emoji_editing_popover.vue
@@ -27,7 +27,10 @@
         class="emoji"
       />
 
-      <div v-if="newUpload" class="emoji-tab-popover-new-upload">
+      <div
+        v-if="newUpload"
+        class="emoji-tab-popover-new-upload"
+      >
         <h4>{{ $t('admin_dash.emoji.emoji_source') }}</h4>
 
         <div class="emoji-tab-popover-input">
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_preview.vue b/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
index 016d84c49..df2d9f9e9 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
@@ -21,7 +21,10 @@
       </div>
       <div class="panel-body theme-preview-content">
         <div class="post">
-          <div class="avatar still-image" aria-hidden="true">
+          <div
+            class="avatar still-image"
+            aria-hidden="true"
+          >
             ( ͡° ͜ʖ ͡°)
           </div>
           <div class="content">
@@ -71,7 +74,10 @@
         </div>
 
         <div class="after-post">
-          <div class="avatar-alt" aria-hidden="true">
+          <div
+            class="avatar-alt"
+            aria-hidden="true"
+          >
             :^)
           </div>
           <div class="content">
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index bab4f70a5..460a0714b 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -24,7 +24,10 @@
         />
       </div>
 
-      <div class="poll-icon" v-else-if="status.poll && status.poll.options && compact">
+      <div
+        v-else-if="status.poll && status.poll.options && compact"
+        class="poll-icon"
+      >
         <FAIcon
           icon="poll-h"
           size="2x"
diff --git a/src/components/still-image/still-image-emoji-popover.vue b/src/components/still-image/still-image-emoji-popover.vue
index 8588d5165..8317c6a0c 100644
--- a/src/components/still-image/still-image-emoji-popover.vue
+++ b/src/components/still-image/still-image-emoji-popover.vue
@@ -25,8 +25,8 @@
           <button
             class="button button-default btn emoji-popover-button"
             type="button"
-            @click="copyToLocalPack"
             :disabled="packName == ''"
+            @click="copyToLocalPack"
           >
             {{ $t('admin_dash.emoji.copy_to_pack') }}
           </button>
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index dbd7e7e56..aa5704a97 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -10,7 +10,10 @@
           keypath="user_reporting.title"
           class="title"
         >
-          <UserLink class="user-link" :user="user" />
+          <UserLink
+            class="user-link"
+            :user="user"
+          />
         </i18n-t>
       </div>
       <div class="panel-body">

From 798178a86fcee3439282820085219a7f2aca28d6 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 21 Aug 2025 17:36:43 +0300
Subject: [PATCH 37/38] lint

---
 src/components/rich_content/rich_content.scss | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/rich_content/rich_content.scss b/src/components/rich_content/rich_content.scss
index 400b553ce..d2ec77dcb 100644
--- a/src/components/rich_content/rich_content.scss
+++ b/src/components/rich_content/rich_content.scss
@@ -64,6 +64,11 @@
 
   .img {
     display: inline-block;
+
+    // fix vertical alignment of stealable emoji
+    button {
+      display: inline-flex;
+    }
   }
 
   .emoji {
@@ -78,11 +83,6 @@
     max-height: 400px;
     vertical-align: middle;
     object-fit: contain;
-
-    // fix vertical alignment of stealable emoji
-    button {
-      display: inline-flex;
-    }
   }
 
   .greentext {

From 542db846a6448a3e1262541c7d8c6a10abb6bc3f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 21 Aug 2025 17:40:42 +0300
Subject: [PATCH 38/38] =?UTF-8?q?px=20->=20em=20for=20repr=C3=B6=C3=B6ter?=
 =?UTF-8?q?=20bar?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/status/status.scss | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index 09b37aa14..511a74074 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -235,9 +235,9 @@
 
   .repeater-avatar {
     border-radius: var(--roundness);
-    margin-left: 28px;
-    width: 20px;
-    height: 20px;
+    margin-left: 2em; // 3.5 (poster avatar size) - 1.5 (repeater avatar size)
+    width: 1.5em;
+    height: 1.5em;
   }
 
   .repeater-name {