From 01d8fa4e543b0a349c95ea7e60a79cf5ecc82157 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 23 Mar 2022 16:31:34 +0200
Subject: fix i18n at places

---
 src/components/conversation/conversation.vue | 46 ++++++++++++++++------------
 1 file changed, 26 insertions(+), 20 deletions(-)

(limited to 'src/components/conversation/conversation.vue')

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 7628ceaa..39c5db33 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -27,20 +27,23 @@
           v-if="shouldShowAllConversationButton"
           class="conversation-dive-to-top-level-box"
         >
-          <i18n
-            path="status.show_all_conversation_with_icon"
+          <i18n-t
+            keypath="status.show_all_conversation_with_icon"
             tag="button"
             class="button-unstyled -link"
             @click.prevent="diveToTopLevel"
           >
-            <FAIcon
-              place="icon"
-              icon="angle-double-left"
-            />
-            <span place="text">
-              {{ $tc('status.show_all_conversation', otherTopLevelCount, { numStatus: otherTopLevelCount }) }}
-            </span>
-          </i18n>
+            <template #icon>
+              <FAIcon
+                icon="angle-double-left"
+              />
+            </template>
+            <template #text>
+              <span>
+                {{ $tc('status.show_all_conversation', otherTopLevelCount, { numStatus: otherTopLevelCount }) }}
+              </span>
+            </template>
+          </i18n-t>
         </div>
         <div
           v-if="shouldShowAncestors"
@@ -96,20 +99,23 @@
               <div
                 class="thread-ancestor-dive-box-inner"
               >
-                <i18n
+                <i18n-t
                   tag="button"
-                  path="status.ancestor_follow_with_icon"
+                  keypath="status.ancestor_follow_with_icon"
                   class="button-unstyled -link thread-tree-show-replies-button"
                   @click.prevent="diveIntoStatus(status.id)"
                 >
-                  <FAIcon
-                    place="icon"
-                    icon="angle-double-right"
-                  />
-                  <span place="text">
-                    {{ $tc('status.ancestor_follow', getReplies(status.id).length - 1, { numReplies: getReplies(status.id).length - 1 }) }}
-                  </span>
-                </i18n>
+                  <template #icon>
+                    <FAIcon
+                      icon="angle-double-right"
+                    />
+                  </template>
+                  <template #text>
+                    <span>
+                      {{ $tc('status.ancestor_follow', getReplies(status.id).length - 1, { numReplies: getReplies(status.id).length - 1 }) }}
+                    </span>
+                  </template>
+                </i18n-t>
               </div>
             </div>
           </div>
-- 
cgit v1.2.3-70-g09d2


From afcfcce2e61ab5a4be8b618e61572d8eabe4ac7e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 15:46:21 +0300
Subject: re-fix i18n warnings again

---
 src/components/conversation/conversation.vue             | 2 ++
 src/components/post_status_form/post_status_form.vue     | 1 +
 src/components/settings_modal/tabs/theme_tab/preview.vue | 3 ++-
 3 files changed, 5 insertions(+), 1 deletion(-)

(limited to 'src/components/conversation/conversation.vue')

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 39c5db33..ccc523a2 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -32,6 +32,7 @@
             tag="button"
             class="button-unstyled -link"
             @click.prevent="diveToTopLevel"
+            scope="global"
           >
             <template #icon>
               <FAIcon
@@ -101,6 +102,7 @@
               >
                 <i18n-t
                   tag="button"
+                  scope="global"
                   keypath="status.ancestor_follow_with_icon"
                   class="button-unstyled -link thread-tree-show-replies-button"
                   @click.prevent="diveIntoStatus(status.id)"
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 45ec9656..8c0b74a3 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -23,6 +23,7 @@
           keypath="post_status.account_not_locked_warning"
           tag="p"
           class="visibility-notice"
+          scope="global"
         >
           <button
             class="button-unstyled -link"
