From 898b326f6c9da3ba26ad35b2349c2a3f9fc0484a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 27 Jun 2022 19:10:18 +0300
Subject: [PATCH] unify styling of timelines dropdown with other dropdown menus

---
 .../timeline_menu/timeline_menu_content.vue   | 119 +++++++++---------
 1 file changed, 57 insertions(+), 62 deletions(-)

diff --git a/src/components/timeline_menu/timeline_menu_content.vue b/src/components/timeline_menu/timeline_menu_content.vue
index bed1b679..6caf688e 100644
--- a/src/components/timeline_menu/timeline_menu_content.vue
+++ b/src/components/timeline_menu/timeline_menu_content.vue
@@ -1,66 +1,61 @@
 <template>
-  <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>
+  <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>
 </template>
 
 <script src="./timeline_menu_content.js" ></script>