Move bubble timeline and change icon

src/components/desktop_nav/desktop_nav.vue

@@ -55,18 +55,6 @@
               :title="$t('nav.public_tl')"
             />
           </router-link>
-          <router-link
-            v-if="currentUser && showBubbleTimeline"
-            :to="{ name: 'bubble-timeline' }"
-            class="nav-icon"
-          >
-            <FAIcon
-              fixed-width
-              class="fa-scale-110 fa-old-padding"
-              icon="circle"
-              :title="$t('nav.bubble_timeline')"
-            />
-          </router-link>
           <router-link
             v-if="federating && (currentUser || !(privateMode || restrictedTimelines.federated))"
             :to="{ name: 'public-external-timeline' }"
@@ -79,6 +67,18 @@
               :title="$t('nav.twkn')"
             />
           </router-link>
+          <router-link
+            v-if="currentUser && showBubbleTimeline"
+            :to="{ name: 'bubble-timeline' }"
+            class="nav-icon"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="comment-medical"
+              :title="$t('nav.bubble_timeline')"
+            />
+          </router-link>
         </div>
       </div>
       <router-link

src/components/timeline_menu/timeline_menu_content.js

@@ -6,7 +6,7 @@ import {
   faBookmark,
   faEnvelope,
   faHome,
-  faCircle
+  faCommentMedical
 } from '@fortawesome/free-solid-svg-icons'
 
 library.add(
@@ -15,7 +15,7 @@ library.add(
   faBookmark,
   faEnvelope,
   faHome,
-  faCircle
+  faCommentMedical
 )
 
 const TimelineMenuContent = {

src/components/timeline_menu/timeline_menu_content.vue

@@ -16,22 +16,6 @@
         >{{ $t("nav.home_timeline") }}</span>
       </router-link>
     </li>
-    <li v-if="currentUser && showBubbleTimeline">
-      <router-link
-        class="menu-item"
-        :to="{ name: 'bubble-timeline' }"
-      >
-        <FAIcon
-          fixed-width
-          class="fa-scale-110 fa-old-padding "
-          icon="circle"
-        />
-        <span
-          :title="$t('nav.bubble_timeline_description')"
-          :aria-label="$t('nav.bubble_timeline_description')"
-        >{{ $t("nav.bubble_timeline") }}</span>
-      </router-link>
-    </li>
     <li v-if="currentUser || !(privateMode || restrictedTimelines.public)">
       <router-link
         class="menu-item"
@@ -64,6 +48,22 @@
         >{{ $t("nav.twkn") }}</span>
       </router-link>
     </li>
+    <li v-if="currentUser && showBubbleTimeline">
+      <router-link
+        class="menu-item"
+        :to="{ name: 'bubble-timeline' }"
+      >
+        <FAIcon
+          fixed-width
+          class="fa-scale-110 fa-old-padding "
+          icon="comment-medical"
+        />
+        <span
+          :title="$t('nav.bubble_timeline_description')"
+          :aria-label="$t('nav.bubble_timeline_description')"
+        >{{ $t("nav.bubble_timeline") }}</span>
+      </router-link>
+    </li>
     <li v-if="currentUser">
       <router-link
         class="menu-item"