diff --git a/src/components/settings_modal/tabs/theme_tab/preview.vue b/src/components/settings_modal/tabs/theme_tab/preview.vue
index 36613d20..f266b603 100644
--- a/src/components/settings_modal/tabs/theme_tab/preview.vue
+++ b/src/components/settings_modal/tabs/theme_tab/preview.vue
@@ -29,7 +29,7 @@
               {{ $t('settings.style.preview.content') }}
             </h4>
 
-            <i18n-t keypath="settings.style.preview.text">
+            <i18n-t scope="global" keypath="settings.style.preview.text">
               <code style="font-family: var(--postCodeFont)">
                 {{ $t('settings.style.preview.mono') }}
               </code>
@@ -76,6 +76,7 @@
               keypath="settings.style.preview.fine_print"
               tag="span"
               class="faint"
+              scope="global"
             >
               <a style="color: var(--faintLink)">
                 {{ $t('settings.style.preview.faint_link') }}
-- 
cgit v1.2.3-70-g09d2


From 684650e14fd88e47180b2feda6c5cff9171eb566 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 10 Apr 2022 14:47:47 +0300
Subject: restore margins for inline convos

---
 src/App.scss                                 | 1 +
 src/components/conversation/conversation.vue | 3 +++
 2 files changed, 4 insertions(+)

(limited to 'src/components/conversation/conversation.vue')

diff --git a/src/App.scss b/src/App.scss
index bed67a1f..678c4410 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -166,6 +166,7 @@ nav {
   --miniColumn: 25em;
   --maxiColumn: minmax(var(--miniColumn), 45em);
   --columnGap: 1em;
+  --status-margin: 0.75em;
 
   position: relative;
   display: grid;
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index ccc523a2..04078cf4 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -270,5 +270,8 @@
     border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
     border-bottom: 1px solid var(--border, $fallback--border);
   }
+  &.-expanded {
+    margin: calc(var(--status-margin, $status-margin) / 2);
+  }
 }
 </style>
-- 
cgit v1.2.3-70-g09d2


From d9f8091ce648d033a69b47d811edf1c8019fb179 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 10 Apr 2022 19:28:52 +0300
Subject: fix extra padding in thread view

---
 src/components/conversation/conversation.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'src/components/conversation/conversation.vue')

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 04078cf4..2e7f8684 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -270,7 +270,8 @@
     border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
     border-bottom: 1px solid var(--border, $fallback--border);
   }
-  &.-expanded {
+
+  &.-expanded.status-fadein {
     margin: calc(var(--status-margin, $status-margin) / 2);
   }
 }
-- 
cgit v1.2.3-70-g09d2


From bb29218a6cb3682d230c12c630916562f8b24028 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 19 Apr 2022 23:06:57 +0300
Subject: fixate conversation heading

---
 src/components/conversation/conversation.vue | 2 +-
 src/components/timeline/timeline.scss        | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

(limited to 'src/components/conversation/conversation.vue')

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 2e7f8684..c2c323c1 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -7,7 +7,7 @@
   >
     <div
       v-if="isExpanded"
-      class="panel-heading conversation-heading"
+      class="panel-heading conversation-heading -sticky"
     >
       <span class="title"> {{ $t('timeline.conversation') }} </span>
       <button
diff --git a/src/components/timeline/timeline.scss b/src/components/timeline/timeline.scss
index c10375d4..ae8324b3 100644
--- a/src/components/timeline/timeline.scss
+++ b/src/components/timeline/timeline.scss
@@ -27,4 +27,8 @@
   .timeline-footer {
     border: none;
   }
+
+  .conversation-heading {
+    top: calc(var(--panel-heading-height) * 2);
+  }
 }
-- 
cgit v1.2.3-70-g09d2


From 2a6f42fef3ff9c087aab4589d229e0f6c1b45c90 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 25 Apr 2022 23:50:22 +0300
Subject: unified how panel-footer works between regular timelines and user
 timeline

