aboutsummaryrefslogtreecommitdiff
path: root/src/components/timeline_menu/timeline_menu.vue
blob: dfdf7180b961bbf11773d20f389cb73b065ceb91 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<template>
  <Popover
    trigger="click"
    class="timeline-menu"
    popover-class="nav-panel timeline-menu-popover"
  >
    <div slot="content">
      <ul>
        <li v-if="currentUser">
          <router-link :to="{ name: 'friends' }">
            <i class="button-icon icon-home-2" /> {{ $t("nav.timeline") }}
          </router-link>
        </li>
        <li v-if="currentUser">
          <router-link :to="{ name: 'dms', params: { username: currentUser.screen_name } }">
            <i class="button-icon icon-mail-alt" /> {{ $t("nav.dms") }}
          </router-link>
        </li>
        <li v-if="currentUser || !privateMode">
          <router-link :to="{ name: 'public-timeline' }">
            <i class="button-icon icon-users" /> {{ $t("nav.public_tl") }}
          </router-link>
        </li>
        <li v-if="federating && (currentUser || !privateMode)">
          <router-link :to="{ name: 'public-external-timeline' }">
            <i class="button-icon icon-globe" /> {{ $t("nav.twkn") }}
          </router-link>
        </li>
      </ul>
    </div>
    <div
      slot="trigger"
      class="title timeline-menu-title"
    >
      {{ timelineNamesForRoute[$route.name] }}
      <i class="icon-down-open" />
    </div>
  </Popover>
</template>

<script src="./timeline_menu.js" ></script>

<style lang="scss">
@import '../../_variables.scss';

.timeline-menu {
  flex-grow: 1;
  .timeline-menu-popover {
    width: 20rem;
    font-size: 1rem;
    margin-left: -0.6em;
    margin-top: 0.6em;
  }

  .timeline-menu-title {
    flex-grow: 0;
    width: 20rem;
    margin: 0;
  }
}

</style>