From feb8a17b907fb979ce37142b1ad8302fd12e3ee3 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 29 Jun 2022 21:12:56 +0300
Subject: [PATCH 1/3] Revert "unify styling of timelines dropdown with other
 dropdown menus"

This reverts commit 898b326f6c9da3ba26ad35b2349c2a3f9fc0484a.
---
 .../timeline_menu/timeline_menu_content.vue   | 119 +++++++++---------
 1 file changed, 62 insertions(+), 57 deletions(-)

diff --git a/src/components/timeline_menu/timeline_menu_content.vue b/src/components/timeline_menu/timeline_menu_content.vue
index 6caf688ee..bed1b679a 100644
--- a/src/components/timeline_menu/timeline_menu_content.vue
+++ b/src/components/timeline_menu/timeline_menu_content.vue
@@ -1,61 +1,66 @@
 <template>
-  <div class="dropdown-menu">
-    <router-link
-      v-if="currentUser"
-      class="dropdown-item button-default"
-      :to="{ name: 'friends' }"
-    >
-      <FAIcon
-        fixed-width
-        class="fa-scale-110 fa-old-padding "
-        icon="home"
-      />{{ $t("nav.home_timeline") }}
-    </router-link>
-    <router-link
-      v-if="currentUser || !privateMode"
-      class="dropdown-item button-default"
-      :to="{ name: 'public-timeline' }"
-    >
-      <FAIcon
-        fixed-width
-        class="fa-scale-110 fa-old-padding "
-        icon="users"
-      />{{ $t("nav.public_tl") }}
-    </router-link>
-    <router-link
-      v-if="federating && (currentUser || !privateMode)"
-      class="dropdown-item button-default"
-      :to="{ name: 'public-external-timeline' }"
-    >
-      <FAIcon
-        fixed-width
-        class="fa-scale-110 fa-old-padding "
-        icon="globe"
-      />{{ $t("nav.twkn") }}
-    </router-link>
-    <router-link
-      v-if="currentUser"
-      class="dropdown-item button-default"
-      :to="{ name: 'bookmarks'}"
-    >
-      <FAIcon
-        fixed-width
-        class="fa-scale-110 fa-old-padding "
-        icon="bookmark"
-      />{{ $t("nav.bookmarks") }}
-    </router-link>
-    <router-link
-      v-if="currentUser"
-      class="dropdown-item button-default"
-      :to="{ name: 'dms', params: { username: currentUser.screen_name } }"
-    >
-      <FAIcon
-        fixed-width
-        class="fa-scale-110 fa-old-padding "
-        icon="envelope"
-      />{{ $t("nav.dms") }}
-    </router-link>
-  </div>
+  <ul>
+    <li v-if="currentUser">
+      <router-link
+        class="menu-item"
+        :to="{ name: 'friends' }"
+      >
+        <FAIcon
+          fixed-width
+          class="fa-scale-110 fa-old-padding "
+          icon="home"
+        />{{ $t("nav.home_timeline") }}
+      </router-link>
+    </li>
+    <li v-if="currentUser || !privateMode">
+      <router-link
+        class="menu-item"
+        :to="{ name: 'public-timeline' }"
+      >
+        <FAIcon
+          fixed-width
+          class="fa-scale-110 fa-old-padding "
+          icon="users"
+        />{{ $t("nav.public_tl") }}
+      </router-link>
+    </li>
+    <li v-if="federating && (currentUser || !privateMode)">
+      <router-link
+        class="menu-item"
+        :to="{ name: 'public-external-timeline' }"
+      >
+        <FAIcon
+          fixed-width
+          class="fa-scale-110 fa-old-padding "
+          icon="globe"
+        />{{ $t("nav.twkn") }}
+      </router-link>
+    </li>
+    <li v-if="currentUser">
+      <router-link
+        class="menu-item"
+        :to="{ name: 'bookmarks'}"
+      >
+        <FAIcon
+          fixed-width
+          class="fa-scale-110 fa-old-padding "
+          icon="bookmark"
+        />{{ $t("nav.bookmarks") }}
+      </router-link>
+    </li>
+    <li v-if="currentUser">
+      <router-link
+        class="menu-item"
+        :to="{ name: 'dms', params: { username: currentUser.screen_name } }"
+      >
+        <FAIcon
+          fixed-width
+          class="fa-scale-110 fa-old-padding "
+          icon="envelope"
+        />{{ $t("nav.dms") }}
+      </router-link>
+    </li>
+  </ul>
 </template>
 
 <script src="./timeline_menu_content.js" ></script>