---
 src/components/conversation/conversation.vue    |  5 ++
 src/components/notifications/notifications.scss |  8 ++--
 src/components/notifications/notifications.vue  |  2 +-
 src/components/timeline/timeline.js             |  3 +-
 src/components/timeline/timeline.vue            | 62 +++++++++++++------------
 src/components/user_profile/user_profile.js     |  6 ++-
 src/components/user_profile/user_profile.vue    |  4 ++
 7 files changed, 53 insertions(+), 37 deletions(-)

(limited to 'src/components/conversation/conversation.vue')

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index c2c323c1..48e7934c 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -223,6 +223,7 @@
     --text: var(--faint);
     color: var(--text);
   }
+
   .thread-ancestor-dive-box {
     padding-left: var(--status-margin, $status-margin);
     border-bottom-width: 1px;
@@ -254,6 +255,10 @@
     border-bottom: none;
   }
 
+  &:last-child .conversation-status {
+    border-bottom: none;
+  }
+
   .thread-ancestors + .thread-tree > .conversation-status {
     border-top-width: 1px;
     border-top-style: solid;
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index 976688d1..07abee27 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -11,10 +11,6 @@
     color: var(--text, $fallback--text);
   }
 
-  .notifications-footer {
-    border: none;
-  }
-
   .notification {
     position: relative;
 
@@ -47,6 +43,10 @@
     }
   }
 
+  &:last-child .Notification {
+    border-bottom: none;
+  }
+
   .non-mention {
     display: flex;
     flex: 1;
diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue
index bfc97dc0..d5b2d1d5 100644
--- a/src/components/notifications/notifications.vue
+++ b/src/components/notifications/notifications.vue
@@ -36,7 +36,7 @@
             <notification :notification="notification" />
           </div>
         </div>
-        <div class="panel-footer notifications-footer">
+        <div class="panel-footer">
           <div
             v-if="bottomedOut"
             class="new-status-notification text-center faint"
diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js
index f79b5167..94f0e916 100644
--- a/src/components/timeline/timeline.js
+++ b/src/components/timeline/timeline.js
@@ -22,7 +22,8 @@ const Timeline = {
     'embedded',
     'count',
     'pinnedStatusIds',
-    'inProfile'
+    'inProfile',
+    'footerSlipgate' // reference to an element where we should put our footer
   ],
   data () {
     return {
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index 958808f6..ebf8ab52 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -46,37 +46,39 @@
       </div>
     </div>
     <div :class="classes.footer">
-      <div
-        v-if="count===0"
-        class="new-status-notification text-center faint"
-      >
-        {{ $t('timeline.no_statuses') }}
-      </div>
-      <div
-        v-else-if="bottomedOut"
-        class="new-status-notification text-center faint"
-      >
-        {{ $t('timeline.no_more_statuses') }}
-      </div>
-      <button
-        v-else-if="!timeline.loading"
-        class="button-unstyled -link"
-        @click.prevent="fetchOlderStatuses()"
-      >
-        <div class="new-status-notification text-center">
-          {{ $t('timeline.load_older') }}
+      <teleport :to="footerSlipgate" :disabled="!embedded || !footerSlipgate">
+        <div
+          v-if="count===0"
+          class="new-status-notification text-center faint"
+        >
+          {{ $t('timeline.no_statuses') }}
         </div>
-      </button>
-      <div
-        v-else
-        class="new-status-notification text-center"
-      >
-        <FAIcon
-          icon="circle-notch"
-          spin
-          size="lg"
-        />
-      </div>
+        <div
+          v-else-if="bottomedOut"
+          class="new-status-notification text-center faint"
+        >
+          {{ $t('timeline.no_more_statuses') }}
+        </div>
+        <button
+          v-else-if="!timeline.loading"
+          class="button-unstyled -link"
+          @click.prevent="fetchOlderStatuses()"
+        >
+          <div class="new-status-notification text-center">
+            {{ $t('timeline.load_older') }}
+          </div>
+        </button>
+        <div
+          v-else
+          class="new-status-notification text-center"
+        >
+          <FAIcon
+            icon="circle-notch"
+            spin
+            size="lg"
+          />
+        </div>
+      </teleport>
     </div>
   </div>
 </template>
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index eeb6ea40..f779b823 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -39,7 +39,8 @@ const UserProfile = {
     return {
       error: false,
       userId: null,
-      tab: defaultTabKey
+      tab: defaultTabKey,
+      footerRef: null
     }
   },
   created () {
@@ -78,6 +79,9 @@ const UserProfile = {
     }
   },
   methods: {
+    setFooterRef (el) {
+      this.footerRef = el
+    },
     load (userNameOrId) {
       const startFetchingTimeline = (timeline, userId) => {
         // Clear timeline only if load another user's profile
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 67966ff4..74d101c4 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -56,6 +56,7 @@
           :user-id="userId"
           :pinned-status-ids="user.pinnedStatusIds"
           :in-profile="true"
+          :footerSlipgate="footerRef"
         />
         <div
           v-if="followsTabVisible"
@@ -94,6 +95,7 @@
           :timeline="media"
           :user-id="userId"
           :in-profile="true"
+          :footerSlipgate="footerRef"
         />
         <Timeline
           v-if="isUs"
@@ -105,8 +107,10 @@
           timeline-name="favorites"
           :timeline="favorites"
           :in-profile="true"
+          :footerSlipgate="footerRef"
         />
       </tab-switcher>
+      <div class="panel-footer" :ref="setFooterRef"></div>
     </div>
     <div
       v-else
-- 
cgit v1.2.3-70-g09d2


From deece5758437d305d8df3db87c5012322e1e53c8 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 26 Apr 2022 00:10:33 +0300
Subject: better formatting

---
 src/components/conversation/conversation.vue | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

(limited to 'src/components/conversation/conversation.vue')

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 48e7934c..ccedc121 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -251,14 +251,11 @@
   .thread-ancestor-has-other-replies .conversation-status,
   .thread-ancestor:last-child .conversation-status,
   .thread-ancestor:last-child .thread-ancestor-dive-box,
+  &:last-child .conversation-status,
   &.-expanded .thread-tree .conversation-status {
     border-bottom: none;
   }
 
-  &:last-child .conversation-status {
-    border-bottom: none;
-  }
-
   .thread-ancestors + .thread-tree > .conversation-status {
     border-top-width: 1px;
     border-top-style: solid;
-- 
cgit v1.2.3-70-g09d2


From 54a40bfa01b64214b45f1d1142cb6bc2909a8673 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 9 May 2022 23:18:39 +0300
Subject: fix inline conversation's shadow showing through outer header

---
 src/components/conversation/conversation.vue | 2 ++
 src/panel.scss                               | 4 ++--
 2 files changed, 4 insertions(+), 2 deletions(-)

(limited to 'src/components/conversation/conversation.vue')

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index ccedc121..6088e1ca 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -201,6 +201,8 @@
 @import '../../_variables.scss';
 
 .Conversation {
+  z-index: 1;
+
   .conversation-dive-to-top-level-box {
     padding: var(--status-margin, $status-margin);
     border-bottom-width: 1px;
diff --git a/src/panel.scss b/src/panel.scss
index a14e732f..3a814269 100644
--- a/src/panel.scss
+++ b/src/panel.scss
@@ -18,7 +18,7 @@
     bottom: 0;
     left: 0;
     right: 0;
-    z-index: 3;
+    z-index: 5;
     box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6);
     box-shadow: var(--panelShadow);
     pointer-events: none;
@@ -60,7 +60,7 @@
   padding: 0.6em;
   height: var(--__panel-heading-height);
   line-height: var(--__panel-heading-height-inner);
-  z-index: 3;
+  z-index: 4;
 
   &.-flexible-height {
     --__panel-heading-height: auto;
-- 
cgit v1.2.3-70-g09d2