From 14f48ed4abe236d939795b6c1ccc1e0e10c07bb9 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 29 Jun 2022 21:40:44 +0300
Subject: [PATCH 2/3] re-unfuck the timeline popover

---
 .../timeline_menu/timeline_menu.vue           | 46 ++++++-------------
 1 file changed, 15 insertions(+), 31 deletions(-)

diff --git a/src/components/timeline_menu/timeline_menu.vue b/src/components/timeline_menu/timeline_menu.vue
index 611194820..e6125d856 100644
--- a/src/components/timeline_menu/timeline_menu.vue
+++ b/src/components/timeline_menu/timeline_menu.vue
@@ -3,19 +3,17 @@
     trigger="click"
     class="TimelineMenu"
     :class="{ 'open': isOpen }"
-    :margin="{ left: -15, right: -200 }"
     :bound-to="{ x: 'container' }"
-    popover-class="timeline-menu-popover-wrap"
+    bound-to-selector=".Timeline"
+    popover-class="timeline-menu-popover popover-default"
     @show="openMenu"
     @close="() => isOpen = false"
   >
     <template v-slot:content>
-      <div class="timeline-menu-popover popover-default">
-        <TimelineMenuContent />
-      </div>
+      <TimelineMenuContent />
     </template>
     <template v-slot:trigger>
-      <button class="button-unstyled title timeline-menu-title">
+      <span class="button-unstyled title timeline-menu-title">
         <span class="timeline-title">{{ timelineName() }}</span>
         <span>
           <FAIcon
@@ -27,7 +25,7 @@
           class="click-blocker"
           @click="blockOpen"
         />
-      </button>
+      </span>
     </template>
   </Popover>
 </template>
@@ -38,42 +36,18 @@
 @import '../../_variables.scss';
 
 .TimelineMenu {
-  flex-shrink: 1;
   margin-right: auto;
   min-width: 0;
-  width: 24rem;
 
   .popover-trigger-button {
     vertical-align: bottom;
   }
 
-  .timeline-menu-popover-wrap {
-    overflow: hidden;
-    // Match panel heading padding to line up menu with bottom of heading
-    margin-top: 0.6rem;
-    padding: 0 15px 15px 15px;
-  }
-
-  .timeline-menu-popover {
-    width: 24rem;
-    max-width: 100vw;
-    margin: 0;
-    font-size: 1rem;
-    border-top-right-radius: 0;
-    border-top-left-radius: 0;
-    transform: translateY(-100%);
-    transition: transform 100ms;
-  }
-
   .panel::after {
     border-top-right-radius: 0;
     border-top-left-radius: 0;
   }
 
-  &.open .timeline-menu-popover {
-    transform: translateY(0);
-  }
-
   .timeline-menu-title {
     margin: 0;
     cursor: pointer;
@@ -108,6 +82,16 @@
     box-shadow: var(--popoverShadow);
   }
 
+}
+
+.timeline-menu-popover {
+  min-width: 24rem;
+  max-width: 100vw;
+  margin-top: 0.6rem;
+  font-size: 1rem;
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+
   ul {
     list-style: none;
     margin: 0;

From 54ab1ed741984ef0a81019bde053f441f99eaab2 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 29 Jun 2022 21:40:54 +0300
Subject: [PATCH 3/3] fix the incorrect rounding in nav list

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

diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue
index 7ae7b1d6e..62aab7f16 100644
--- a/src/components/nav_panel/nav_panel.vue
+++ b/src/components/nav_panel/nav_panel.vue
@@ -113,7 +113,9 @@
     border-color: $fallback--border;
     border-color: var(--border, $fallback--border);
     padding: 0;
+  }
 
+  > li {
     &:first-child .menu-item {
       border-top-right-radius: $fallback--panelRadius;
       border-top-right-radius: var(--panelRadius, $fallback--panelRadius);